@pega/cosmos-react-demos 4.0.0-dev.11.0 → 4.0.0-dev.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (87) hide show
  1. package/jsx/core/CheckboxGroup/CheckboxGroup.stories.jsx +1 -1
  2. package/jsx/core/CheckboxGroup/CheckboxGroup.stories.jsx.map +1 -1
  3. package/jsx/core/FieldGroup/FieldGroup.stories.d.ts +5 -0
  4. package/jsx/core/FieldGroup/FieldGroup.stories.d.ts.map +1 -1
  5. package/jsx/core/FieldGroup/FieldGroup.stories.jsx +16 -2
  6. package/jsx/core/FieldGroup/FieldGroup.stories.jsx.map +1 -1
  7. package/jsx/core/FieldGroup/FieldGroupList.mocks.d.ts.map +1 -1
  8. package/jsx/core/FieldGroup/FieldGroupList.mocks.jsx +6 -1
  9. package/jsx/core/FieldGroup/FieldGroupList.mocks.jsx.map +1 -1
  10. package/jsx/core/FieldGroup/FieldGroupList.stories.d.ts.map +1 -1
  11. package/jsx/core/FieldGroup/FieldGroupList.stories.jsx +6 -3
  12. package/jsx/core/FieldGroup/FieldGroupList.stories.jsx.map +1 -1
  13. package/jsx/core/MultiStepForm/MultiStepForm.mocks.jsx +1 -1
  14. package/jsx/core/MultiStepForm/MultiStepForm.mocks.jsx.map +1 -1
  15. package/jsx/core/MultiStepForm/MultiStepForm.stories.d.ts +5 -1
  16. package/jsx/core/MultiStepForm/MultiStepForm.stories.d.ts.map +1 -1
  17. package/jsx/core/MultiStepForm/MultiStepForm.stories.jsx +10 -4
  18. package/jsx/core/MultiStepForm/MultiStepForm.stories.jsx.map +1 -1
  19. package/jsx/core/RadioButtonGroup/RadioButtonGroup.stories.jsx +1 -1
  20. package/jsx/core/RadioButtonGroup/RadioButtonGroup.stories.jsx.map +1 -1
  21. package/jsx/core/Tabs/Tabs.stories.d.ts +0 -6
  22. package/jsx/core/Tabs/Tabs.stories.d.ts.map +1 -1
  23. package/jsx/core/Tabs/Tabs.stories.jsx +1 -40
  24. package/jsx/core/Tabs/Tabs.stories.jsx.map +1 -1
  25. package/jsx/cs/CallControlPanel/CallControlPanel.stories.d.ts.map +1 -1
  26. package/jsx/cs/CallControlPanel/CallControlPanel.stories.jsx +1 -0
  27. package/jsx/cs/CallControlPanel/CallControlPanel.stories.jsx.map +1 -1
  28. package/jsx/work/CaseView/CaseView.mocks.d.ts.map +1 -1
  29. package/jsx/work/CaseView/CaseView.mocks.jsx +3 -0
  30. package/jsx/work/CaseView/CaseView.mocks.jsx.map +1 -1
  31. package/jsx/work/CaseView/Details.mocks.jsx +1 -1
  32. package/jsx/work/CaseView/Details.mocks.jsx.map +1 -1
  33. package/jsx/work/Predictions/Predictions.mocks.d.ts +3 -0
  34. package/jsx/work/Predictions/Predictions.mocks.d.ts.map +1 -0
  35. package/jsx/work/Predictions/Predictions.mocks.jsx +18 -0
  36. package/jsx/work/Predictions/Predictions.mocks.jsx.map +1 -0
  37. package/jsx/work/Predictions/Predictions.stories.d.ts +5 -0
  38. package/jsx/work/Predictions/Predictions.stories.d.ts.map +1 -0
  39. package/jsx/work/Predictions/Predictions.stories.jsx +53 -0
  40. package/jsx/work/Predictions/Predictions.stories.jsx.map +1 -0
  41. package/jsx/work/Stakeholders/Stakeholders.mocks.d.ts.map +1 -1
  42. package/jsx/work/Stakeholders/Stakeholders.mocks.jsx +3 -1
  43. package/jsx/work/Stakeholders/Stakeholders.mocks.jsx.map +1 -1
  44. package/lib/core/CheckboxGroup/CheckboxGroup.stories.js +1 -1
  45. package/lib/core/CheckboxGroup/CheckboxGroup.stories.js.map +1 -1
  46. package/lib/core/FieldGroup/FieldGroup.stories.d.ts +5 -0
  47. package/lib/core/FieldGroup/FieldGroup.stories.d.ts.map +1 -1
  48. package/lib/core/FieldGroup/FieldGroup.stories.js +16 -2
  49. package/lib/core/FieldGroup/FieldGroup.stories.js.map +1 -1
  50. package/lib/core/FieldGroup/FieldGroupList.mocks.d.ts.map +1 -1
  51. package/lib/core/FieldGroup/FieldGroupList.mocks.js +6 -1
  52. package/lib/core/FieldGroup/FieldGroupList.mocks.js.map +1 -1
  53. package/lib/core/FieldGroup/FieldGroupList.stories.d.ts.map +1 -1
  54. package/lib/core/FieldGroup/FieldGroupList.stories.js +6 -3
  55. package/lib/core/FieldGroup/FieldGroupList.stories.js.map +1 -1
  56. package/lib/core/MultiStepForm/MultiStepForm.mocks.js +1 -1
  57. package/lib/core/MultiStepForm/MultiStepForm.mocks.js.map +1 -1
  58. package/lib/core/MultiStepForm/MultiStepForm.stories.d.ts +5 -1
  59. package/lib/core/MultiStepForm/MultiStepForm.stories.d.ts.map +1 -1
  60. package/lib/core/MultiStepForm/MultiStepForm.stories.js +10 -4
  61. package/lib/core/MultiStepForm/MultiStepForm.stories.js.map +1 -1
  62. package/lib/core/RadioButtonGroup/RadioButtonGroup.stories.js +1 -1
  63. package/lib/core/RadioButtonGroup/RadioButtonGroup.stories.js.map +1 -1
  64. package/lib/core/Tabs/Tabs.stories.d.ts +0 -6
  65. package/lib/core/Tabs/Tabs.stories.d.ts.map +1 -1
  66. package/lib/core/Tabs/Tabs.stories.js +1 -31
  67. package/lib/core/Tabs/Tabs.stories.js.map +1 -1
  68. package/lib/cs/CallControlPanel/CallControlPanel.stories.d.ts.map +1 -1
  69. package/lib/cs/CallControlPanel/CallControlPanel.stories.js +1 -0
  70. package/lib/cs/CallControlPanel/CallControlPanel.stories.js.map +1 -1
  71. package/lib/work/CaseView/CaseView.mocks.d.ts.map +1 -1
  72. package/lib/work/CaseView/CaseView.mocks.js +3 -1
  73. package/lib/work/CaseView/CaseView.mocks.js.map +1 -1
  74. package/lib/work/CaseView/Details.mocks.js +1 -1
  75. package/lib/work/CaseView/Details.mocks.js.map +1 -1
  76. package/lib/work/Predictions/Predictions.mocks.d.ts +3 -0
  77. package/lib/work/Predictions/Predictions.mocks.d.ts.map +1 -0
  78. package/lib/work/Predictions/Predictions.mocks.js +6 -0
  79. package/lib/work/Predictions/Predictions.mocks.js.map +1 -0
  80. package/lib/work/Predictions/Predictions.stories.d.ts +5 -0
  81. package/lib/work/Predictions/Predictions.stories.d.ts.map +1 -0
  82. package/lib/work/Predictions/Predictions.stories.js +54 -0
  83. package/lib/work/Predictions/Predictions.stories.js.map +1 -0
  84. package/lib/work/Stakeholders/Stakeholders.mocks.d.ts.map +1 -1
  85. package/lib/work/Stakeholders/Stakeholders.mocks.js +1 -1
  86. package/lib/work/Stakeholders/Stakeholders.mocks.js.map +1 -1
  87. package/package.json +9 -9
@@ -1 +1 @@
1
- {"version":3,"file":"MultiStepForm.stories.jsx","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { type ReactNode, type Reducer, type MouseEvent, useReducer, useMemo } from 'react';\n\nimport { Button, Banner, Flex, MultiStepForm, Text } from '@pega/cosmos-react-core';\nimport { Step } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm.types';\n\nimport {\n type DemoFormDataType,\n type DemoFormErrorsType,\n ApplicantDetailsFields,\n InterviewNotesFields,\n RecommendationsFields,\n NextInterviewFields\n} from './MultiStepForm.mocks';\n\nexport default {\n title: 'Core/MultiStepForm',\n component: MultiStepForm\n} as Meta;\n\ninterface DemoMultiStepState {\n formData: DemoFormDataType;\n formErrors: DemoFormErrorsType;\n currentStepIndex: number;\n numSteps: number;\n cancelled: boolean;\n finished: boolean;\n}\n\ninterface ReducerAction {\n type: string;\n payload?: any;\n}\n\ninterface FormValidations {\n [field: string]: {\n message?: string;\n validator: (value: any) => boolean;\n };\n}\n\nexport const MultiStepFormDemo: Story = () => {\n const initialState = useMemo<DemoMultiStepState>(\n () => ({\n currentStepIndex: 0,\n cancelled: false,\n finished: false,\n numSteps: 3,\n formData: {\n firstName: 'Marcus',\n lastName: 'Kennedy',\n currentTitle: 'Data Analyst',\n currentCompany: 'Hello Fresh'\n },\n formErrors: {}\n }),\n []\n );\n\n const formValidation = useMemo<FormValidations>(\n () => ({\n salaryRequested: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n experienceLevel: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n nextInterviewer: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n salaryRequestReview: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n cultureFit: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n finalRecommendation: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n }\n }),\n []\n );\n\n const stepFields = useMemo<string[][]>(() => {\n return [\n [\n 'firstName',\n 'lastName',\n 'currentTitle',\n 'currentCompany',\n 'salaryRequested',\n 'experienceLevel',\n 'priorityOne',\n 'priorityTwo',\n 'priorityThree'\n ],\n ['interviewNotes', 'additionalInterview'],\n ['nextInterviewer'],\n ['salaryRequestReview', 'cultureFit', 'finalRecommendation', 'recommendationComments']\n ];\n }, []);\n\n const reducer = (state: DemoMultiStepState, action: ReducerAction) => {\n const type = action.type;\n const payload = action.payload;\n\n switch (type) {\n case 'restart': {\n return initialState;\n }\n case 'cancel': {\n return {\n ...state,\n cancelled: true\n };\n }\n case 'finish': {\n return {\n ...state,\n finished: true\n };\n }\n case 'setStep': {\n return {\n ...state,\n currentStepIndex: payload,\n formErrors: {}\n };\n }\n case 'setFieldValue': {\n const { field, value } = payload;\n const formData = {\n ...state.formData\n };\n const formErrors = {\n ...state.formErrors\n };\n\n formData[field] = value;\n\n if (formErrors[field] && Object.prototype.hasOwnProperty.call(formValidation, field)) {\n const valid = formValidation[field].validator(value);\n\n if (valid) {\n delete formErrors[field];\n } else {\n formErrors[field] = formValidation[field].message;\n }\n }\n\n return {\n ...state,\n formData,\n formErrors\n };\n }\n case 'submitCurrentStep': {\n const stepIndex =\n state.numSteps === 4 || state.currentStepIndex <= 1\n ? state.currentStepIndex\n : state.currentStepIndex + 1;\n const formErrors = { ...state.formErrors };\n let isValid = true;\n\n const validateFields = (fields: string[]) => {\n if (!fields) return;\n\n fields.forEach(field => {\n if (Object.prototype.hasOwnProperty.call(formValidation, field)) {\n const valid = formValidation[field].validator(state.formData[field]);\n\n if (valid) {\n delete formErrors[field];\n } else {\n isValid = false;\n formErrors[field] = formValidation[field].message;\n }\n }\n });\n };\n\n validateFields(stepFields[stepIndex]);\n\n return {\n ...state,\n numSteps: state.formData.additionalInterview ? 4 : 3,\n currentStepIndex:\n isValid && state.currentStepIndex !== state.numSteps - 1\n ? state.currentStepIndex + 1\n : state.currentStepIndex,\n finished: isValid && state.currentStepIndex === state.numSteps - 1,\n formErrors\n };\n }\n default:\n return state;\n }\n };\n\n const [state, dispatch] = useReducer<Reducer<DemoMultiStepState, ReducerAction>>(\n reducer,\n initialState\n );\n\n const stepData: Step[] = useMemo(() => {\n const stepActions: ReactNode = (\n <>\n <Button onClick={() => dispatch({ type: 'cancel' })}>Cancel</Button>\n <div>\n {state.currentStepIndex > 0 && (\n <Button\n onClick={() => dispatch({ type: 'setStep', payload: state.currentStepIndex - 1 })}\n >\n Previous\n </Button>\n )}\n {state.currentStepIndex !== state.numSteps - 1 && (\n <Button variant='primary' onClick={() => dispatch({ type: 'submitCurrentStep' })}>\n Next\n </Button>\n )}\n {state.currentStepIndex === state.numSteps - 1 && (\n <Button\n type='submit'\n variant='primary'\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n dispatch({ type: 'submitCurrentStep' });\n }}\n >\n Finish\n </Button>\n )}\n </div>\n </>\n );\n\n const applicantErrors = Object.keys(state.formErrors).filter(errorField => {\n return stepFields[0].includes(errorField);\n });\n const recommendationErrors = Object.keys(state.formErrors).filter(errorField => {\n return stepFields[3].includes(errorField);\n });\n\n const steps = [\n {\n id: 'applicant_details',\n name: 'Applicant details',\n description:\n 'This applicant has passed initial screening and has been cleared to have an interview scheduled. ' +\n 'Please confirm their details and have a discussion regarding the open position and the company.',\n banners: applicantErrors?.length ? (\n <Banner\n messages={[\n {\n label: 'Your submission failed to process.',\n description: 'Please correct all errors and try again.'\n }\n ]}\n variant='urgent'\n />\n ) : undefined,\n content: (\n <ApplicantDetailsFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n },\n {\n id: 'interview_notes',\n name: 'Interview notes',\n content: (\n <InterviewNotesFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n },\n {\n id: 'recommendations',\n name: 'Final recommendations',\n description:\n 'Based on your screening call with the applicant please submit your recomendations.',\n banners: recommendationErrors?.length ? (\n <Banner\n messages={[\n {\n label: 'Your submission failed to process.',\n description: 'Please correct all errors and try again.'\n }\n ]}\n variant='urgent'\n />\n ) : undefined,\n content: (\n <RecommendationsFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n }\n ];\n\n if (state.numSteps === 4) {\n steps.splice(2, 0, {\n id: 'next_interview',\n name: 'Next interview',\n description: 'Please select an individual to conduct the next interview.',\n banners: undefined,\n content: (\n <NextInterviewFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n });\n }\n\n return steps;\n }, [state.formData, state.formErrors, state.currentStepIndex]);\n\n return (\n <>\n {(state.cancelled || state.finished) && (\n <Flex container={{ gap: 2, alignItems: 'center' }}>\n <Text variant='h1'>HR screening {state.cancelled ? 'cancelled' : 'finished'}</Text>\n <Button\n onClick={() => {\n dispatch({ type: 'restart' });\n }}\n >\n Restart\n </Button>\n </Flex>\n )}\n\n {!state.cancelled && !state.finished && (\n <MultiStepForm\n heading='HR Screening'\n steps={stepData}\n currentStepId={stepData[state.currentStepIndex].id}\n />\n )}\n </>\n );\n};\n"]}
1
+ {"version":3,"file":"MultiStepForm.stories.jsx","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { type ReactNode, type Reducer, type MouseEvent, useReducer, useMemo } from 'react';\n\nimport { Button, Banner, Flex, MultiStepForm, Text } from '@pega/cosmos-react-core';\nimport MultiStepFormProps, {\n Step\n} from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm.types';\n\nimport {\n type DemoFormDataType,\n type DemoFormErrorsType,\n ApplicantDetailsFields,\n InterviewNotesFields,\n RecommendationsFields,\n NextInterviewFields\n} from './MultiStepForm.mocks';\n\nexport default {\n title: 'Core/MultiStepForm',\n component: MultiStepForm,\n args: {\n stepIndicator: 'horizontal'\n },\n argTypes: {\n stepIndicator: { options: ['horizontal', 'vertical', 'none'], control: { type: 'select' } }\n }\n} as Meta;\n\ninterface MultiStepFormDemoProps {\n stepIndicator?: MultiStepFormProps['stepIndicator'];\n}\n\ninterface DemoMultiStepState {\n formData: DemoFormDataType;\n formErrors: DemoFormErrorsType;\n currentStepIndex: number;\n numSteps: number;\n cancelled: boolean;\n finished: boolean;\n}\n\ninterface ReducerAction {\n type: string;\n payload?: any;\n}\n\ninterface FormValidations {\n [field: string]: {\n message?: string;\n validator: (value: any) => boolean;\n };\n}\n\nexport const MultiStepFormDemo: Story<MultiStepFormDemoProps> = (args: MultiStepFormDemoProps) => {\n const initialState = useMemo<DemoMultiStepState>(\n () => ({\n currentStepIndex: 0,\n cancelled: false,\n finished: false,\n numSteps: 3,\n formData: {\n firstName: 'Marcus',\n lastName: 'Kennedy',\n currentTitle: 'Data Analyst',\n currentCompany: 'Hello Fresh'\n },\n formErrors: {}\n }),\n []\n );\n\n const formValidation = useMemo<FormValidations>(\n () => ({\n salaryRequested: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n experienceLevel: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n nextInterviewer: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n salaryRequestReview: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n cultureFit: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n },\n finalRecommendation: {\n message: 'This field is required.',\n validator: (value: string) => value?.length > 0\n }\n }),\n []\n );\n\n const stepFields = useMemo<string[][]>(() => {\n return [\n [\n 'firstName',\n 'lastName',\n 'currentTitle',\n 'currentCompany',\n 'salaryRequested',\n 'experienceLevel',\n 'priorityOne',\n 'priorityTwo',\n 'priorityThree'\n ],\n ['interviewNotes', 'additionalInterview'],\n ['nextInterviewer'],\n ['salaryRequestReview', 'cultureFit', 'finalRecommendation', 'recommendationComments']\n ];\n }, []);\n\n const reducer = (state: DemoMultiStepState, action: ReducerAction) => {\n const type = action.type;\n const payload = action.payload;\n\n switch (type) {\n case 'restart': {\n return initialState;\n }\n case 'cancel': {\n return {\n ...state,\n cancelled: true\n };\n }\n case 'finish': {\n return {\n ...state,\n finished: true\n };\n }\n case 'setStep': {\n return {\n ...state,\n currentStepIndex: payload,\n formErrors: {}\n };\n }\n case 'setFieldValue': {\n const { field, value } = payload;\n const formData = {\n ...state.formData\n };\n const formErrors = {\n ...state.formErrors\n };\n\n formData[field] = value;\n\n if (formErrors[field] && Object.prototype.hasOwnProperty.call(formValidation, field)) {\n const valid = formValidation[field].validator(value);\n\n if (valid) {\n delete formErrors[field];\n } else {\n formErrors[field] = formValidation[field].message;\n }\n }\n\n return {\n ...state,\n formData,\n formErrors\n };\n }\n case 'submitCurrentStep': {\n const stepIndex =\n state.numSteps === 4 || state.currentStepIndex <= 1\n ? state.currentStepIndex\n : state.currentStepIndex + 1;\n const formErrors = { ...state.formErrors };\n let isValid = true;\n\n const validateFields = (fields: string[]) => {\n if (!fields) return;\n\n fields.forEach(field => {\n if (Object.prototype.hasOwnProperty.call(formValidation, field)) {\n const valid = formValidation[field].validator(state.formData[field]);\n\n if (valid) {\n delete formErrors[field];\n } else {\n isValid = false;\n formErrors[field] = formValidation[field].message;\n }\n }\n });\n };\n\n validateFields(stepFields[stepIndex]);\n\n return {\n ...state,\n numSteps: state.formData.additionalInterview ? 4 : 3,\n currentStepIndex:\n isValid && state.currentStepIndex !== state.numSteps - 1\n ? state.currentStepIndex + 1\n : state.currentStepIndex,\n finished: isValid && state.currentStepIndex === state.numSteps - 1,\n formErrors\n };\n }\n default:\n return state;\n }\n };\n\n const [state, dispatch] = useReducer<Reducer<DemoMultiStepState, ReducerAction>>(\n reducer,\n initialState\n );\n\n const stepData: Step[] = useMemo(() => {\n const stepActions: ReactNode = (\n <>\n <Button onClick={() => dispatch({ type: 'cancel' })}>Cancel</Button>\n <div>\n {state.currentStepIndex > 0 && (\n <Button\n onClick={() => dispatch({ type: 'setStep', payload: state.currentStepIndex - 1 })}\n >\n Previous\n </Button>\n )}\n {state.currentStepIndex !== state.numSteps - 1 && (\n <Button variant='primary' onClick={() => dispatch({ type: 'submitCurrentStep' })}>\n Next\n </Button>\n )}\n {state.currentStepIndex === state.numSteps - 1 && (\n <Button\n type='submit'\n variant='primary'\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n dispatch({ type: 'submitCurrentStep' });\n }}\n >\n Finish\n </Button>\n )}\n </div>\n </>\n );\n\n const applicantErrors = Object.keys(state.formErrors).filter(errorField => {\n return stepFields[0].includes(errorField);\n });\n const recommendationErrors = Object.keys(state.formErrors).filter(errorField => {\n return stepFields[3].includes(errorField);\n });\n\n const steps = [\n {\n id: 'applicant_details',\n name: 'Applicant details - personal information',\n description:\n 'This applicant has passed initial screening and has been cleared to have an interview scheduled. ' +\n 'Please confirm their details and have a discussion regarding the open position and the company.',\n banners: applicantErrors?.length ? (\n <Banner\n messages={[\n {\n label: 'Your submission failed to process.',\n description: 'Please correct all errors and try again.'\n }\n ]}\n variant='urgent'\n />\n ) : undefined,\n content: (\n <ApplicantDetailsFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n },\n {\n id: 'interview_notes',\n name: 'Interview notes',\n content: (\n <InterviewNotesFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n },\n {\n id: 'recommendations',\n name: 'Final recommendations',\n description:\n 'Based on your screening call with the applicant please submit your recomendations.',\n banners: recommendationErrors?.length ? (\n <Banner\n messages={[\n {\n label: 'Your submission failed to process.',\n description: 'Please correct all errors and try again.'\n }\n ]}\n variant='urgent'\n />\n ) : undefined,\n content: (\n <RecommendationsFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n }\n ];\n\n if (state.numSteps === 4) {\n steps.splice(2, 0, {\n id: 'next_interview',\n name: 'Next interview',\n description: 'Please select an individual to conduct the next interview.',\n banners: undefined,\n content: (\n <NextInterviewFields\n formData={state.formData}\n formErrors={state.formErrors}\n dispatch={dispatch}\n />\n ),\n actions: stepActions\n });\n }\n\n return steps;\n }, [state.formData, state.formErrors, state.currentStepIndex]);\n\n return (\n <>\n {(state.cancelled || state.finished) && (\n <Flex container={{ gap: 2, alignItems: 'center' }}>\n <Text variant='h1'>HR screening {state.cancelled ? 'cancelled' : 'finished'}</Text>\n <Button\n onClick={() => {\n dispatch({ type: 'restart' });\n }}\n >\n Restart\n </Button>\n </Flex>\n )}\n\n {!state.cancelled && !state.finished && (\n <MultiStepForm\n heading='HR Screening'\n steps={stepData}\n currentStepId={stepData[state.currentStepIndex].id}\n stepIndicator={args.stepIndicator}\n />\n )}\n </>\n );\n};\n"]}
@@ -91,7 +91,7 @@ export const RadioButtonCardGroup = (args) => {
91
91
  </Paragraph>
92
92
  </Flex>
93
93
  </Flex>} id='cosmos'/>
94
- <RadioButton label={<FieldGroup name='Gold service plan'>
94
+ <RadioButton label={<FieldGroup name='Gold service plan' headingTag='h3'>
95
95
  <FieldValueList fields={[
96
96
  { id: 'service', name: 'Service length', value: '1 year' },
97
97
  { id: 'monthly-cost', name: 'Monthly cost', value: '$180.00' },
@@ -1 +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'>\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"]}
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"]}
@@ -1,5 +1,4 @@
1
1
  import { Meta, Story } from '@storybook/react';
2
- import { TabsProps } from '@pega/cosmos-react-core';
3
2
  declare const _default: Meta<import("@storybook/react").Args>;
4
3
  export default _default;
5
4
  interface TabDemoProps {
@@ -7,9 +6,4 @@ interface TabDemoProps {
7
6
  }
8
7
  export declare const TabsDemo: Story<TabDemoProps>;
9
8
  export declare const TabsCountDemo: Story<TabDemoProps>;
10
- interface ConfigurableTabsProps {
11
- foreground?: string;
12
- type?: TabsProps['type'];
13
- }
14
- export declare const ConfigurableTabs: Story<ConfigurableTabsProps>;
15
9
  //# sourceMappingURL=Tabs.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAuC,SAAS,EAAE,MAAM,yBAAyB,CAAC;;AAEzF,wBAUU;AAEV,UAAU,YAAY;IACpB,IAAI,EAAE,YAAY,GAAG,UAAU,CAAC;CACjC;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,YAAY,CA6BxC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,YAAY,CA6B7C,CAAC;AAEF,UAAU,qBAAqB;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;CAC1B;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,qBAAqB,CAuCzD,CAAC"}
1
+ {"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAK/C,wBASU;AAEV,UAAU,YAAY;IACpB,IAAI,EAAE,YAAY,GAAG,UAAU,CAAC;CACjC;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,YAAY,CA6BxC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,YAAY,CA6B7C,CAAC"}
@@ -1,9 +1,8 @@
1
1
  import { useState } from 'react';
2
- import { Configuration, Flex, TabPanel, Tabs } from '@pega/cosmos-react-core';
2
+ import { Flex, TabPanel, Tabs } from '@pega/cosmos-react-core';
3
3
  export default {
4
4
  title: 'Core/Tabs',
5
5
  component: Tabs,
6
- excludeStories: ['ConfigurableTabs'],
7
6
  args: {
8
7
  type: 'horizontal'
9
8
  },
@@ -57,42 +56,4 @@ export const TabsCountDemo = (args) => {
57
56
  </Flex>
58
57
  </Flex>);
59
58
  };
60
- export const ConfigurableTabs = (args) => {
61
- const [panelShown, changePanel] = useState('1');
62
- const handleTabChange = (id) => {
63
- changePanel(id);
64
- };
65
- const tabs = [
66
- { name: 'Tab 1', id: '1' },
67
- { name: 'Tab 2', id: '2' },
68
- { name: 'Tab 3', id: '3' },
69
- { name: 'Tab 4', id: '4', disabled: true },
70
- { name: 'Tab 5', id: '5' }
71
- ];
72
- return (<Configuration theme={{
73
- components: {
74
- tabs: {
75
- base: {
76
- foreground: args.foreground
77
- }
78
- }
79
- }
80
- }}>
81
- <Flex item={{ grow: 1 }}>
82
- <Tabs tabs={tabs} onTabClick={handleTabChange} currentTabId={panelShown}/>
83
- </Flex>
84
- <Flex container={{ pad: [1, 2] }} item={{ grow: 1 }}>
85
- {tabs.map(tab => (<TabPanel tabId={tab.id} currentTabId={panelShown} key={tab.id}>
86
- <div>{tab.name} content</div>
87
- </TabPanel>))}
88
- </Flex>
89
- </Configuration>);
90
- };
91
- ConfigurableTabs.args = {
92
- foreground: '#076bc9'
93
- };
94
- ConfigurableTabs.argTypes = {
95
- foreground: { control: { type: 'color' } },
96
- type: { table: { disable: true } }
97
- };
98
59
  //# sourceMappingURL=Tabs.stories.jsx.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.stories.jsx","sourceRoot":"","sources":["../../../src/core/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Configuration, Flex, TabPanel, Tabs, TabsProps } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/Tabs',\n component: Tabs,\n excludeStories: ['ConfigurableTabs'],\n args: {\n type: 'horizontal'\n },\n argTypes: {\n type: { options: ['horizontal', 'vertical'], control: { type: 'select' } }\n }\n} as Meta;\n\ninterface TabDemoProps {\n type: 'horizontal' | 'vertical';\n}\n\nexport const TabsDemo: Story<TabDemoProps> = (args: TabDemoProps) => {\n const [panelShown, changePanel] = useState('1');\n\n const handleTabChange = (id: string) => {\n changePanel(id);\n };\n\n const tabs = [\n { name: 'Tab 1', id: '1' },\n { name: 'Tab 2', id: '2' },\n { name: 'Tab 3', id: '3' },\n { name: 'Tab 4', id: '4', disabled: true },\n { name: 'Tab 5', id: '5' }\n ];\n\n return (\n <Flex container={{ direction: args.type === 'horizontal' ? 'column' : 'row' }}>\n <Flex item={{ grow: 1 }}>\n <Tabs tabs={tabs} type={args.type} onTabClick={handleTabChange} currentTabId={panelShown} />\n </Flex>\n <Flex container={{ pad: [1, 2] }} item={{ grow: 1 }}>\n {tabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panelShown} key={tab.id}>\n <div>{tab.name}</div>\n </TabPanel>\n ))}\n </Flex>\n </Flex>\n );\n};\n\nexport const TabsCountDemo: Story<TabDemoProps> = (args: TabDemoProps) => {\n const [panelShown, changePanel] = useState('1');\n\n const handleTabChange = (id: string) => {\n changePanel(id);\n };\n\n const tabs = [\n { name: 'Tab 1', id: '1', count: 5 },\n { name: 'Tab 2', id: '2', count: 14 },\n { name: 'Tab 3', id: '3', count: 0 },\n { name: 'Tab 4', id: '4', count: 56, disabled: true },\n { name: 'Tab 5', id: '5', count: 150 }\n ];\n\n return (\n <Flex container={{ direction: args.type === 'horizontal' ? 'column' : 'row' }}>\n <Flex item={{ grow: 1 }}>\n <Tabs tabs={tabs} type={args.type} onTabClick={handleTabChange} currentTabId={panelShown} />\n </Flex>\n <Flex container={{ pad: [1, 2] }} item={{ grow: 1 }}>\n {tabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panelShown} key={tab.id}>\n <div>{tab.name} content</div>\n </TabPanel>\n ))}\n </Flex>\n </Flex>\n );\n};\n\ninterface ConfigurableTabsProps {\n foreground?: string;\n type?: TabsProps['type'];\n}\n\nexport const ConfigurableTabs: Story<ConfigurableTabsProps> = (args: ConfigurableTabsProps) => {\n const [panelShown, changePanel] = useState('1');\n\n const handleTabChange = (id: string) => {\n changePanel(id);\n };\n\n const tabs = [\n { name: 'Tab 1', id: '1' },\n { name: 'Tab 2', id: '2' },\n { name: 'Tab 3', id: '3' },\n { name: 'Tab 4', id: '4', disabled: true },\n { name: 'Tab 5', id: '5' }\n ];\n\n return (\n <Configuration\n theme={{\n components: {\n tabs: {\n base: {\n foreground: args.foreground\n }\n }\n }\n }}\n >\n <Flex item={{ grow: 1 }}>\n <Tabs tabs={tabs} onTabClick={handleTabChange} currentTabId={panelShown} />\n </Flex>\n <Flex container={{ pad: [1, 2] }} item={{ grow: 1 }}>\n {tabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panelShown} key={tab.id}>\n <div>{tab.name} content</div>\n </TabPanel>\n ))}\n </Flex>\n </Configuration>\n );\n};\n\nConfigurableTabs.args = {\n foreground: '#076bc9'\n};\n\nConfigurableTabs.argTypes = {\n foreground: { control: { type: 'color' } },\n type: { table: { disable: true } }\n};\n"]}
1
+ {"version":3,"file":"Tabs.stories.jsx","sourceRoot":"","sources":["../../../src/core/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Flex, TabPanel, Tabs } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/Tabs',\n component: Tabs,\n args: {\n type: 'horizontal'\n },\n argTypes: {\n type: { options: ['horizontal', 'vertical'], control: { type: 'select' } }\n }\n} as Meta;\n\ninterface TabDemoProps {\n type: 'horizontal' | 'vertical';\n}\n\nexport const TabsDemo: Story<TabDemoProps> = (args: TabDemoProps) => {\n const [panelShown, changePanel] = useState('1');\n\n const handleTabChange = (id: string) => {\n changePanel(id);\n };\n\n const tabs = [\n { name: 'Tab 1', id: '1' },\n { name: 'Tab 2', id: '2' },\n { name: 'Tab 3', id: '3' },\n { name: 'Tab 4', id: '4', disabled: true },\n { name: 'Tab 5', id: '5' }\n ];\n\n return (\n <Flex container={{ direction: args.type === 'horizontal' ? 'column' : 'row' }}>\n <Flex item={{ grow: 1 }}>\n <Tabs tabs={tabs} type={args.type} onTabClick={handleTabChange} currentTabId={panelShown} />\n </Flex>\n <Flex container={{ pad: [1, 2] }} item={{ grow: 1 }}>\n {tabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panelShown} key={tab.id}>\n <div>{tab.name}</div>\n </TabPanel>\n ))}\n </Flex>\n </Flex>\n );\n};\n\nexport const TabsCountDemo: Story<TabDemoProps> = (args: TabDemoProps) => {\n const [panelShown, changePanel] = useState('1');\n\n const handleTabChange = (id: string) => {\n changePanel(id);\n };\n\n const tabs = [\n { name: 'Tab 1', id: '1', count: 5 },\n { name: 'Tab 2', id: '2', count: 14 },\n { name: 'Tab 3', id: '3', count: 0 },\n { name: 'Tab 4', id: '4', count: 56, disabled: true },\n { name: 'Tab 5', id: '5', count: 150 }\n ];\n\n return (\n <Flex container={{ direction: args.type === 'horizontal' ? 'column' : 'row' }}>\n <Flex item={{ grow: 1 }}>\n <Tabs tabs={tabs} type={args.type} onTabClick={handleTabChange} currentTabId={panelShown} />\n </Flex>\n <Flex container={{ pad: [1, 2] }} item={{ grow: 1 }}>\n {tabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panelShown} key={tab.id}>\n <div>{tab.name} content</div>\n </TabPanel>\n ))}\n </Flex>\n </Flex>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"CallControlPanel.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAOL,4BAA4B,EAC5B,qBAAqB,EACtB,MAAM,uBAAuB,CAAC;;AAW/B,wBAaU;AAEV,UAAU,0BAA0B;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,4BAA4B,CAAC,IAAI,CAAC,CAAC;IAC5C,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,4BAA4B,KAAK,IAAI,CAAC;IACnE,OAAO,CAAC,EAAE,qBAAqB,CAAC,SAAS,CAAC,CAAC;CAC5C;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,0BAA0B,CAiRlE,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,0BAA0B,GAAG;IAAE,eAAe,EAAE,OAAO,CAAA;CAAE,CAuE5F,CAAC"}
1
+ {"version":3,"file":"CallControlPanel.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAOL,4BAA4B,EAC5B,qBAAqB,EACtB,MAAM,uBAAuB,CAAC;;AAW/B,wBAaU;AAEV,UAAU,0BAA0B;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,4BAA4B,CAAC,IAAI,CAAC,CAAC;IAC5C,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,4BAA4B,KAAK,IAAI,CAAC;IACnE,OAAO,CAAC,EAAE,qBAAqB,CAAC,SAAS,CAAC,CAAC;CAC5C;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,0BAA0B,CAkRlE,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,0BAA0B,GAAG;IAAE,eAAe,EAAE,OAAO,CAAA;CAAE,CAuE5F,CAAC"}
@@ -229,6 +229,7 @@ export const CallControlPanelDemo = (args) => {
229
229
  onConsultAction,
230
230
  onConferenceAction,
231
231
  transferOptions: transferReasons,
232
+ defaultTransfer: transferReasons[1].id,
232
233
  interactionOptions,
233
234
  onTransferAction: (id, data) => {
234
235
  action('onTransferAction')(id, data);
@@ -1 +1 @@
1
- {"version":3,"file":"CallControlPanel.stories.jsx","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\nimport { useEffect, useRef, useState } from 'react';\nimport { Meta, Story } from '@storybook/react';\nimport { lighten, readableColor } from 'polished';\n\nimport { createUID, tryCatch, useTheme } from '@pega/cosmos-react-core';\nimport {\n CallControlPanel,\n ExternalCTI,\n CallProps,\n IncomingCallProps,\n CallParticipant,\n TransferData,\n UserAvailabilityStatusOption,\n CallControlPanelProps\n} from '@pega/cosmos-react-cs';\n\nimport {\n contactsList,\n createExternalIframeContent,\n ExternalStyles,\n interactionOptions,\n transferReasons,\n userStatusOptions\n} from './CallControlPanel.mocks';\n\nexport default {\n title: 'Customer Service/CallControlPanel',\n component: CallControlPanel,\n args: {\n heading: 'Agent',\n isDraggable: true,\n showStatus: true\n },\n argTypes: {\n heading: { control: { type: 'text' } },\n isDraggable: { control: { type: 'boolean' } },\n showStatus: { control: { type: 'boolean' } }\n }\n} as Meta;\n\ninterface CallControlPanelStoryProps {\n heading: string;\n isDraggable?: boolean;\n showStatus: boolean;\n status?: UserAvailabilityStatusOption['id'];\n onStatusChange?: (newStatus: UserAvailabilityStatusOption) => void;\n visible?: CallControlPanelProps['visible'];\n}\n\nexport const CallControlPanelDemo: Story<CallControlPanelStoryProps> = (\n args: CallControlPanelStoryProps\n) => {\n const [currentStatus, setCurrentStatus] = useState<UserAvailabilityStatusOption['id']>(\n args.status || 'available'\n );\n const inStatusSince = useRef(Date.now());\n const [calls, setCalls] = useState<(CallProps | IncomingCallProps)[]>([]);\n\n const [contacts, setContacts] = useState(contactsList);\n const callsList = useRef(calls);\n callsList.current = calls;\n\n const [showInteractionTransfer, setShowInteractionTransfer] = useState(false);\n\n const onMuteToggle = (id: CallProps['id']) => {\n const thisCallIndex = callsList.current.findIndex(call => call.id === id);\n if (thisCallIndex < 0) return;\n const thisCall = callsList.current[thisCallIndex];\n callsList.current.splice(thisCallIndex, 1, {\n ...thisCall,\n muted: !(thisCall as CallProps).muted\n });\n setCalls([...callsList.current]);\n };\n\n const onMergeCall = (id: CallProps['id']) => {\n const thisCall = callsList.current.find(call => call.id === id) as CallProps;\n const activeCallIndex = callsList.current.findIndex(call => !(call as CallProps).onHoldSince);\n const currentCall = callsList.current[activeCallIndex] as CallProps;\n\n if (!thisCall || !activeCallIndex) return;\n callsList.current.splice(activeCallIndex, 1, {\n ...currentCall,\n participants: [...currentCall.participants, ...thisCall.participants],\n onHoldSince: undefined\n });\n setCalls([...callsList.current.filter(call => call.id !== id)]);\n };\n\n const onHandOffCall = (id: CallProps['id']) => {\n setCalls([\n ...callsList.current.filter(call => call.id !== id && (call as CallProps).onHoldSince)\n ]);\n };\n\n const onPauseToggle = (id: CallProps['id']) => {\n const thisCall = callsList.current.find(call => call.id === id);\n if (!thisCall) return;\n const wasPaused = !!(thisCall as CallProps).onHoldSince;\n callsList.current = callsList.current.map(call => {\n if (thisCall.id === call.id)\n return {\n ...call,\n onHoldSince: wasPaused ? undefined : Date.now(),\n onMergeCall: wasPaused ? onMergeCall : undefined,\n onHandOffCall: wasPaused ? onHandOffCall : undefined\n };\n return {\n ...call,\n onPauseToggle: wasPaused ? undefined : onPauseToggle,\n onMergeCall: wasPaused ? onMergeCall : undefined,\n onHandOffCall: wasPaused ? onHandOffCall : undefined\n };\n });\n setCalls([...callsList.current]);\n };\n\n const onEndCall = (id: CallProps['id']) => {\n setCalls(callsList.current.filter(item => item.id !== id));\n setCurrentStatus('available');\n };\n\n const onHangUp = (callId: CallProps['id'], participantId: CallParticipant['id']) => {\n const currentCallIndex = callsList.current.findIndex(call => call.id === callId);\n if (currentCallIndex < 0) return;\n const currentCall = callsList.current[currentCallIndex] as CallProps;\n callsList.current.splice(currentCallIndex, 1, {\n ...currentCall,\n participants: [\n ...currentCall.participants.filter(participant => participant.id !== participantId)\n ]\n });\n setCalls([...callsList.current]);\n };\n\n const onConferenceAction = (id: CallProps['id'], data: TransferData) => {\n const caller = contactsList.find(person => person.phoneNumber === data.phoneNumber);\n const conferenceCall: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n onMergeCall,\n transferOptions: transferReasons,\n interactionOptions,\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onHandOffCall,\n onEndCall,\n participants: [\n {\n name: caller?.primary || '',\n info: caller?.secondary || '',\n id: caller?.primary || '',\n onHangUp\n }\n ]\n };\n\n const currentCall = callsList.current[0] as CallProps;\n callsList.current.splice(0, 1, {\n ...callsList.current[0],\n participants: [...currentCall.participants, ...conferenceCall.participants],\n onHoldSince: undefined\n });\n setCalls([...callsList.current.filter(call => call.id !== conferenceCall.id)]);\n };\n\n const onConsultAction = (id: CallProps['id'], data: TransferData) => {\n const caller = contactsList.find(person => person.phoneNumber === data.phoneNumber);\n const consultCall: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n transferOptions: transferReasons,\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onMergeCall,\n onHandOffCall,\n onDTMFPress: action('onDTMFPress'),\n onTransferAction: (callId, transferData) => {\n action('onTransferAction')(callId, transferData);\n if (transferData.interaction) setShowInteractionTransfer(true);\n onEndCall(id);\n },\n onConsultAction,\n onConferenceAction,\n onEndCall,\n participants: [\n {\n name: caller?.primary || '',\n info: caller?.secondary || '',\n id: caller?.primary || '',\n onHangUp\n }\n ]\n };\n\n const updatedCalls: (CallProps | IncomingCallProps)[] = callsList.current.map(call => {\n return { ...call, onHoldSince: Date.now(), onMergeCall, onPauseToggle: undefined };\n });\n updatedCalls.push(consultCall);\n setCalls(updatedCalls);\n };\n\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n const caller = contactsList[0];\n const consultCall: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n transferOptions: transferReasons,\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onMergeCall,\n onHandOffCall,\n onDTMFPress: action('onDTMFPress'),\n onTransferAction: (callId, transferData) => {\n action('onTransferAction')(callId, transferData);\n if (transferData.interaction) setShowInteractionTransfer(true);\n onEndCall(callId);\n },\n onConsultAction,\n onConferenceAction,\n onEndCall,\n participants: [\n {\n name: caller?.primary || '',\n info: caller?.secondary || '',\n id: caller?.primary || '',\n onHangUp\n }\n ]\n };\n\n const incomingCall: IncomingCallProps = {\n id: createUID(),\n onAcceptCall: () => {\n setCalls([consultCall]);\n },\n participant: {\n name: contactsList[0].primary,\n info: contactsList[0].secondary,\n id: contactsList[0].primary\n }\n };\n setCalls([incomingCall, ...callsList.current]);\n }, 4000);\n return () => clearTimeout(timeoutId);\n }, []);\n\n return (\n <CallControlPanel\n visible={args.visible ?? true}\n heading={args.heading}\n userStatus={\n args.showStatus\n ? {\n statusOptions: userStatusOptions,\n status: currentStatus,\n inStatusSince: inStatusSince.current,\n onChange: value => {\n setCurrentStatus(value);\n args.onStatusChange?.(\n userStatusOptions.find(s => s.id === value) ?? userStatusOptions[0]\n );\n }\n }\n : undefined\n }\n interactionTransfer={\n showInteractionTransfer\n ? {\n onCancel: () => setShowInteractionTransfer(false),\n onComplete: () => setShowInteractionTransfer(false)\n }\n : undefined\n }\n calls={calls}\n draggable={args.isDraggable}\n onAddCall={(phoneNumber: string) => {\n const call: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n slaConfig: [30, 50],\n onConsultAction,\n onConferenceAction,\n transferOptions: transferReasons,\n interactionOptions,\n onTransferAction: (id, data) => {\n action('onTransferAction')(id, data);\n if (data.interaction) setShowInteractionTransfer(true);\n onEndCall(id);\n },\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onMergeCall,\n onDTMFPress: action('onDTMFPress'),\n onEndCall: () => onEndCall(call.id),\n participants: [\n {\n id: contactsList.find(person => person.phoneNumber === phoneNumber)?.primary || '',\n name:\n contactsList.find(person => person.phoneNumber === phoneNumber)?.primary ||\n 'Unknown',\n onHangUp\n }\n ]\n };\n\n setCalls([call]);\n setCurrentStatus('not_available');\n }}\n contactsList={contacts}\n onFavoriteToggle={(phoneNumber: string, favorite: boolean) => {\n const element = contacts.find(item => item.phoneNumber === phoneNumber);\n element!.favorite = !favorite;\n setContacts([...contacts]);\n }}\n />\n );\n};\n\nexport const ExternalCTIDemo: Story<CallControlPanelStoryProps & { applyAppStyling: boolean }> = (\n args: CallControlPanelStoryProps & { applyAppStyling: boolean }\n) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [error, setError] = useState('');\n\n const { base, components } = useTheme();\n\n const styling: ExternalStyles | undefined = args.applyAppStyling\n ? {\n '--app-bg-color': base.palette['app-background'],\n '--header-border-color': base.palette['secondary-background'],\n '--text-color': base.palette['foreground-color'],\n '--msg-me-bg-color': base.palette.interactive,\n '--msg-me-text-color': tryCatch(() => readableColor(base.palette.interactive)),\n '--msg-you-bg-color': base.palette['primary-background'],\n '--msg-you-text-color': tryCatch(() => readableColor(base.palette['primary-background'])),\n '--msg-border-radius': '16px',\n '--button-text-color': tryCatch(() => readableColor(components.button.color)),\n '--button-bg-color': components.button.color,\n '--button-border-color': 'transparent',\n '--button-border-radius': `calc(${components.button['border-radius']} * ${base['border-radius']})`,\n '--button-hover-bg-color': tryCatch(() => lighten(0.1, components.button.color)),\n '--button-height': components.input.height,\n '--input-height': components.input.height,\n '--input-background-color': components.input['background-color'],\n '--input-text-color': base.palette['foreground-color'],\n '--input-border-radius': `calc(0.5 * ${base['border-radius']})`,\n '--input-focus-border-color': 'transparent',\n '--input-focus-box-shadow': components.button['focus-shadow'],\n '--footer-bg-color': base.palette['app-background']\n }\n : undefined;\n\n useEffect(() => {\n if (containerRef.current) {\n containerRef.current.innerHTML = `\n <iframe id='external-cti' srcdoc='${createExternalIframeContent(\n styling\n )}' width='100%' height='500px'></iframe>\n `;\n }\n }, [containerRef.current, styling]);\n\n return (\n <ExternalCTI\n heading={args.heading}\n draggable={args.isDraggable}\n visible={args.visible}\n ref={containerRef}\n attachInteractionProps={{\n onAddInteraction: ({ comments }, { close }) => {\n if (comments === 'error') {\n setError('The service is currently unavailable');\n } else {\n close();\n }\n },\n reasonOptions: transferReasons,\n defaultInteraction: interactionOptions.find(({ id }) => id === '23254324')?.id,\n interactionOptions,\n heading: 'Attach interaction to call',\n ...(error && {\n message: {\n variant: 'urgent',\n messages: [error]\n }\n })\n }}\n />\n );\n};\n\nExternalCTIDemo.args = {\n heading: 'External CTI',\n isDraggable: true,\n applyAppStyling: false\n};\n\nExternalCTIDemo.argTypes = {\n heading: { control: { type: 'text' } },\n isDraggable: { control: { type: 'boolean' } },\n applyAppStyling: { control: { type: 'boolean' } }\n};\n"]}
1
+ {"version":3,"file":"CallControlPanel.stories.jsx","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\nimport { useEffect, useRef, useState } from 'react';\nimport { Meta, Story } from '@storybook/react';\nimport { lighten, readableColor } from 'polished';\n\nimport { createUID, tryCatch, useTheme } from '@pega/cosmos-react-core';\nimport {\n CallControlPanel,\n ExternalCTI,\n CallProps,\n IncomingCallProps,\n CallParticipant,\n TransferData,\n UserAvailabilityStatusOption,\n CallControlPanelProps\n} from '@pega/cosmos-react-cs';\n\nimport {\n contactsList,\n createExternalIframeContent,\n ExternalStyles,\n interactionOptions,\n transferReasons,\n userStatusOptions\n} from './CallControlPanel.mocks';\n\nexport default {\n title: 'Customer Service/CallControlPanel',\n component: CallControlPanel,\n args: {\n heading: 'Agent',\n isDraggable: true,\n showStatus: true\n },\n argTypes: {\n heading: { control: { type: 'text' } },\n isDraggable: { control: { type: 'boolean' } },\n showStatus: { control: { type: 'boolean' } }\n }\n} as Meta;\n\ninterface CallControlPanelStoryProps {\n heading: string;\n isDraggable?: boolean;\n showStatus: boolean;\n status?: UserAvailabilityStatusOption['id'];\n onStatusChange?: (newStatus: UserAvailabilityStatusOption) => void;\n visible?: CallControlPanelProps['visible'];\n}\n\nexport const CallControlPanelDemo: Story<CallControlPanelStoryProps> = (\n args: CallControlPanelStoryProps\n) => {\n const [currentStatus, setCurrentStatus] = useState<UserAvailabilityStatusOption['id']>(\n args.status || 'available'\n );\n const inStatusSince = useRef(Date.now());\n const [calls, setCalls] = useState<(CallProps | IncomingCallProps)[]>([]);\n\n const [contacts, setContacts] = useState(contactsList);\n const callsList = useRef(calls);\n callsList.current = calls;\n\n const [showInteractionTransfer, setShowInteractionTransfer] = useState(false);\n\n const onMuteToggle = (id: CallProps['id']) => {\n const thisCallIndex = callsList.current.findIndex(call => call.id === id);\n if (thisCallIndex < 0) return;\n const thisCall = callsList.current[thisCallIndex];\n callsList.current.splice(thisCallIndex, 1, {\n ...thisCall,\n muted: !(thisCall as CallProps).muted\n });\n setCalls([...callsList.current]);\n };\n\n const onMergeCall = (id: CallProps['id']) => {\n const thisCall = callsList.current.find(call => call.id === id) as CallProps;\n const activeCallIndex = callsList.current.findIndex(call => !(call as CallProps).onHoldSince);\n const currentCall = callsList.current[activeCallIndex] as CallProps;\n\n if (!thisCall || !activeCallIndex) return;\n callsList.current.splice(activeCallIndex, 1, {\n ...currentCall,\n participants: [...currentCall.participants, ...thisCall.participants],\n onHoldSince: undefined\n });\n setCalls([...callsList.current.filter(call => call.id !== id)]);\n };\n\n const onHandOffCall = (id: CallProps['id']) => {\n setCalls([\n ...callsList.current.filter(call => call.id !== id && (call as CallProps).onHoldSince)\n ]);\n };\n\n const onPauseToggle = (id: CallProps['id']) => {\n const thisCall = callsList.current.find(call => call.id === id);\n if (!thisCall) return;\n const wasPaused = !!(thisCall as CallProps).onHoldSince;\n callsList.current = callsList.current.map(call => {\n if (thisCall.id === call.id)\n return {\n ...call,\n onHoldSince: wasPaused ? undefined : Date.now(),\n onMergeCall: wasPaused ? onMergeCall : undefined,\n onHandOffCall: wasPaused ? onHandOffCall : undefined\n };\n return {\n ...call,\n onPauseToggle: wasPaused ? undefined : onPauseToggle,\n onMergeCall: wasPaused ? onMergeCall : undefined,\n onHandOffCall: wasPaused ? onHandOffCall : undefined\n };\n });\n setCalls([...callsList.current]);\n };\n\n const onEndCall = (id: CallProps['id']) => {\n setCalls(callsList.current.filter(item => item.id !== id));\n setCurrentStatus('available');\n };\n\n const onHangUp = (callId: CallProps['id'], participantId: CallParticipant['id']) => {\n const currentCallIndex = callsList.current.findIndex(call => call.id === callId);\n if (currentCallIndex < 0) return;\n const currentCall = callsList.current[currentCallIndex] as CallProps;\n callsList.current.splice(currentCallIndex, 1, {\n ...currentCall,\n participants: [\n ...currentCall.participants.filter(participant => participant.id !== participantId)\n ]\n });\n setCalls([...callsList.current]);\n };\n\n const onConferenceAction = (id: CallProps['id'], data: TransferData) => {\n const caller = contactsList.find(person => person.phoneNumber === data.phoneNumber);\n const conferenceCall: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n onMergeCall,\n transferOptions: transferReasons,\n interactionOptions,\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onHandOffCall,\n onEndCall,\n participants: [\n {\n name: caller?.primary || '',\n info: caller?.secondary || '',\n id: caller?.primary || '',\n onHangUp\n }\n ]\n };\n\n const currentCall = callsList.current[0] as CallProps;\n callsList.current.splice(0, 1, {\n ...callsList.current[0],\n participants: [...currentCall.participants, ...conferenceCall.participants],\n onHoldSince: undefined\n });\n setCalls([...callsList.current.filter(call => call.id !== conferenceCall.id)]);\n };\n\n const onConsultAction = (id: CallProps['id'], data: TransferData) => {\n const caller = contactsList.find(person => person.phoneNumber === data.phoneNumber);\n const consultCall: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n transferOptions: transferReasons,\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onMergeCall,\n onHandOffCall,\n onDTMFPress: action('onDTMFPress'),\n onTransferAction: (callId, transferData) => {\n action('onTransferAction')(callId, transferData);\n if (transferData.interaction) setShowInteractionTransfer(true);\n onEndCall(id);\n },\n onConsultAction,\n onConferenceAction,\n onEndCall,\n participants: [\n {\n name: caller?.primary || '',\n info: caller?.secondary || '',\n id: caller?.primary || '',\n onHangUp\n }\n ]\n };\n\n const updatedCalls: (CallProps | IncomingCallProps)[] = callsList.current.map(call => {\n return { ...call, onHoldSince: Date.now(), onMergeCall, onPauseToggle: undefined };\n });\n updatedCalls.push(consultCall);\n setCalls(updatedCalls);\n };\n\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n const caller = contactsList[0];\n const consultCall: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n transferOptions: transferReasons,\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onMergeCall,\n onHandOffCall,\n onDTMFPress: action('onDTMFPress'),\n onTransferAction: (callId, transferData) => {\n action('onTransferAction')(callId, transferData);\n if (transferData.interaction) setShowInteractionTransfer(true);\n onEndCall(callId);\n },\n onConsultAction,\n onConferenceAction,\n onEndCall,\n participants: [\n {\n name: caller?.primary || '',\n info: caller?.secondary || '',\n id: caller?.primary || '',\n onHangUp\n }\n ]\n };\n\n const incomingCall: IncomingCallProps = {\n id: createUID(),\n onAcceptCall: () => {\n setCalls([consultCall]);\n },\n participant: {\n name: contactsList[0].primary,\n info: contactsList[0].secondary,\n id: contactsList[0].primary\n }\n };\n setCalls([incomingCall, ...callsList.current]);\n }, 4000);\n return () => clearTimeout(timeoutId);\n }, []);\n\n return (\n <CallControlPanel\n visible={args.visible ?? true}\n heading={args.heading}\n userStatus={\n args.showStatus\n ? {\n statusOptions: userStatusOptions,\n status: currentStatus,\n inStatusSince: inStatusSince.current,\n onChange: value => {\n setCurrentStatus(value);\n args.onStatusChange?.(\n userStatusOptions.find(s => s.id === value) ?? userStatusOptions[0]\n );\n }\n }\n : undefined\n }\n interactionTransfer={\n showInteractionTransfer\n ? {\n onCancel: () => setShowInteractionTransfer(false),\n onComplete: () => setShowInteractionTransfer(false)\n }\n : undefined\n }\n calls={calls}\n draggable={args.isDraggable}\n onAddCall={(phoneNumber: string) => {\n const call: CallProps = {\n id: createUID(),\n startedAt: Date.now(),\n slaConfig: [30, 50],\n onConsultAction,\n onConferenceAction,\n transferOptions: transferReasons,\n defaultTransfer: transferReasons[1].id,\n interactionOptions,\n onTransferAction: (id, data) => {\n action('onTransferAction')(id, data);\n if (data.interaction) setShowInteractionTransfer(true);\n onEndCall(id);\n },\n muted: false,\n onMuteToggle,\n onPauseToggle,\n onMergeCall,\n onDTMFPress: action('onDTMFPress'),\n onEndCall: () => onEndCall(call.id),\n participants: [\n {\n id: contactsList.find(person => person.phoneNumber === phoneNumber)?.primary || '',\n name:\n contactsList.find(person => person.phoneNumber === phoneNumber)?.primary ||\n 'Unknown',\n onHangUp\n }\n ]\n };\n\n setCalls([call]);\n setCurrentStatus('not_available');\n }}\n contactsList={contacts}\n onFavoriteToggle={(phoneNumber: string, favorite: boolean) => {\n const element = contacts.find(item => item.phoneNumber === phoneNumber);\n element!.favorite = !favorite;\n setContacts([...contacts]);\n }}\n />\n );\n};\n\nexport const ExternalCTIDemo: Story<CallControlPanelStoryProps & { applyAppStyling: boolean }> = (\n args: CallControlPanelStoryProps & { applyAppStyling: boolean }\n) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [error, setError] = useState('');\n\n const { base, components } = useTheme();\n\n const styling: ExternalStyles | undefined = args.applyAppStyling\n ? {\n '--app-bg-color': base.palette['app-background'],\n '--header-border-color': base.palette['secondary-background'],\n '--text-color': base.palette['foreground-color'],\n '--msg-me-bg-color': base.palette.interactive,\n '--msg-me-text-color': tryCatch(() => readableColor(base.palette.interactive)),\n '--msg-you-bg-color': base.palette['primary-background'],\n '--msg-you-text-color': tryCatch(() => readableColor(base.palette['primary-background'])),\n '--msg-border-radius': '16px',\n '--button-text-color': tryCatch(() => readableColor(components.button.color)),\n '--button-bg-color': components.button.color,\n '--button-border-color': 'transparent',\n '--button-border-radius': `calc(${components.button['border-radius']} * ${base['border-radius']})`,\n '--button-hover-bg-color': tryCatch(() => lighten(0.1, components.button.color)),\n '--button-height': components.input.height,\n '--input-height': components.input.height,\n '--input-background-color': components.input['background-color'],\n '--input-text-color': base.palette['foreground-color'],\n '--input-border-radius': `calc(0.5 * ${base['border-radius']})`,\n '--input-focus-border-color': 'transparent',\n '--input-focus-box-shadow': components.button['focus-shadow'],\n '--footer-bg-color': base.palette['app-background']\n }\n : undefined;\n\n useEffect(() => {\n if (containerRef.current) {\n containerRef.current.innerHTML = `\n <iframe id='external-cti' srcdoc='${createExternalIframeContent(\n styling\n )}' width='100%' height='500px'></iframe>\n `;\n }\n }, [containerRef.current, styling]);\n\n return (\n <ExternalCTI\n heading={args.heading}\n draggable={args.isDraggable}\n visible={args.visible}\n ref={containerRef}\n attachInteractionProps={{\n onAddInteraction: ({ comments }, { close }) => {\n if (comments === 'error') {\n setError('The service is currently unavailable');\n } else {\n close();\n }\n },\n reasonOptions: transferReasons,\n defaultInteraction: interactionOptions.find(({ id }) => id === '23254324')?.id,\n interactionOptions,\n heading: 'Attach interaction to call',\n ...(error && {\n message: {\n variant: 'urgent',\n messages: [error]\n }\n })\n }}\n />\n );\n};\n\nExternalCTIDemo.args = {\n heading: 'External CTI',\n isDraggable: true,\n applyAppStyling: false\n};\n\nExternalCTIDemo.argTypes = {\n heading: { control: { type: 'text' } },\n isDraggable: { control: { type: 'boolean' } },\n applyAppStyling: { control: { type: 'boolean' } }\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"CaseView.mocks.d.ts","sourceRoot":"","sources":["../../../src/work/CaseView/CaseView.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAgC,MAAM,OAAO,CAAC;AAG/E,OAAO,EAQL,gBAAgB,EAWjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,wDAAwD,CAAC;AAClF,OAAO,EAAW,aAAa,EAAyB,MAAM,yBAAyB,CAAC;AACxF,OAAO,EAAE,QAAQ,EAAkB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,oDAAoD,CAAC;AAa/E,UAAU,cAAc;IACtB,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC;IAC1D,sBAAsB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CAC1D;AAMD,eAAO,MAAM,SAAS,UAAmC,CAAC;AAE1D,eAAO,MAAM,YAAY,OAKvB,CAAC;AAIH,eAAO,MAAM,2BAA2B,oBAAqB,GAAG,gBAwC/D,CAAC;AAEF,eAAO,MAAM,eAAe;;;iBAqD3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,mBA8ElC,CAAC;AAEF,eAAO,MAAM,oBAAoB,mEAI9B;IAAE,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;CAAE,GAAG,cAAc,gBAa9C,CAAC;AAEF,eAAO,MAAM,mBAAmB,iDAG7B,cAAc,KAAG,SAAS,CAAC,aAAa,CAc1C,CAAC;AAEF,eAAO,MAAM,gBAAgB;QAMvB,MAAM;UACJ,MAAM;2BAMb,CAAC;AAEF,eAAO,MAAM,aAAa,iDAAkD,cAAc;;;GA0BzF,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;GAiB7B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;GAmB5B,CAAC;AAuBF,eAAO,MAAM,kBAAkB,iDAG5B,cAAc,4FAuBhB,CAAC;AAEF,eAAO,MAAM,wBAAwB;;;GASpC,CAAC;AAEF,eAAO,MAAM,0BAA0B,yFAAsB,CAAC;AAE9D,eAAO,MAAM,cAAc;YAKjB,aAAa,CAAC,QAAQ,CAAC;;;;;;;GAuBhC,CAAC;AAEF,eAAO,MAAM,SAAS,mBASrB,CAAC;AAEF,eAAO,MAAM,wBAAwB,QAAO,aAAa,CAAC,uBAAuB,CAOhF,CAAC;AAEF,eAAO,MAAM,cAAc;;;;GAQ1B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;GAE9B,CAAC;AASF,eAAO,MAAM,wBAAwB,mBASpC,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,aAAa,EACb,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,mBAAmB,GAAG,qBAAqB,CAC7E;IACD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,YAAY,oFAOtB,iBAAiB,gBAmHnB,CAAC"}
1
+ {"version":3,"file":"CaseView.mocks.d.ts","sourceRoot":"","sources":["../../../src/work/CaseView/CaseView.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAgC,MAAM,OAAO,CAAC;AAG/E,OAAO,EAQL,gBAAgB,EAWjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,wDAAwD,CAAC;AAClF,OAAO,EAAW,aAAa,EAAyB,MAAM,yBAAyB,CAAC;AACxF,OAAO,EAAE,QAAQ,EAAkB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,oDAAoD,CAAC;AAc/E,UAAU,cAAc;IACtB,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC;IAC1D,sBAAsB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CAC1D;AAMD,eAAO,MAAM,SAAS,UAAmC,CAAC;AAE1D,eAAO,MAAM,YAAY,OAKvB,CAAC;AAIH,eAAO,MAAM,2BAA2B,oBAAqB,GAAG,gBAwC/D,CAAC;AAEF,eAAO,MAAM,eAAe;;;iBAqD3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,mBA8ElC,CAAC;AAEF,eAAO,MAAM,oBAAoB,mEAI9B;IAAE,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;CAAE,GAAG,cAAc,gBAa9C,CAAC;AAEF,eAAO,MAAM,mBAAmB,iDAG7B,cAAc,KAAG,SAAS,CAAC,aAAa,CAc1C,CAAC;AAEF,eAAO,MAAM,gBAAgB;QAMvB,MAAM;UACJ,MAAM;2BAMb,CAAC;AAEF,eAAO,MAAM,aAAa,iDAAkD,cAAc;;;GA0BzF,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;GAiB7B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;GAmB5B,CAAC;AAuBF,eAAO,MAAM,kBAAkB,iDAG5B,cAAc,4FAuBhB,CAAC;AAEF,eAAO,MAAM,wBAAwB;;;GASpC,CAAC;AAEF,eAAO,MAAM,0BAA0B,yFAAsB,CAAC;AAE9D,eAAO,MAAM,cAAc;YAKjB,aAAa,CAAC,QAAQ,CAAC;;;;;;;GAuBhC,CAAC;AAEF,eAAO,MAAM,SAAS,mBAUrB,CAAC;AAEF,eAAO,MAAM,wBAAwB,QAAO,aAAa,CAAC,uBAAuB,CAQhF,CAAC;AAEF,eAAO,MAAM,cAAc;;;;GAQ1B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;GAE9B,CAAC;AASF,eAAO,MAAM,wBAAwB,mBASpC,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,aAAa,EACb,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,mBAAmB,GAAG,qBAAqB,CAC7E;IACD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,YAAY,oFAOtB,iBAAiB,gBAmHnB,CAAC"}
@@ -3,6 +3,7 @@ import styled, { css } from 'styled-components';
3
3
  import { Avatar, Button, Link, createStringMatcher, Modal, Popover, SummaryList, useModalManager, useElement, useOuterEvent, ViewAll, Status, createUID, Flex, useBreakpoint, Icon, Grid } from '@pega/cosmos-react-core';
4
4
  import { Glimpse, CaseView, CasePreview } from '@pega/cosmos-react-work';
5
5
  import { RichTextViewer } from '@pega/cosmos-react-rte';
6
+ import { PredictionsDemo } from '../Predictions/Predictions.stories';
6
7
  import { TableDemo } from '../../core/Table/Table.stories';
7
8
  import { useMockListData } from '../../core/SummaryList/SummaryList.mocks';
8
9
  import { StakeHoldersDemo } from '../Stakeholders/Stakeholders.stories';
@@ -284,6 +285,7 @@ export const getParentCases = ({ caseId, setPreviewCaseId, setPreviewCurrentTabI
284
285
  };
285
286
  export const Utilities = () => {
286
287
  return (<>
288
+ <PredictionsDemo />
287
289
  <AttachmentsMock />
288
290
  <StakeHoldersDemo />
289
291
  <MockSummaryList icon='user-star' name='Followers'/>
@@ -292,6 +294,7 @@ export const Utilities = () => {
292
294
  };
293
295
  export const getUtilitiesSummaryItems = () => {
294
296
  return [
297
+ { iconName: 'polaris', count: 4, name: 'Predictions' },
295
298
  { iconName: 'paper-clip', count: 4, name: 'Attachments' },
296
299
  { iconName: 'user-search-solid', count: 10, name: 'Stakeholders' },
297
300
  { iconName: 'user-star-solid', count: 5, name: 'Followers' },