@pega/cosmos-react-demos 3.0.0-dev.4.2 → 3.0.0-dev.7.0

package/lib/build/ObjectSelect/ObjectSelect.mocks.js

@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // cSpell:words XPTI
 import { useState } from 'react';
 import { AtomicCondition, getInitConditionForLhs, formatCondition } from '@pega/cosmos-react-condition-builder';
-import { Button, Flex, Input, Card, CardContent, Drawer, Text, FieldValueList, Icon, menuHelpers, useI18n } from '@pega/cosmos-react-core';
-import { ObjectSelect } from '@pega/cosmos-react-build';
-import { StyledDrawerContent, StyledCodeBlock } from './ObjectSelect.styles';
+import { Flex, Input, Card, CardContent, Text, menuHelpers, useI18n, StyledRegion } from '@pega/cosmos-react-core';
+import { ObjectSelect, ObjectPreview } from '@pega/cosmos-react-build';
+import { StyledCodeBlock, StyledConfigurationContent } from './ObjectSelect.styles';
 export const skeletonData = [
     {
         id: '01-1',
@@ -45,24 +45,48 @@ export const dataPages = [
     {
         id: '01-1',
         primary: 'MortgageRequestList-DataSource',
-        secondary: ['Scope', 'O1XPTI-CCompass-Work-MortgageRequest'],
+        metaData: [
+            {
+                name: 'Scope',
+                value: 'O1XPTI-CCompass-Work-MortgageRequest'
+            }
+        ],
+        secondary: ['O1XPTI-CCompass-Work-MortgageRequest'],
         href: 'http://www.pega.com'
     },
     {
         id: '01-2',
         primary: 'Credit Scores List Data Source',
+        metaData: [
+            {
+                name: 'Scope',
+                value: 'CreditScore'
+            }
+        ],
         secondary: ['Scope', 'CreditScore'],
         href: 'http://www.pega.com'
     },
     {
         id: '01-3',
         primary: 'GetAutoLoanByIDDataSource',
+        metaData: [
+            {
+                name: 'Scope',
+                value: 'O1XPTI-CCompass-Work-AutoLoan'
+            }
+        ],
         secondary: ['Scope', 'O1XPTI-CCompass-Work-AutoLoan'],
         href: 'http://www.pega.com'
     },
     {
         id: '01-4',
         primary: 'DS_pyMyWorkList',
+        metaData: [
+            {
+                name: 'Scope',
+                value: 'O1XPTI-CCompass-Work-AutoLoan'
+            }
+        ],
         secondary: ['Scope', 'Assign-Worklist'],
         href: 'http://www.pega.com'
     }
@@ -187,32 +211,44 @@ export const fieldReducer = (fields, { target, type }) => {
     });
 };
 export const ViewportDrawer = ({ drawerData, drawerOpen, setDrawerOpen }) => {
-    const fields = drawerData?.secondary?.map((data, index) => {
-        return {
-            id: (index + 1).toString(),
-            name: data?.toString() ?? '',
-            value: data
-        };
-    });
-    return (_jsx(Drawer, { open: drawerOpen, onOuterClick: () => {
-            setDrawerOpen(false);
-        }, position: 'fixed', size: '30rem', nullWhenClosed: true, shadow: true, children: _jsx(Flex, { as: StyledDrawerContent, container: {
-                direction: 'column',
-                alignItems: 'start',
-                gap: 2,
-                pad: 4
-            }, children: _jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [_jsxs(Flex, { container: { gap: 2, alignItems: 'center' }, children: [_jsx(Button, { variant: 'simple', label: 'Close drawer', icon: true, onClick: () => setDrawerOpen(false), children: _jsx(Icon, { name: 'times' }, void 0) }, void 0), _jsx(Text, { variant: 'h3', children: drawerData?.primary }, void 0)] }, void 0), _jsxs(Flex, { container: { direction: 'column', gap: 2, pad: 1 }, children: [_jsxs(Text, { as: 'p', children: ["This is a mock representation for the parameters of the ", drawerData?.primary, " rule"] }, void 0), _jsx(FieldValueList, { variant: 'inline', fields: fields }, void 0)] }, void 0)] }, void 0) }, void 0) }, void 0));
+    return (_jsx(ObjectPreview, { open: drawerOpen, onDismiss: () => setDrawerOpen(false), header: {
+            title: drawerData?.primary || '',
+            metadata: drawerData?.metaData || [],
+            additionalInfo: {
+                title: drawerData?.primary || '',
+                description: 'Interest rate for the savings account',
+                fields: drawerData?.metaData || [],
+                onEdit: () => { }
+            }
+        }, content: _jsx(StyledConfigurationContent, { children: _jsx(StyledRegion, { style: { minHeight: '100vh' } }) }), primaryAction: {
+            id: 'PA',
+            text: 'Save',
+            onClick: () => { }
+        }, secondaryAction: {
+            id: 'SA',
+            text: 'Open rule',
+            onClick: () => { }
+        }, actions: {
+            items: [
+                {
+                    id: '1',
+                    text: 'Page action 1'
+                },
+                {
+                    id: '2',
+                    text: 'Page action 2'
+                }
+            ]
+        } }));
 };
 export const ConfigurationContent = (args) => {
     const [showErrorIndicators] = useState(false);
-    const ConditionBuilder = (_jsx(AtomicCondition, { condition: args.condition, fields: demoFields, indicateErrors: showErrorIndicators, dateFunctions: demoDateFunctions, onChange: c => args.setCondition(c), itemDirection: 'row', showLhsAsLabel: false, validRhsTypes: args.validRHSTypes }, void 0));
-    const Inputs = (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Text, { variant: 'h4', children: "Inputs" }, void 0), _jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [_jsxs(Flex, { container: { alignItems: 'end', gap: 1 }, children: [_jsx(Input, { label: 'Name', type: 'text', defaultValue: 'Sample key 1', disabled: true, readOnly: args.readOnly }, void 0), _jsx(Input, { label: 'Value', type: 'text', defaultValue: 'Sample value 1', readOnly: args.readOnly, disabled: args.disabled }, void 0)] }, void 0), _jsxs(Flex, { container: { alignItems: 'end', gap: 1 }, children: [_jsx(Input, { label: 'Name 2', labelHidden: true, type: 'text', defaultValue: 'Sample key 2', disabled: true, readOnly: args.readOnly }, void 0), _jsx(Input, { label: 'Value 2', labelHidden: true, type: 'text', defaultValue: 'Sample value 2', readOnly: args.readOnly, disabled: args.disabled }, void 0)] }, void 0)] }, void 0)] }, void 0));
+    const ConditionBuilder = (_jsx(AtomicCondition, { condition: args.condition, fields: demoFields, indicateErrors: showErrorIndicators, dateFunctions: demoDateFunctions, onChange: c => args.setCondition(c), itemDirection: 'row', showLhsAsLabel: false, validRhsTypes: args.validRHSTypes }));
+    const Inputs = (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Text, { variant: 'h4', children: "Inputs" }), _jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [_jsxs(Flex, { container: { alignItems: 'end', gap: 1 }, children: [_jsx(Input, { label: 'Name', type: 'text', defaultValue: 'Sample key 1', disabled: true, readOnly: args.readOnly }), _jsx(Input, { label: 'Value', type: 'text', defaultValue: 'Sample value 1', readOnly: args.readOnly, disabled: args.disabled })] }), _jsxs(Flex, { container: { alignItems: 'end', gap: 1 }, children: [_jsx(Input, { label: 'Name 2', labelHidden: true, type: 'text', defaultValue: 'Sample key 2', disabled: true, readOnly: args.readOnly }), _jsx(Input, { label: 'Value 2', labelHidden: true, type: 'text', defaultValue: 'Sample value 2', readOnly: args.readOnly, disabled: args.disabled })] })] })] }));
     return args.popoverContent === 'advanced' ? ConditionBuilder : Inputs;
 };
 export const ObjectSelectComp = ({ popoverContent, ...args }) => {
     const t = useI18n();
-    const [drawerOpen, setDrawerOpen] = useState(false);
-    const [drawerData, setDrawerData] = useState(dataPages[0]);
     const [value, setValue] = useState(args.value);
     const convertRhsTypes = (useLiteralRHSType, useFieldRHSType, useRelativeDatesType, dateFunctions) => {
         const setRhsTypes = new Set();
@@ -258,15 +294,11 @@ export const ObjectSelectComp = ({ popoverContent, ...args }) => {
                         text: 'Cancel',
                         onClick: args.onCancel
                     },
-                    content: (_jsx(ConfigurationContent, { ...args, popoverContent: popoverContent, condition: condition, setCondition: setCondition, validRHSTypes: validRHSTypes }, void 0))
+                    content: (_jsx(ConfigurationContent, { ...args, popoverContent: popoverContent, condition: condition, setCondition: setCondition, validRHSTypes: validRHSTypes }))
                 }, value: value, onPreview: (id, e) => {
-                    const data = menuHelpers.getItem(dataPages, id);
-                    if (data)
-                        setDrawerData(data);
-                    setDrawerOpen(true);
                     args.onPreview?.(id, e);
-                } }, void 0), _jsx(ViewportDrawer, { drawerData: drawerData, drawerOpen: drawerOpen, setDrawerOpen: setDrawerOpen }, void 0), popoverContent === 'advanced' && (_jsx(Card, { children: _jsxs(CardContent, { children: [_jsx(Text, { variant: 'h4', children: "Output:" }, void 0), _jsx(StyledCodeBlock, { children: submitCondition ? JSON.stringify(submitCondition, null, 2) : '(No condition)' }, void 0), _jsx(Text, { variant: 'h4', children: "Formatted Output:" }, void 0), _jsx(StyledCodeBlock, { children: submitCondition
+                } }), popoverContent === 'advanced' && (_jsx(Card, { children: _jsxs(CardContent, { children: [_jsx(Text, { variant: 'h4', children: "Output:" }), _jsx(StyledCodeBlock, { children: submitCondition ? JSON.stringify(submitCondition, null, 2) : '(No condition)' }), _jsx(Text, { variant: 'h4', children: "Formatted Output:" }), _jsx(StyledCodeBlock, { children: submitCondition
                                 ? formatCondition({ condition: submitCondition }, demoFields, t)
-                                : '(No condition)' }, void 0)] }, void 0) }, void 0))] }, void 0));
+                                : '(No condition)' })] }) }))] }));
 };
 //# sourceMappingURL=ObjectSelect.mocks.js.map

package/lib/build/ObjectSelect/ObjectSelect.mocks.js.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectSelect.mocks.js","sourceRoot":"","sources":["../../../src/build/ObjectSelect/ObjectSelect.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words XPTI\nimport { ChangeEvent, FC, FocusEvent, MouseEvent, useState } from 'react';\n\nimport {\n  AtomicCondition,\n  LeafCondition,\n  getInitConditionForLhs,\n  RHSType,\n  formatCondition,\n  DateFunctionsByType,\n  Field\n} from '@pega/cosmos-react-condition-builder';\nimport {\n  Button,\n  Flex,\n  Input,\n  Card,\n  CardContent,\n  Drawer,\n  Text,\n  FieldValueList,\n  Icon,\n  menuHelpers,\n  MenuItemProps,\n  useI18n,\n  FormControlProps\n} from '@pega/cosmos-react-core';\nimport { ObjectSelect, ObjectSelectProps } from '@pega/cosmos-react-build';\n\nimport { StyledDrawerContent, StyledCodeBlock } from './ObjectSelect.styles';\n\ninterface FormField extends FormControlProps {\n  help?: string;\n  error?: string;\n  validator: (this: FormField) => boolean;\n}\n\ninterface DrawerProps {\n  drawerData?: MenuItemProps;\n  drawerOpen: boolean;\n  setDrawerOpen: (value: boolean) => void;\n}\n\nexport interface ObjectSelectStoryProps extends ObjectSelectProps {\n  onSubmit?: (id: string, e: MouseEvent<HTMLElement>) => void;\n  onCancel?: (id: string, e: MouseEvent<HTMLElement>) => void;\n  popoverContent?: string;\n}\n\nexport const skeletonData = [\n  {\n    id: '01-1',\n    primary: 'primary-link-1',\n    secondary: ['secondary-1'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-2',\n    primary: 'primary-link-2',\n    secondary: [\n      'secondary-1',\n      'secondary-2',\n      'secondary-3',\n      'secondary-4',\n      'secondary-5',\n      'secondary-6',\n      'secondary-7',\n      'secondary-8',\n      'secondary-9'\n    ],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-3',\n    primary: 'primary-link-3',\n    secondary: ['secondary-1', 'secondary-2'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-4',\n    primary: 'primary-link-4',\n    secondary: ['secondary-1', 'secondary-2'],\n    href: 'http://www.pega.com'\n  }\n];\n\nexport const dataPages = [\n  {\n    id: '01-1',\n    primary: 'MortgageRequestList-DataSource',\n    secondary: ['Scope', 'O1XPTI-CCompass-Work-MortgageRequest'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-2',\n    primary: 'Credit Scores List Data Source',\n    secondary: ['Scope', 'CreditScore'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-3',\n    primary: 'GetAutoLoanByIDDataSource',\n    secondary: ['Scope', 'O1XPTI-CCompass-Work-AutoLoan'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-4',\n    primary: 'DS_pyMyWorkList',\n    secondary: ['Scope', 'Assign-Worklist'],\n    href: 'http://www.pega.com'\n  }\n];\n\nexport const demoFields: Field[] = [\n  { name: 'employeeId', label: 'Employee ID', type: 'TEXT' },\n  { name: 'firstName', label: 'First Name', type: 'TEXT' },\n  { name: 'lastName', label: 'Last Name', type: 'TEXT' },\n  { name: 'gender', label: 'Gender', type: 'TEXT' },\n  {\n    name: 'department',\n    label: 'Department',\n    type: 'TEXT',\n    possibleValues: [\n      'Customer Service',\n      'Engineering',\n      'Facilities',\n      'Finance',\n      'HR',\n      'IT',\n      'Sales'\n    ]\n  },\n  { name: 'age', label: 'Age', type: 'NUMBER' },\n  { name: 'experience', label: 'Experience (yrs)', type: 'NUMBER' },\n  { name: 'salary', label: 'Salary', type: 'NUMBER' },\n  { name: 'hireDate', label: 'Hire Date', type: 'DATE_ONLY' },\n  { name: 'dateOfBirth', label: 'Date of Birth', type: 'DATE_ONLY' },\n  {\n    name: 'shiftStartTime',\n    label: 'Shift start time',\n    type: 'TIME_ONLY',\n    groupLabel: 'Technical details'\n  },\n  {\n    name: 'shiftEndTime',\n    label: 'Shift end time',\n    type: 'TIME_ONLY',\n    groupLabel: 'Technical details'\n  },\n  {\n    name: 'lastActivityAt',\n    label: 'Last activity at',\n    type: 'DATE_TIME',\n    groupLabel: 'Technical details'\n  },\n  {\n    name: 'nextPasswordReset',\n    label: 'Next password reset',\n    type: 'DATE_TIME',\n    groupLabel: 'Technical details'\n  },\n  { name: 'isSeniorCitizen', label: 'Is Senior Citizen', type: 'BOOLEAN' },\n  { name: 'isRemoteEmployee', label: 'Is Remote Employee', type: 'BOOLEAN' }\n];\n\nexport const demoDateFunctions: DateFunctionsByType = {\n  DATE_TIME: [\n    'YEARS',\n    'QUARTERS',\n    'MONTHS',\n    'WEEKS',\n    'DAYS',\n    'HOURS',\n    'MONTHS_OF_YEAR',\n    'DAYS_OF_MONTH',\n    'DAYS_OF_WEEK'\n  ],\n  DATE_ONLY: [\n    'YEARS',\n    'QUARTERS',\n    'MONTHS',\n    'WEEKS',\n    'MONTHS_OF_YEAR',\n    'DAYS_OF_MONTH',\n    'DAYS_OF_WEEK'\n  ]\n};\n\nexport const initFields = (): FormField[] => {\n  const common = { value: undefined, status: undefined };\n  return [\n    {\n      ...common,\n      name: 'name',\n      required: true,\n      error: 'Please enter a valid name for table',\n      validator() {\n        if (!this.value) return false;\n        return /^[a-z]{1}[a-z0-9]+$/i.test(this.value);\n      }\n    },\n    {\n      ...common,\n      name: 'description',\n      required: true,\n      help: 'Give an appropriate description for the table',\n      error: 'Field cannot be empty',\n      validator() {\n        if (!this.value) return false;\n        return true;\n      }\n    }\n  ];\n};\n\nexport const fieldReducer = (\n  fields: FormField[],\n  {\n    target,\n    type\n  }:\n    | ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n    | FocusEvent<HTMLInputElement | HTMLTextAreaElement>\n) => {\n  return fields.map(field => {\n    if (field.name === target.name) {\n      field.value = target.value;\n      if (type === 'blur' || field.status === 'error') {\n        if ((field.required || field.value) && !field.validator()) {\n          field.status = 'error';\n          field.info = field.error;\n        } else {\n          field.status = undefined;\n          field.info = field.help;\n        }\n      }\n    }\n    return field;\n  });\n};\n\nexport const ViewportDrawer = ({ drawerData, drawerOpen, setDrawerOpen }: DrawerProps) => {\n  const fields = drawerData?.secondary?.map((data, index) => {\n    return {\n      id: (index + 1).toString(),\n      name: data?.toString() ?? '',\n      value: data\n    };\n  });\n\n  return (\n    <Drawer\n      open={drawerOpen}\n      onOuterClick={() => {\n        setDrawerOpen(false);\n      }}\n      position='fixed'\n      size='30rem'\n      nullWhenClosed\n      shadow\n    >\n      <Flex\n        as={StyledDrawerContent}\n        container={{\n          direction: 'column',\n          alignItems: 'start',\n          gap: 2,\n          pad: 4\n        }}\n      >\n        <Flex container={{ direction: 'column', gap: 1 }}>\n          <Flex container={{ gap: 2, alignItems: 'center' }}>\n            <Button variant='simple' label='Close drawer' icon onClick={() => setDrawerOpen(false)}>\n              <Icon name='times' />\n            </Button>\n            <Text variant='h3'>{drawerData?.primary}</Text>\n          </Flex>\n          <Flex container={{ direction: 'column', gap: 2, pad: 1 }}>\n            <Text as='p'>\n              This is a mock representation for the parameters of the {drawerData?.primary} rule\n            </Text>\n            <FieldValueList variant='inline' fields={fields!} />\n          </Flex>\n        </Flex>\n      </Flex>\n    </Drawer>\n  );\n};\n\nexport const ConfigurationContent = (args: any) => {\n  const [showErrorIndicators] = useState(false);\n\n  const ConditionBuilder = (\n    <AtomicCondition\n      condition={args.condition}\n      fields={demoFields}\n      indicateErrors={showErrorIndicators}\n      dateFunctions={demoDateFunctions}\n      onChange={c => args.setCondition(c)}\n      itemDirection='row'\n      showLhsAsLabel={false}\n      validRhsTypes={args.validRHSTypes}\n    />\n  );\n\n  const Inputs = (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Text variant='h4'>Inputs</Text>\n      <Flex container={{ direction: 'column', gap: 1 }}>\n        <Flex container={{ alignItems: 'end', gap: 1 }}>\n          <Input\n            label='Name'\n            type='text'\n            defaultValue='Sample key 1'\n            disabled\n            readOnly={args.readOnly}\n          />\n          <Input\n            label='Value'\n            type='text'\n            defaultValue='Sample value 1'\n            readOnly={args.readOnly}\n            disabled={args.disabled}\n          />\n        </Flex>\n        <Flex container={{ alignItems: 'end', gap: 1 }}>\n          <Input\n            label='Name 2'\n            labelHidden\n            type='text'\n            defaultValue='Sample key 2'\n            disabled\n            readOnly={args.readOnly}\n          />\n          <Input\n            label='Value 2'\n            labelHidden\n            type='text'\n            defaultValue='Sample value 2'\n            readOnly={args.readOnly}\n            disabled={args.disabled}\n          />\n        </Flex>\n      </Flex>\n    </Flex>\n  );\n\n  return args.popoverContent === 'advanced' ? ConditionBuilder : Inputs;\n};\n\nexport const ObjectSelectComp: FC<ObjectSelectStoryProps> = ({\n  popoverContent,\n  ...args\n}: ObjectSelectStoryProps) => {\n  const t = useI18n();\n  const [drawerOpen, setDrawerOpen] = useState(false);\n  const [drawerData, setDrawerData] = useState<MenuItemProps>(dataPages[0]);\n  const [value, setValue] = useState<ObjectSelectProps['value']>(args.value);\n\n  const convertRhsTypes = (\n    useLiteralRHSType: boolean,\n    useFieldRHSType: boolean,\n    useRelativeDatesType: boolean,\n    dateFunctions?: DateFunctionsByType\n  ) => {\n    const setRhsTypes: Set<RHSType> = new Set<RHSType>();\n    if (useLiteralRHSType) setRhsTypes.add('LITERAL');\n    if (useFieldRHSType) setRhsTypes.add('FIELD');\n    if (dateFunctions) setRhsTypes.add('DATE_FUNCTION');\n    if (useRelativeDatesType) setRhsTypes.add('RELATIVE_DATE');\n    return setRhsTypes;\n  };\n\n  const validRHSTypes: Set<RHSType> = convertRhsTypes(true, true, true, demoDateFunctions);\n  const [submitCondition, setSubmitCondition] = useState<LeafCondition | undefined>(undefined);\n  const [condition, setCondition] = useState(\n    () =>\n      submitCondition ||\n      getInitConditionForLhs(\n        { field: 'age' },\n        demoFields,\n        validRHSTypes,\n        undefined,\n        demoDateFunctions\n      )\n  );\n\n  const handleSubmission = () => {\n    setSubmitCondition(condition);\n  };\n\n  return (\n    <Flex container={{ direction: 'column', gap: 1 }}>\n      <ObjectSelect\n        {...args}\n        onChange={id => {\n          const data = menuHelpers.getItem(dataPages, id);\n          if (data) {\n            setValue({\n              id: data.id,\n              primary: data.primary,\n              href: data.href ?? '#',\n              meta: data.id !== '01-4' ? data.secondary?.join('  ') : ''\n            });\n          } else setValue(undefined);\n        }}\n        items={dataPages}\n        configuration={{\n          label: args.disabled || args.readOnly ? 'View Configuration' : 'Edit Configuration',\n          heading: 'Map Parameters',\n          primaryAction: {\n            id: 'submit',\n            text: 'Submit',\n            onClick: popoverContent === 'advanced' ? handleSubmission : args.onSubmit\n          },\n          secondaryAction: {\n            id: 'cancel',\n            text: 'Cancel',\n            onClick: args.onCancel\n          },\n          content: (\n            <ConfigurationContent\n              {...args}\n              popoverContent={popoverContent}\n              condition={condition}\n              setCondition={setCondition}\n              validRHSTypes={validRHSTypes}\n            />\n          )\n        }}\n        value={value}\n        onPreview={(id, e: { href: string }) => {\n          const data = menuHelpers.getItem(dataPages, id);\n          if (data) setDrawerData(data);\n          setDrawerOpen(true);\n          args.onPreview?.(id, e);\n        }}\n      />\n      <ViewportDrawer\n        drawerData={drawerData}\n        drawerOpen={drawerOpen}\n        setDrawerOpen={setDrawerOpen}\n      />\n      {popoverContent === 'advanced' && (\n        <Card>\n          <CardContent>\n            <Text variant='h4'>Output:</Text>\n            <StyledCodeBlock>\n              {submitCondition ? JSON.stringify(submitCondition, null, 2) : '(No condition)'}\n            </StyledCodeBlock>\n\n            <Text variant='h4'>Formatted Output:</Text>\n            <StyledCodeBlock>\n              {submitCondition\n                ? formatCondition({ condition: submitCondition }, demoFields, t)\n                : '(No condition)'}\n            </StyledCodeBlock>\n          </CardContent>\n        </Card>\n      )}\n    </Flex>\n  );\n};\n"]}
+{"version":3,"file":"ObjectSelect.mocks.js","sourceRoot":"","sources":["../../../src/build/ObjectSelect/ObjectSelect.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words XPTI\nimport { ChangeEvent, FC, FocusEvent, MouseEvent, useState } from 'react';\n\nimport {\n  AtomicCondition,\n  LeafCondition,\n  getInitConditionForLhs,\n  RHSType,\n  formatCondition,\n  DateFunctionsByType,\n  Field\n} from '@pega/cosmos-react-condition-builder';\nimport {\n  Flex,\n  Input,\n  Card,\n  CardContent,\n  Text,\n  menuHelpers,\n  MenuItemProps,\n  useI18n,\n  StyledRegion,\n  FormControlProps\n} from '@pega/cosmos-react-core';\nimport { ObjectSelect, ObjectSelectProps, ObjectPreview } from '@pega/cosmos-react-build';\n\nimport { StyledCodeBlock, StyledConfigurationContent } from './ObjectSelect.styles';\n\ninterface FormField extends FormControlProps {\n  help?: string;\n  error?: string;\n  validator: (this: FormField) => boolean;\n}\n\ninterface DrawerProps {\n  drawerData?: MenuItemProps & { metaData: any };\n  drawerOpen: boolean;\n  setDrawerOpen: (value: boolean) => void;\n}\n\nexport interface ObjectSelectStoryProps extends ObjectSelectProps {\n  onSubmit?: (id: string, e: MouseEvent<HTMLElement>) => void;\n  onCancel?: (id: string, e: MouseEvent<HTMLElement>) => void;\n  popoverContent?: string;\n}\n\nexport const skeletonData = [\n  {\n    id: '01-1',\n    primary: 'primary-link-1',\n    secondary: ['secondary-1'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-2',\n    primary: 'primary-link-2',\n    secondary: [\n      'secondary-1',\n      'secondary-2',\n      'secondary-3',\n      'secondary-4',\n      'secondary-5',\n      'secondary-6',\n      'secondary-7',\n      'secondary-8',\n      'secondary-9'\n    ],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-3',\n    primary: 'primary-link-3',\n    secondary: ['secondary-1', 'secondary-2'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-4',\n    primary: 'primary-link-4',\n    secondary: ['secondary-1', 'secondary-2'],\n    href: 'http://www.pega.com'\n  }\n];\n\nexport const dataPages = [\n  {\n    id: '01-1',\n    primary: 'MortgageRequestList-DataSource',\n    metaData: [\n      {\n        name: 'Scope',\n        value: 'O1XPTI-CCompass-Work-MortgageRequest'\n      }\n    ],\n    secondary: ['O1XPTI-CCompass-Work-MortgageRequest'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-2',\n    primary: 'Credit Scores List Data Source',\n    metaData: [\n      {\n        name: 'Scope',\n        value: 'CreditScore'\n      }\n    ],\n    secondary: ['Scope', 'CreditScore'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-3',\n    primary: 'GetAutoLoanByIDDataSource',\n    metaData: [\n      {\n        name: 'Scope',\n        value: 'O1XPTI-CCompass-Work-AutoLoan'\n      }\n    ],\n    secondary: ['Scope', 'O1XPTI-CCompass-Work-AutoLoan'],\n    href: 'http://www.pega.com'\n  },\n  {\n    id: '01-4',\n    primary: 'DS_pyMyWorkList',\n    metaData: [\n      {\n        name: 'Scope',\n        value: 'O1XPTI-CCompass-Work-AutoLoan'\n      }\n    ],\n    secondary: ['Scope', 'Assign-Worklist'],\n    href: 'http://www.pega.com'\n  }\n];\n\nexport const demoFields: Field[] = [\n  { name: 'employeeId', label: 'Employee ID', type: 'TEXT' },\n  { name: 'firstName', label: 'First Name', type: 'TEXT' },\n  { name: 'lastName', label: 'Last Name', type: 'TEXT' },\n  { name: 'gender', label: 'Gender', type: 'TEXT' },\n  {\n    name: 'department',\n    label: 'Department',\n    type: 'TEXT',\n    possibleValues: [\n      'Customer Service',\n      'Engineering',\n      'Facilities',\n      'Finance',\n      'HR',\n      'IT',\n      'Sales'\n    ]\n  },\n  { name: 'age', label: 'Age', type: 'NUMBER' },\n  { name: 'experience', label: 'Experience (yrs)', type: 'NUMBER' },\n  { name: 'salary', label: 'Salary', type: 'NUMBER' },\n  { name: 'hireDate', label: 'Hire Date', type: 'DATE_ONLY' },\n  { name: 'dateOfBirth', label: 'Date of Birth', type: 'DATE_ONLY' },\n  {\n    name: 'shiftStartTime',\n    label: 'Shift start time',\n    type: 'TIME_ONLY',\n    groupLabel: 'Technical details'\n  },\n  {\n    name: 'shiftEndTime',\n    label: 'Shift end time',\n    type: 'TIME_ONLY',\n    groupLabel: 'Technical details'\n  },\n  {\n    name: 'lastActivityAt',\n    label: 'Last activity at',\n    type: 'DATE_TIME',\n    groupLabel: 'Technical details'\n  },\n  {\n    name: 'nextPasswordReset',\n    label: 'Next password reset',\n    type: 'DATE_TIME',\n    groupLabel: 'Technical details'\n  },\n  { name: 'isSeniorCitizen', label: 'Is Senior Citizen', type: 'BOOLEAN' },\n  { name: 'isRemoteEmployee', label: 'Is Remote Employee', type: 'BOOLEAN' }\n];\n\nexport const demoDateFunctions: DateFunctionsByType = {\n  DATE_TIME: [\n    'YEARS',\n    'QUARTERS',\n    'MONTHS',\n    'WEEKS',\n    'DAYS',\n    'HOURS',\n    'MONTHS_OF_YEAR',\n    'DAYS_OF_MONTH',\n    'DAYS_OF_WEEK'\n  ],\n  DATE_ONLY: [\n    'YEARS',\n    'QUARTERS',\n    'MONTHS',\n    'WEEKS',\n    'MONTHS_OF_YEAR',\n    'DAYS_OF_MONTH',\n    'DAYS_OF_WEEK'\n  ]\n};\n\nexport const initFields = (): FormField[] => {\n  const common = { value: undefined, status: undefined };\n  return [\n    {\n      ...common,\n      name: 'name',\n      required: true,\n      error: 'Please enter a valid name for table',\n      validator() {\n        if (!this.value) return false;\n        return /^[a-z]{1}[a-z0-9]+$/i.test(this.value);\n      }\n    },\n    {\n      ...common,\n      name: 'description',\n      required: true,\n      help: 'Give an appropriate description for the table',\n      error: 'Field cannot be empty',\n      validator() {\n        if (!this.value) return false;\n        return true;\n      }\n    }\n  ];\n};\n\nexport const fieldReducer = (\n  fields: FormField[],\n  {\n    target,\n    type\n  }:\n    | ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n    | FocusEvent<HTMLInputElement | HTMLTextAreaElement>\n) => {\n  return fields.map(field => {\n    if (field.name === target.name) {\n      field.value = target.value;\n      if (type === 'blur' || field.status === 'error') {\n        if ((field.required || field.value) && !field.validator()) {\n          field.status = 'error';\n          field.info = field.error;\n        } else {\n          field.status = undefined;\n          field.info = field.help;\n        }\n      }\n    }\n    return field;\n  });\n};\n\nexport const ViewportDrawer = ({ drawerData, drawerOpen, setDrawerOpen }: DrawerProps) => {\n  return (\n    <ObjectPreview\n      open={drawerOpen}\n      onDismiss={() => setDrawerOpen(false)}\n      header={{\n        title: drawerData?.primary || '',\n        metadata: drawerData?.metaData || [],\n        additionalInfo: {\n          title: drawerData?.primary || '',\n          description: 'Interest rate for the savings account',\n          fields: drawerData?.metaData || [],\n          onEdit: () => {}\n        }\n      }}\n      content={\n        <StyledConfigurationContent>\n          <StyledRegion style={{ minHeight: '100vh' }} />\n        </StyledConfigurationContent>\n      }\n      primaryAction={{\n        id: 'PA',\n        text: 'Save',\n        onClick: () => {}\n      }}\n      secondaryAction={{\n        id: 'SA',\n        text: 'Open rule',\n        onClick: () => {}\n      }}\n      actions={{\n        items: [\n          {\n            id: '1',\n            text: 'Page action 1'\n          },\n          {\n            id: '2',\n            text: 'Page action 2'\n          }\n        ]\n      }}\n    />\n  );\n};\n\nexport const ConfigurationContent = (args: any) => {\n  const [showErrorIndicators] = useState(false);\n\n  const ConditionBuilder = (\n    <AtomicCondition\n      condition={args.condition}\n      fields={demoFields}\n      indicateErrors={showErrorIndicators}\n      dateFunctions={demoDateFunctions}\n      onChange={c => args.setCondition(c)}\n      itemDirection='row'\n      showLhsAsLabel={false}\n      validRhsTypes={args.validRHSTypes}\n    />\n  );\n\n  const Inputs = (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Text variant='h4'>Inputs</Text>\n      <Flex container={{ direction: 'column', gap: 1 }}>\n        <Flex container={{ alignItems: 'end', gap: 1 }}>\n          <Input\n            label='Name'\n            type='text'\n            defaultValue='Sample key 1'\n            disabled\n            readOnly={args.readOnly}\n          />\n          <Input\n            label='Value'\n            type='text'\n            defaultValue='Sample value 1'\n            readOnly={args.readOnly}\n            disabled={args.disabled}\n          />\n        </Flex>\n        <Flex container={{ alignItems: 'end', gap: 1 }}>\n          <Input\n            label='Name 2'\n            labelHidden\n            type='text'\n            defaultValue='Sample key 2'\n            disabled\n            readOnly={args.readOnly}\n          />\n          <Input\n            label='Value 2'\n            labelHidden\n            type='text'\n            defaultValue='Sample value 2'\n            readOnly={args.readOnly}\n            disabled={args.disabled}\n          />\n        </Flex>\n      </Flex>\n    </Flex>\n  );\n\n  return args.popoverContent === 'advanced' ? ConditionBuilder : Inputs;\n};\n\nexport const ObjectSelectComp: FC<ObjectSelectStoryProps> = ({\n  popoverContent,\n  ...args\n}: ObjectSelectStoryProps) => {\n  const t = useI18n();\n  const [value, setValue] = useState<ObjectSelectProps['value']>(args.value);\n\n  const convertRhsTypes = (\n    useLiteralRHSType: boolean,\n    useFieldRHSType: boolean,\n    useRelativeDatesType: boolean,\n    dateFunctions?: DateFunctionsByType\n  ) => {\n    const setRhsTypes: Set<RHSType> = new Set<RHSType>();\n    if (useLiteralRHSType) setRhsTypes.add('LITERAL');\n    if (useFieldRHSType) setRhsTypes.add('FIELD');\n    if (dateFunctions) setRhsTypes.add('DATE_FUNCTION');\n    if (useRelativeDatesType) setRhsTypes.add('RELATIVE_DATE');\n    return setRhsTypes;\n  };\n\n  const validRHSTypes: Set<RHSType> = convertRhsTypes(true, true, true, demoDateFunctions);\n  const [submitCondition, setSubmitCondition] = useState<LeafCondition | undefined>(undefined);\n  const [condition, setCondition] = useState(\n    () =>\n      submitCondition ||\n      getInitConditionForLhs(\n        { field: 'age' },\n        demoFields,\n        validRHSTypes,\n        undefined,\n        demoDateFunctions\n      )\n  );\n\n  const handleSubmission = () => {\n    setSubmitCondition(condition);\n  };\n\n  return (\n    <Flex container={{ direction: 'column', gap: 1 }}>\n      <ObjectSelect\n        {...args}\n        onChange={id => {\n          const data = menuHelpers.getItem(dataPages, id);\n          if (data) {\n            setValue({\n              id: data.id,\n              primary: data.primary,\n              href: data.href ?? '#',\n              meta: data.id !== '01-4' ? data.secondary?.join('  ') : ''\n            });\n          } else setValue(undefined);\n        }}\n        items={dataPages}\n        configuration={{\n          label: args.disabled || args.readOnly ? 'View Configuration' : 'Edit Configuration',\n          heading: 'Map Parameters',\n          primaryAction: {\n            id: 'submit',\n            text: 'Submit',\n            onClick: popoverContent === 'advanced' ? handleSubmission : args.onSubmit\n          },\n          secondaryAction: {\n            id: 'cancel',\n            text: 'Cancel',\n            onClick: args.onCancel\n          },\n          content: (\n            <ConfigurationContent\n              {...args}\n              popoverContent={popoverContent}\n              condition={condition}\n              setCondition={setCondition}\n              validRHSTypes={validRHSTypes}\n            />\n          )\n        }}\n        value={value}\n        onPreview={(id, e: { href: string }) => {\n          args.onPreview?.(id, e);\n        }}\n      />\n      {popoverContent === 'advanced' && (\n        <Card>\n          <CardContent>\n            <Text variant='h4'>Output:</Text>\n            <StyledCodeBlock>\n              {submitCondition ? JSON.stringify(submitCondition, null, 2) : '(No condition)'}\n            </StyledCodeBlock>\n\n            <Text variant='h4'>Formatted Output:</Text>\n            <StyledCodeBlock>\n              {submitCondition\n                ? formatCondition({ condition: submitCondition }, demoFields, t)\n                : '(No condition)'}\n            </StyledCodeBlock>\n          </CardContent>\n        </Card>\n      )}\n    </Flex>\n  );\n};\n"]}

package/lib/build/ObjectSelect/ObjectSelect.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectSelect.stories.d.ts","sourceRoot":"","sources":["../../../src/build/ObjectSelect/ObjectSelect.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAqB/C,OAAO,EAIL,sBAAsB,EAEvB,MAAM,sBAAsB,CAAC;;AAI9B,wBAGU;AAEV,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,sBAAsB,CA2C9D,CAAC;AAiCF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,sBAAsB,CAE1D,CAAC;AAmCF,eAAO,MAAM,sBAAsB,0BA8ElC,CAAC"}
+{"version":3,"file":"ObjectSelect.stories.d.ts","sourceRoot":"","sources":["../../../src/build/ObjectSelect/ObjectSelect.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAuB/C,OAAO,EAIL,sBAAsB,EAIvB,MAAM,sBAAsB,CAAC;;AAI9B,wBAGU;AAEV,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,sBAAsB,CA+C9D,CAAC;AAiCF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,sBAAsB,CAyB1D,CAAC;AAmCF,eAAO,MAAM,sBAAsB,0BAqGlC,CAAC"}

package/lib/build/ObjectSelect/ObjectSelect.stories.js

@@ -5,7 +5,7 @@ import { Form, Button, Flex, Input, ToasterContext, TextArea, Card, CardContent,
 import { ObjectSelect } from '@pega/cosmos-react-build';
 import * as times from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';
 import { StyledConfigurationContent } from './ObjectSelect.styles';
-import { skeletonData, fieldReducer, initFields, ObjectSelectComp } from './ObjectSelect.mocks';
+import { skeletonData, fieldReducer, initFields, ObjectSelectComp, dataPages, ViewportDrawer } from './ObjectSelect.mocks';
 registerIcon(times);
 export default {
     title: 'Build/ObjectSelect',
@@ -38,8 +38,11 @@ export const ObjectSelectSkeleton = (args) => {
                 text: 'Secondary action text',
                 onClick: args.onCancel
             },
-            content: (_jsx(StyledConfigurationContent, { children: _jsx(StyledRegion, { style: { minHeight: '20vh' } }, void 0) }, void 0))
-        }, onPreview: args.onPreview }, void 0));
+            content: (_jsx(StyledConfigurationContent, { children: _jsx(StyledRegion, { style: { minHeight: '20vh' } }) }))
+        }, onPreview: args.onPreview, onLinkClick: (id, e) => {
+            e.preventDefault();
+            action(`item with id - ${id} is clicked`)(e);
+        } }));
 };
 ObjectSelectSkeleton.args = {
     label: 'Object select label',
@@ -71,7 +74,16 @@ ObjectSelectSkeleton.argTypes = {
     onCancel: { table: { disable: true } }
 };
 export const ObjectSelectDemo = (args) => {
-    return _jsx(ObjectSelectComp, { ...args, popoverContent: args.popoverContent }, void 0);
+    const [drawerOpen, setDrawerOpen] = useState(false);
+    const [drawerData, setDrawerData] = useState(dataPages[0]);
+    return (_jsxs(_Fragment, { children: [_jsx(ObjectSelectComp, { ...args, popoverContent: args.popoverContent, onPreview: id => {
+                    const data = dataPages.find(dataPage => dataPage.id === id);
+                    if (data)
+                        setDrawerData(data);
+                    if (!drawerOpen) {
+                        setDrawerOpen(true);
+                    }
+                } }), _jsx(ViewportDrawer, { drawerData: drawerData, drawerOpen: drawerOpen, setDrawerOpen: setDrawerOpen })] }));
 };
 ObjectSelectDemo.args = {
     label: 'Data source',
@@ -107,6 +119,8 @@ ObjectSelectDemo.argTypes = {
 export const ObjectSelectDemoInForm = () => {
     const [fields, setField] = useReducer(fieldReducer, undefined, initFields);
     const { push } = useContext(ToasterContext);
+    const [drawerOpen, setDrawerOpen] = useState(false);
+    const [drawerData, setDrawerData] = useState(dataPages[0]);
     const name = fields.find(field => field.name === 'name');
     const description = fields.find(field => field.name === 'description');
     if (!name || !description)
@@ -114,10 +128,24 @@ export const ObjectSelectDemoInForm = () => {
     const canSubmit = fields.every(field => field.value && field.validator());
     const actions = (_jsxs(_Fragment, { children: [_jsx(Button, { name: 'Cancel', variant: 'secondary', onClick: () => {
                     push({ content: 'Form cancelled!' });
-                }, children: "Cancel" }, void 0), _jsx(Button, { name: 'Submit', type: 'submit', variant: 'primary', disabled: !canSubmit, children: "Submit" }, void 0)] }, void 0));
+                }, children: "Cancel" }), _jsx(Button, { name: 'Submit', type: 'submit', variant: 'primary', disabled: !canSubmit, children: "Submit" })] }));
     return (_jsx(Card, { style: { margin: 'auto', maxWidth: '37.5rem' }, children: _jsx(CardContent, { children: _jsx(Form, { actions: actions, onSubmit: (e) => {
                     e.preventDefault();
                     push({ content: 'Form submitted!' });
-                }, heading: 'Configure Table', children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, item: { grow: 1 }, children: [_jsx(Input, { name: 'name', label: 'Table name', value: name.value, required: name.required, status: name.status, info: 'Enter a valid table name', onChange: (e) => setField({ ...e }), onBlur: (e) => setField({ ...e }), autoComplete: 'off' }, void 0), _jsx(TextArea, { name: 'description', required: description.required, label: 'Table description', status: description.status, info: description.info || description.help, onChange: (e) => setField({ ...e }), onBlur: (e) => setField({ ...e }) }, void 0), _jsx(ObjectSelectComp, { label: 'Data page', info: 'Select an appropriate data page', items: [], onChange: () => { } }, void 0), _jsx(ObjectSelectComp, { label: 'Visibility condition', info: 'Choose a when condition from list', items: [], onChange: () => { } }, void 0)] }, void 0) }, void 0) }, void 0) }, void 0));
+                }, heading: 'Configure Table', children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, item: { grow: 1 }, children: [_jsx(Input, { name: 'name', label: 'Table name', value: name.value, required: name.required, status: name.status, info: 'Enter a valid table name', onChange: (e) => setField({ ...e }), onBlur: (e) => setField({ ...e }), autoComplete: 'off' }), _jsx(TextArea, { name: 'description', required: description.required, label: 'Table description', status: description.status, info: description.info || description.help, onChange: (e) => setField({ ...e }), onBlur: (e) => setField({ ...e }) }), _jsx(ObjectSelectComp, { label: 'Data page', info: 'Select an appropriate data page', items: [], onChange: () => { }, onPreview: id => {
+                                const data = dataPages.find(dataPage => dataPage.id === id);
+                                if (data)
+                                    setDrawerData(data);
+                                if (!drawerOpen) {
+                                    setDrawerOpen(true);
+                                }
+                            } }), _jsx(ObjectSelectComp, { label: 'Visibility condition', info: 'Choose a when condition from list', items: [], onChange: () => { }, onPreview: id => {
+                                const data = dataPages.find(dataPage => dataPage.id === id);
+                                if (data)
+                                    setDrawerData(data);
+                                if (!drawerOpen) {
+                                    setDrawerOpen(true);
+                                }
+                            } }), _jsx(ViewportDrawer, { drawerData: drawerData, drawerOpen: drawerOpen, setDrawerOpen: setDrawerOpen })] }) }) }) }));
 };
 //# sourceMappingURL=ObjectSelect.stories.js.map

package/lib/build/ObjectSelect/ObjectSelect.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectSelect.stories.js","sourceRoot":"","sources":["../../../src/build/ObjectSelect/ObjectSelect.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAa,UAAU,EAAE,UAAU,EAA2B,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,cAAc,EACd,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,WAAW,EACX,YAAY,EACb,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,YAAY,EAAqB,MAAM,0BAA0B,CAAC;AAC3E,OAAO,KAAK,KAAK,MAAM,8DAA8D,CAAC;AAEtF,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,UAAU,EAEV,gBAAgB,EACjB,MAAM,sBAAsB,CAAC;AAE9B,YAAY,CAAC,KAAK,CAAC,CAAC;AAEpB,eAAe;IACb,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,YAAY;CAChB,CAAC;AAEV,MAAM,CAAC,MAAM,oBAAoB,GAAkC,CACjE,IAA4B,EAC5B,EAAE;IACF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAA6B,IAAI,CAAC,KAAK,CAAC,CAAC;IAE3E,OAAO,CACL,KAAC,YAAY,OACP,IAAI,EACR,KAAK,EAAE,YAAY,EACnB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,EAAE,CAAC,EAAE;YACb,MAAM,IAAI,GAAG,WAAW,CAAC,OAAO,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;YACnD,IAAI,IAAI,EAAE;gBACR,QAAQ,CAAC;oBACP,EAAE,EAAE,IAAI,CAAC,EAAE;oBACX,OAAO,EAAE,IAAI,CAAC,OAAO;oBACrB,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,GAAG;oBACtB,IAAI,EAAE,IAAI,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE;iBAC3D,CAAC,CAAC;aACJ;;gBAAM,QAAQ,CAAC,SAAS,CAAC,CAAC;QAC7B,CAAC,EACD,aAAa,EAAE;YACb,KAAK,EAAE,mBAAmB;YAC1B,OAAO,EAAE,iBAAiB;YAC1B,aAAa,EAAE;gBACb,EAAE,EAAE,eAAe;gBACnB,IAAI,EAAE,qBAAqB;gBAC3B,OAAO,EAAE,IAAI,CAAC,QAAQ;aACvB;YACD,eAAe,EAAE;gBACf,EAAE,EAAE,iBAAiB;gBACrB,IAAI,EAAE,uBAAuB;gBAC7B,OAAO,EAAE,IAAI,CAAC,QAAQ;aACvB;YACD,OAAO,EAAE,CACP,KAAC,0BAA0B,cACzB,KAAC,YAAY,IAAC,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,WAAI,WACnB,CAC9B;SACF,EACD,SAAS,EAAE,IAAI,CAAC,SAAS,WACzB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,oBAAoB,CAAC,IAAI,GAAG;IAC1B,KAAK,EAAE,qBAAqB;IAC5B,WAAW,EAAE,KAAK;IAClB,IAAI,EAAE,yBAAyB;IAC/B,WAAW,EAAE,EAAE;IACf,MAAM,EAAE,SAAS;IACjB,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,sDAAsD;IACtD,SAAS,EAAE,MAAM,CAAC,sBAAsB,CAAC;IACzC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC,uBAAuB,CAAC;IACzC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC,uBAAuB,CAAC;CAC1C,CAAC;AAEF,oBAAoB,CAAC,QAAQ,GAAG;IAC9B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC7C,IAAI,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACnC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC1C,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC5F,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,SAAS,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACvC,QAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACtC,QAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;CACvC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAkC,CAAC,IAA4B,EAAE,EAAE;IAC9F,OAAO,KAAC,gBAAgB,OAAK,IAAI,EAAE,cAAc,EAAE,IAAI,CAAC,cAAc,WAAI,CAAC;AAC7E,CAAC,CAAC;AAEF,gBAAgB,CAAC,IAAI,GAAG;IACtB,KAAK,EAAE,aAAa;IACpB,WAAW,EAAE,KAAK;IAClB,IAAI,EAAE,mCAAmC;IACzC,WAAW,EAAE,EAAE;IACf,MAAM,EAAE,SAAS;IACjB,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,cAAc,EAAE,QAAQ;IACxB,sDAAsD;IACtD,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC;IACnB,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC,uBAAuB,CAAC;IACzC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC,uBAAuB,CAAC;CAC1C,CAAC;AAEF,gBAAgB,CAAC,QAAQ,GAAG;IAC1B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC7C,IAAI,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACnC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC1C,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC5F,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,cAAc,EAAE,EAAE,OAAO,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE;IAC/E,SAAS,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACvC,QAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACtC,QAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;CACvC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,EAAE;IACzC,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,YAAY,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;IAC3E,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC,CAAC;IAE5C,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC;IACzD,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,aAAa,CAAC,CAAC;IAEvE,IAAI,CAAC,IAAI,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAEvC,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC;IAE1E,MAAM,OAAO,GAAG,CACd,8BACE,KAAC,MAAM,IACL,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,WAAW,EACnB,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,CAAC,CAAC;gBACvC,CAAC,+BAGM,EACT,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAC,QAAQ,EAAE,CAAC,SAAS,+BAEjE,YACR,CACJ,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,YAClD,KAAC,WAAW,cACV,KAAC,IAAI,IACH,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,CAAY,EAAE,EAAE;oBACzB,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,IAAI,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,CAAC,CAAC;gBACvC,CAAC,EACD,OAAO,EAAC,iBAAiB,YAEzB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aACjE,KAAC,KAAK,IACJ,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,YAAY,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,0BAA0B,EAC/B,QAAQ,EAAE,CAAC,CAAgC,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,EAClE,MAAM,EAAE,CAAC,CAA+B,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,EAC/D,YAAY,EAAC,KAAK,WAClB,EAEF,KAAC,QAAQ,IACP,IAAI,EAAC,aAAa,EAClB,QAAQ,EAAE,WAAW,CAAC,QAAQ,EAC9B,KAAK,EAAC,mBAAmB,EACzB,MAAM,EAAE,WAAW,CAAC,MAAM,EAC1B,IAAI,EAAE,WAAW,CAAC,IAAI,IAAI,WAAW,CAAC,IAAI,EAC1C,QAAQ,EAAE,CAAC,CAAmC,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,EACrE,MAAM,EAAE,CAAC,CAA+B,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,WAC/D,EACF,KAAC,gBAAgB,IACf,KAAK,EAAC,WAAW,EACjB,IAAI,EAAC,iCAAiC,EACtC,KAAK,EAAE,EAAE,EACT,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,WAClB,EACF,KAAC,gBAAgB,IACf,KAAK,EAAC,sBAAsB,EAC5B,IAAI,EAAC,mCAAmC,EACxC,KAAK,EAAE,EAAE,EACT,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,WAClB,YACG,WACF,WACK,WACT,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { FormEvent, useReducer, useContext, ChangeEvent, FocusEvent, useState } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Form,\n  Button,\n  Flex,\n  Input,\n  ToasterContext,\n  TextArea,\n  Card,\n  CardContent,\n  registerIcon,\n  menuHelpers,\n  StyledRegion\n} from '@pega/cosmos-react-core';\nimport { ObjectSelect, ObjectSelectProps } from '@pega/cosmos-react-build';\nimport * as times from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\n\nimport { StyledConfigurationContent } from './ObjectSelect.styles';\nimport {\n  skeletonData,\n  fieldReducer,\n  initFields,\n  ObjectSelectStoryProps,\n  ObjectSelectComp\n} from './ObjectSelect.mocks';\n\nregisterIcon(times);\n\nexport default {\n  title: 'Build/ObjectSelect',\n  component: ObjectSelect\n} as Meta;\n\nexport const ObjectSelectSkeleton: Story<ObjectSelectStoryProps> = (\n  args: ObjectSelectStoryProps\n) => {\n  const [value, setValue] = useState<ObjectSelectProps['value']>(args.value);\n\n  return (\n    <ObjectSelect\n      {...args}\n      items={skeletonData}\n      value={value}\n      onChange={id => {\n        const data = menuHelpers.getItem(skeletonData, id);\n        if (data) {\n          setValue({\n            id: data.id,\n            primary: data.primary,\n            href: data.href ?? '#',\n            meta: data.id !== '01-4' ? data.secondary?.join('  ') : ''\n          });\n        } else setValue(undefined);\n      }}\n      configuration={{\n        label: 'Gear button label',\n        heading: 'Popover heading',\n        primaryAction: {\n          id: 'primaryAction',\n          text: 'Primary action text',\n          onClick: args.onSubmit\n        },\n        secondaryAction: {\n          id: 'secondaryAction',\n          text: 'Secondary action text',\n          onClick: args.onCancel\n        },\n        content: (\n          <StyledConfigurationContent>\n            <StyledRegion style={{ minHeight: '20vh' }} />\n          </StyledConfigurationContent>\n        )\n      }}\n      onPreview={args.onPreview}\n    />\n  );\n};\n\nObjectSelectSkeleton.args = {\n  label: 'Object select label',\n  labelHidden: false,\n  info: 'Object select info text',\n  placeholder: '',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  // eslint-disable-next-line demo-patterns/literal-args\n  onPreview: action('Clicked preview link'),\n  // eslint-disable-next-line demo-patterns/literal-args\n  onSubmit: action('Clicked submit button'),\n  // eslint-disable-next-line demo-patterns/literal-args\n  onCancel: action('Clicked cancel button')\n};\n\nObjectSelectSkeleton.argTypes = {\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  onPreview: { table: { disable: true } },\n  onSubmit: { table: { disable: true } },\n  onCancel: { table: { disable: true } }\n};\n\nexport const ObjectSelectDemo: Story<ObjectSelectStoryProps> = (args: ObjectSelectStoryProps) => {\n  return <ObjectSelectComp {...args} popoverContent={args.popoverContent} />;\n};\n\nObjectSelectDemo.args = {\n  label: 'Data source',\n  labelHidden: false,\n  info: 'Select an appropriate data source',\n  placeholder: '',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  popoverContent: 'simple',\n  // eslint-disable-next-line demo-patterns/literal-args\n  onPreview: () => {},\n  // eslint-disable-next-line demo-patterns/literal-args\n  onSubmit: action('Clicked submit button'),\n  // eslint-disable-next-line demo-patterns/literal-args\n  onCancel: action('Clicked cancel button')\n};\n\nObjectSelectDemo.argTypes = {\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  popoverContent: { options: ['simple', 'advanced'], control: { type: 'radio' } },\n  onPreview: { table: { disable: true } },\n  onSubmit: { table: { disable: true } },\n  onCancel: { table: { disable: true } }\n};\n\nexport const ObjectSelectDemoInForm = () => {\n  const [fields, setField] = useReducer(fieldReducer, undefined, initFields);\n  const { push } = useContext(ToasterContext);\n\n  const name = fields.find(field => field.name === 'name');\n  const description = fields.find(field => field.name === 'description');\n\n  if (!name || !description) return null;\n\n  const canSubmit = fields.every(field => field.value && field.validator());\n\n  const actions = (\n    <>\n      <Button\n        name='Cancel'\n        variant='secondary'\n        onClick={() => {\n          push({ content: 'Form cancelled!' });\n        }}\n      >\n        Cancel\n      </Button>\n      <Button name='Submit' type='submit' variant='primary' disabled={!canSubmit}>\n        Submit\n      </Button>\n    </>\n  );\n\n  return (\n    <Card style={{ margin: 'auto', maxWidth: '37.5rem' }}>\n      <CardContent>\n        <Form\n          actions={actions}\n          onSubmit={(e: FormEvent) => {\n            e.preventDefault();\n            push({ content: 'Form submitted!' });\n          }}\n          heading='Configure Table'\n        >\n          <Flex container={{ direction: 'column', gap: 2 }} item={{ grow: 1 }}>\n            <Input\n              name='name'\n              label='Table name'\n              value={name.value}\n              required={name.required}\n              status={name.status}\n              info='Enter a valid table name'\n              onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n              onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n              autoComplete='off'\n            />\n\n            <TextArea\n              name='description'\n              required={description.required}\n              label='Table description'\n              status={description.status}\n              info={description.info || description.help}\n              onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setField({ ...e })}\n              onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n            />\n            <ObjectSelectComp\n              label='Data page'\n              info='Select an appropriate data page'\n              items={[]}\n              onChange={() => {}}\n            />\n            <ObjectSelectComp\n              label='Visibility condition'\n              info='Choose a when condition from list'\n              items={[]}\n              onChange={() => {}}\n            />\n          </Flex>\n        </Form>\n      </CardContent>\n    </Card>\n  );\n};\n"]}
+{"version":3,"file":"ObjectSelect.stories.js","sourceRoot":"","sources":["../../../src/build/ObjectSelect/ObjectSelect.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { FormEvent, useReducer, useContext, ChangeEvent, FocusEvent, useState } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Form,\n  Button,\n  Flex,\n  Input,\n  ToasterContext,\n  TextArea,\n  Card,\n  CardContent,\n  registerIcon,\n  menuHelpers,\n  StyledRegion,\n  MenuItemProps,\n  FieldValueListProps\n} from '@pega/cosmos-react-core';\nimport { ObjectSelect, ObjectSelectProps } from '@pega/cosmos-react-build';\nimport * as times from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\n\nimport { StyledConfigurationContent } from './ObjectSelect.styles';\nimport {\n  skeletonData,\n  fieldReducer,\n  initFields,\n  ObjectSelectStoryProps,\n  ObjectSelectComp,\n  dataPages,\n  ViewportDrawer\n} from './ObjectSelect.mocks';\n\nregisterIcon(times);\n\nexport default {\n  title: 'Build/ObjectSelect',\n  component: ObjectSelect\n} as Meta;\n\nexport const ObjectSelectSkeleton: Story<ObjectSelectStoryProps> = (\n  args: ObjectSelectStoryProps\n) => {\n  const [value, setValue] = useState<ObjectSelectProps['value']>(args.value);\n\n  return (\n    <ObjectSelect\n      {...args}\n      items={skeletonData}\n      value={value}\n      onChange={id => {\n        const data = menuHelpers.getItem(skeletonData, id);\n        if (data) {\n          setValue({\n            id: data.id,\n            primary: data.primary,\n            href: data.href ?? '#',\n            meta: data.id !== '01-4' ? data.secondary?.join('  ') : ''\n          });\n        } else setValue(undefined);\n      }}\n      configuration={{\n        label: 'Gear button label',\n        heading: 'Popover heading',\n        primaryAction: {\n          id: 'primaryAction',\n          text: 'Primary action text',\n          onClick: args.onSubmit\n        },\n        secondaryAction: {\n          id: 'secondaryAction',\n          text: 'Secondary action text',\n          onClick: args.onCancel\n        },\n        content: (\n          <StyledConfigurationContent>\n            <StyledRegion style={{ minHeight: '20vh' }} />\n          </StyledConfigurationContent>\n        )\n      }}\n      onPreview={args.onPreview}\n      onLinkClick={(id, e) => {\n        e.preventDefault();\n        action(`item with id - ${id} is clicked`)(e);\n      }}\n    />\n  );\n};\n\nObjectSelectSkeleton.args = {\n  label: 'Object select label',\n  labelHidden: false,\n  info: 'Object select info text',\n  placeholder: '',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  // eslint-disable-next-line demo-patterns/literal-args\n  onPreview: action('Clicked preview link'),\n  // eslint-disable-next-line demo-patterns/literal-args\n  onSubmit: action('Clicked submit button'),\n  // eslint-disable-next-line demo-patterns/literal-args\n  onCancel: action('Clicked cancel button')\n};\n\nObjectSelectSkeleton.argTypes = {\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  onPreview: { table: { disable: true } },\n  onSubmit: { table: { disable: true } },\n  onCancel: { table: { disable: true } }\n};\n\nexport const ObjectSelectDemo: Story<ObjectSelectStoryProps> = (args: ObjectSelectStoryProps) => {\n  const [drawerOpen, setDrawerOpen] = useState(false);\n  const [drawerData, setDrawerData] = useState<\n    MenuItemProps & { metaData: FieldValueListProps['fields'] }\n  >(dataPages[0]);\n  return (\n    <>\n      <ObjectSelectComp\n        {...args}\n        popoverContent={args.popoverContent}\n        onPreview={id => {\n          const data = dataPages.find(dataPage => dataPage.id === id);\n          if (data) setDrawerData(data);\n          if (!drawerOpen) {\n            setDrawerOpen(true);\n          }\n        }}\n      />\n      <ViewportDrawer\n        drawerData={drawerData}\n        drawerOpen={drawerOpen}\n        setDrawerOpen={setDrawerOpen}\n      />\n    </>\n  );\n};\n\nObjectSelectDemo.args = {\n  label: 'Data source',\n  labelHidden: false,\n  info: 'Select an appropriate data source',\n  placeholder: '',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  popoverContent: 'simple',\n  // eslint-disable-next-line demo-patterns/literal-args\n  onPreview: () => {},\n  // eslint-disable-next-line demo-patterns/literal-args\n  onSubmit: action('Clicked submit button'),\n  // eslint-disable-next-line demo-patterns/literal-args\n  onCancel: action('Clicked cancel button')\n};\n\nObjectSelectDemo.argTypes = {\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  popoverContent: { options: ['simple', 'advanced'], control: { type: 'radio' } },\n  onPreview: { table: { disable: true } },\n  onSubmit: { table: { disable: true } },\n  onCancel: { table: { disable: true } }\n};\n\nexport const ObjectSelectDemoInForm = () => {\n  const [fields, setField] = useReducer(fieldReducer, undefined, initFields);\n  const { push } = useContext(ToasterContext);\n  const [drawerOpen, setDrawerOpen] = useState(false);\n  const [drawerData, setDrawerData] = useState<\n    MenuItemProps & { metaData: FieldValueListProps['fields'] }\n  >(dataPages[0]);\n\n  const name = fields.find(field => field.name === 'name');\n  const description = fields.find(field => field.name === 'description');\n\n  if (!name || !description) return null;\n\n  const canSubmit = fields.every(field => field.value && field.validator());\n\n  const actions = (\n    <>\n      <Button\n        name='Cancel'\n        variant='secondary'\n        onClick={() => {\n          push({ content: 'Form cancelled!' });\n        }}\n      >\n        Cancel\n      </Button>\n      <Button name='Submit' type='submit' variant='primary' disabled={!canSubmit}>\n        Submit\n      </Button>\n    </>\n  );\n\n  return (\n    <Card style={{ margin: 'auto', maxWidth: '37.5rem' }}>\n      <CardContent>\n        <Form\n          actions={actions}\n          onSubmit={(e: FormEvent) => {\n            e.preventDefault();\n            push({ content: 'Form submitted!' });\n          }}\n          heading='Configure Table'\n        >\n          <Flex container={{ direction: 'column', gap: 2 }} item={{ grow: 1 }}>\n            <Input\n              name='name'\n              label='Table name'\n              value={name.value}\n              required={name.required}\n              status={name.status}\n              info='Enter a valid table name'\n              onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n              onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n              autoComplete='off'\n            />\n\n            <TextArea\n              name='description'\n              required={description.required}\n              label='Table description'\n              status={description.status}\n              info={description.info || description.help}\n              onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setField({ ...e })}\n              onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n            />\n            <ObjectSelectComp\n              label='Data page'\n              info='Select an appropriate data page'\n              items={[]}\n              onChange={() => {}}\n              onPreview={id => {\n                const data = dataPages.find(dataPage => dataPage.id === id);\n                if (data) setDrawerData(data);\n                if (!drawerOpen) {\n                  setDrawerOpen(true);\n                }\n              }}\n            />\n            <ObjectSelectComp\n              label='Visibility condition'\n              info='Choose a when condition from list'\n              items={[]}\n              onChange={() => {}}\n              onPreview={id => {\n                const data = dataPages.find(dataPage => dataPage.id === id);\n                if (data) setDrawerData(data);\n                if (!drawerOpen) {\n                  setDrawerOpen(true);\n                }\n              }}\n            />\n            <ViewportDrawer\n              drawerData={drawerData}\n              drawerOpen={drawerOpen}\n              setDrawerOpen={setDrawerOpen}\n            />\n          </Flex>\n        </Form>\n      </CardContent>\n    </Card>\n  );\n};\n"]}

package/lib/build/PageTemplates/GalleryPage.mocks.d.ts

@@ -2,6 +2,7 @@
 export declare const appHeader: {
     brand: {
         name: string;
+        visual: {};
     };
     utils: {
         avatar: {
@@ -29,17 +30,17 @@ export declare const getOverviewCardData: () => {
     description: string;
     meta: (string | JSX.Element)[];
     visual: {
-        icon: {
-            name: string;
-            bgColor: string;
-        };
-        image?: undefined;
+        icon: string;
+        color: string;
+        backgroundColor: string;
+        imageSrc?: undefined;
+        name?: undefined;
     } | {
-        image: {
-            src: string;
-            alt: string;
-        };
+        imageSrc: string;
+        name: string;
         icon?: undefined;
+        color?: undefined;
+        backgroundColor?: undefined;
     };
 }[];
 //# sourceMappingURL=GalleryPage.mocks.d.ts.map

package/lib/build/PageTemplates/GalleryPage.mocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryPage.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.mocks.tsx"],"names":[],"mappings":";AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;CAkDrB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;GA2B/B,CAAC"}
+{"version":3,"file":"GalleryPage.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.mocks.tsx"],"names":[],"mappings":";AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;CAmDrB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;GAyB/B,CAAC"}

package/lib/build/PageTemplates/GalleryPage.mocks.js

@@ -2,7 +2,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { createUID, range, Status } from '@pega/cosmos-react-core';
 export const appHeader = {
     brand: {
-        name: 'AppStudioX'
+        name: 'AppStudioX',
+        visual: {}
     },
     utils: {
         avatar: { name: 'Alan' },
@@ -60,19 +61,16 @@ export const getOverviewCardData = () => {
         description: num % 2 !== 0
             ? `Description for application with id ${num}`
             : `Long Description for application with id ${num} to simulate ellipsis in the application description in stories`,
-        meta: [_jsx(Status, { variant: 'success', children: "in production" }, void 0), '1.0.0'],
+        meta: [_jsx(Status, { variant: 'success', children: "in production" }), '1.0.0'],
         visual: num % 2 !== 0
             ? {
-                icon: {
-                    name: 'phone-in-solid',
-                    bgColor: '#0ac7c8'
-                }
+                icon: 'phone-in-solid',
+                color: '#ffffff',
+                backgroundColor: '#0ac7c8'
             }
             : {
-                image: {
-                    src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',
-                    alt: 'Image for the card summary'
-                }
+                imageSrc: 'https://www.pega.com/sites/default/files/media/images/2018-12/Pega.com-og.png',
+                name: 'Image for the card summary'
             }
     }));
 };

package/lib/build/PageTemplates/GalleryPage.mocks.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryPage.mocks.js","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEnE,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,KAAK,EAAE;QACL,IAAI,EAAE,YAAY;KACnB;IACD,KAAK,EAAE;QACL,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;QACxB,MAAM,EAAE;YACN,WAAW,EAAE,4BAA4B;SAC1C;QACD,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE;YACP;gBACE,OAAO,EAAE,eAAe;gBACxB,EAAE,EAAE,cAAc;gBAClB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;aAClB;YACD;gBACE,OAAO,EAAE,eAAe;gBACxB,EAAE,EAAE,cAAc;gBAClB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;aAClB;SACF;KACF;IACD,KAAK,EAAE;QACL;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,cAAc;YACpB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,kBAAkB;YACxB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,gBAAgB;YACtB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;KACF;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,EAAE;IACtC,OAAO,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAC9B,EAAE,EAAE,SAAS,EAAE;QACf,KAAK,EACH,GAAG,GAAG,CAAC,KAAK,CAAC;YACX,CAAC,CAAC,eAAe,GAAG,EAAE;YACtB,CAAC,CAAC,eAAe,GAAG,sCAAsC;QAC9D,WAAW,EACT,GAAG,GAAG,CAAC,KAAK,CAAC;YACX,CAAC,CAAC,uCAAuC,GAAG,EAAE;YAC9C,CAAC,CAAC,4CAA4C,GAAG,iEAAiE;QACtH,IAAI,EAAE,CAAC,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,sCAAuB,EAAE,OAAO,CAAC;QACjE,MAAM,EACJ,GAAG,GAAG,CAAC,KAAK,CAAC;YACX,CAAC,CAAC;gBACE,IAAI,EAAE;oBACJ,IAAI,EAAE,gBAAgB;oBACtB,OAAO,EAAE,SAAS;iBACnB;aACF;YACH,CAAC,CAAC;gBACE,KAAK,EAAE;oBACL,GAAG,EAAE,kGAAkG;oBACvG,GAAG,EAAE,4BAA4B;iBAClC;aACF;KACR,CAAC,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { createUID, range, Status } from '@pega/cosmos-react-core';\n\nexport const appHeader = {\n  brand: {\n    name: 'AppStudioX'\n  },\n  utils: {\n    avatar: { name: 'Alan' },\n    search: {\n      placeholder: 'Search anything, anywhere…'\n    },\n    branchName: 'test',\n    actions: [\n      {\n        primary: 'Switch branch',\n        id: 'switchbranch',\n        onClick: () => {}\n      },\n      {\n        primary: 'Create branch',\n        id: 'createbranch',\n        onClick: () => {}\n      }\n    ]\n  },\n  links: [\n    {\n      id: '1',\n      name: 'Applications',\n      onClick: () => {}\n    },\n    {\n      id: '2',\n      name: 'Shared resources',\n      onClick: () => {}\n    },\n    {\n      id: '3',\n      name: 'Teams',\n      onClick: () => {}\n    },\n    {\n      id: '4',\n      name: 'AI & Analytics',\n      onClick: () => {}\n    },\n    {\n      id: '5',\n      name: 'Deploy',\n      onClick: () => {}\n    }\n  ]\n};\n\nexport const getOverviewCardData = () => {\n  return range(1, 14).map(num => ({\n    id: createUID(),\n    title:\n      num % 2 !== 0\n        ? `Application ${num}`\n        : `Application ${num} with long name to simulate ellipsis`,\n    description:\n      num % 2 !== 0\n        ? `Description for application with id ${num}`\n        : `Long Description for application with id ${num} to simulate ellipsis in the application description in stories`,\n    meta: [<Status variant='success'>in production</Status>, '1.0.0'],\n    visual:\n      num % 2 !== 0\n        ? {\n            icon: {\n              name: 'phone-in-solid',\n              bgColor: '#0ac7c8'\n            }\n          }\n        : {\n            image: {\n              src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',\n              alt: 'Image for the card summary'\n            }\n          }\n  }));\n};\n"]}
+{"version":3,"file":"GalleryPage.mocks.js","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEnE,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,KAAK,EAAE;QACL,IAAI,EAAE,YAAY;QAClB,MAAM,EAAE,EAAE;KACX;IACD,KAAK,EAAE;QACL,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;QACxB,MAAM,EAAE;YACN,WAAW,EAAE,4BAA4B;SAC1C;QACD,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE;YACP;gBACE,OAAO,EAAE,eAAe;gBACxB,EAAE,EAAE,cAAc;gBAClB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;aAClB;YACD;gBACE,OAAO,EAAE,eAAe;gBACxB,EAAE,EAAE,cAAc;gBAClB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;aAClB;SACF;KACF;IACD,KAAK,EAAE;QACL;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,cAAc;YACpB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,kBAAkB;YACxB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,gBAAgB;YACtB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;QACD;YACE,EAAE,EAAE,GAAG;YACP,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;SAClB;KACF;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,EAAE;IACtC,OAAO,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAC9B,EAAE,EAAE,SAAS,EAAE;QACf,KAAK,EACH,GAAG,GAAG,CAAC,KAAK,CAAC;YACX,CAAC,CAAC,eAAe,GAAG,EAAE;YACtB,CAAC,CAAC,eAAe,GAAG,sCAAsC;QAC9D,WAAW,EACT,GAAG,GAAG,CAAC,KAAK,CAAC;YACX,CAAC,CAAC,uCAAuC,GAAG,EAAE;YAC9C,CAAC,CAAC,4CAA4C,GAAG,iEAAiE;QACtH,IAAI,EAAE,CAAC,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,8BAAuB,EAAE,OAAO,CAAC;QACjE,MAAM,EACJ,GAAG,GAAG,CAAC,KAAK,CAAC;YACX,CAAC,CAAC;gBACE,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,SAAS;gBAChB,eAAe,EAAE,SAAS;aAC3B;YACH,CAAC,CAAC;gBACE,QAAQ,EACN,+EAA+E;gBACjF,IAAI,EAAE,4BAA4B;aACnC;KACR,CAAC,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { createUID, range, Status } from '@pega/cosmos-react-core';\n\nexport const appHeader = {\n  brand: {\n    name: 'AppStudioX',\n    visual: {}\n  },\n  utils: {\n    avatar: { name: 'Alan' },\n    search: {\n      placeholder: 'Search anything, anywhere…'\n    },\n    branchName: 'test',\n    actions: [\n      {\n        primary: 'Switch branch',\n        id: 'switchbranch',\n        onClick: () => {}\n      },\n      {\n        primary: 'Create branch',\n        id: 'createbranch',\n        onClick: () => {}\n      }\n    ]\n  },\n  links: [\n    {\n      id: '1',\n      name: 'Applications',\n      onClick: () => {}\n    },\n    {\n      id: '2',\n      name: 'Shared resources',\n      onClick: () => {}\n    },\n    {\n      id: '3',\n      name: 'Teams',\n      onClick: () => {}\n    },\n    {\n      id: '4',\n      name: 'AI & Analytics',\n      onClick: () => {}\n    },\n    {\n      id: '5',\n      name: 'Deploy',\n      onClick: () => {}\n    }\n  ]\n};\n\nexport const getOverviewCardData = () => {\n  return range(1, 14).map(num => ({\n    id: createUID(),\n    title:\n      num % 2 !== 0\n        ? `Application ${num}`\n        : `Application ${num} with long name to simulate ellipsis`,\n    description:\n      num % 2 !== 0\n        ? `Description for application with id ${num}`\n        : `Long Description for application with id ${num} to simulate ellipsis in the application description in stories`,\n    meta: [<Status variant='success'>in production</Status>, '1.0.0'],\n    visual:\n      num % 2 !== 0\n        ? {\n            icon: 'phone-in-solid',\n            color: '#ffffff',\n            backgroundColor: '#0ac7c8'\n          }\n        : {\n            imageSrc:\n              'https://www.pega.com/sites/default/files/media/images/2018-12/Pega.com-og.png',\n            name: 'Image for the card summary'\n          }\n  }));\n};\n"]}

package/lib/build/PageTemplates/GalleryPage.stories.d.ts

@@ -8,6 +8,5 @@ interface GalleryPageArgs {
     emptyStateHeading: string;
     emptyStateDescription: string;
 }
-export declare const GalleryPageDemo: Story<GalleryPageArgs>;
 export declare const AppShellWithGalleryPage: Story<GalleryPageArgs>;
 //# sourceMappingURL=GalleryPage.stories.d.ts.map

package/lib/build/PageTemplates/GalleryPage.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryPage.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAO/C,wBAMU;AAEV,UAAU,eAAe;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,eAAe,CAmBlD,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,eAAe,CAsB1D,CAAC"}
+{"version":3,"file":"GalleryPage.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAO/C,wBAMU;AAEV,UAAU,eAAe;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,eAAe,CA+C1D,CAAC"}

package/lib/build/PageTemplates/GalleryPage.stories.js

@@ -9,17 +9,17 @@ export default {
         layout: 'fullscreen'
     }
 };
-export const GalleryPageDemo = (args) => (_jsx(GalleryPage, { heading: args.bannerHeading, description: args.bannerDescription, image: {
-        src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',
-        alt: 'Image for the banner'
-    }, items: args.showEmptyState ? [] : getOverviewCardData(), emptyState: {
-        heading: args.emptyStateHeading,
-        description: args.emptyStateDescription
-    }, action: {
-        text: 'New application',
-        onClick: action('Clicked New application button')
-    }, onItemClick: action('Clicked interactive card') }, void 0));
 export const AppShellWithGalleryPage = (args) => {
+    const GalleryPageDemo = ({ bannerHeading, bannerDescription, showEmptyState, emptyStateHeading, emptyStateDescription }) => (_jsx(GalleryPage, { heading: bannerHeading, description: bannerDescription, image: {
+            src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',
+            alt: 'Image for the banner'
+        }, items: showEmptyState ? [] : getOverviewCardData(), emptyState: {
+            heading: emptyStateHeading,
+            description: emptyStateDescription
+        }, action: {
+            text: 'New application',
+            onClick: action('Clicked New application button')
+        }, onItemClick: action('Clicked interactive card') }));
     return (_jsx(AppShell, { navigation: {
             nodes: [],
             currentNodeId: '1',
@@ -27,12 +27,10 @@ export const AppShellWithGalleryPage = (args) => {
         }, appInfo: {
             text: 'U+ Desk',
             visual: {
-                icon: {
-                    name: 'phone-in-solid',
-                    bgColor: '#0ac7c8'
-                }
+                icon: 'phone-in-solid',
+                backgroundColor: '#0ac7c8'
             }
-        }, appHeader: appHeader, main: _jsx(GalleryPageDemo, { ...args }, void 0), hideNav: true }, void 0));
+        }, appHeader: appHeader, main: _jsx(GalleryPageDemo, { ...args }), hideNav: true }));
 };
 AppShellWithGalleryPage.args = {
     bannerHeading: 'Applications',