npm - @pega/cosmos-react-build - Versions diffs - 9.0.0-build.6.8 → 9.0.0-build.7.0 - Mend

@pega/cosmos-react-build 9.0.0-build.6.8 → 9.0.0-build.7.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 (63) hide show

package/lib/components/ObjectSelect/useCreateModal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useCreateModal.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,aAAa,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAA4B,UAAU,EAAE,MAAM,yBAAyB,CAAC;~~AAEpF~~,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;~~IAC7D~~;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC3B,yCAAyC;IACzC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACrD,yCAAyC;IACzC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACtD,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IAC1C,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;~~CAC3C~~;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC/D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,CAAC,CAAC;CAClB;AAED,QAAA,MAAM,cAAc,GAAI,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,QAAQ,oBAAoB,CAAC,CAAC,CAAC,GAAG,SAAS;~~8CAgBjC~~,sBAAsB,CAAC,CAAC,CAAC;~~CA0ErF~~,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"useCreateModal.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,aAAa,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAA4B,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEhG,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAC7D,SAAQ,UAAU,EAChB,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,QAAQ,CAAC;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC3B,yCAAyC;IACzC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACrD,yCAAyC;IACzC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACtD,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IAC1C,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IAC1C,yCAAyC;IACzC,sBAAsB,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAC9C,yCAAyC;IACzC,sBAAsB,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;CAC/C;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC/D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,CAAC,CAAC;CAClB;AAED,QAAA,MAAM,cAAc,GAAI,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,QAAQ,oBAAoB,CAAC,CAAC,CAAC,GAAG,SAAS;8CAqBjC,sBAAsB,CAAC,CAAC,CAAC;CA+ErF,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/ObjectSelect/useCreateModal.js CHANGED Viewed

@@ -7,7 +7,7 @@ const useCreateModal = (config) => {
     const modalMethods = useRef();
     const { create: createModal } = useModalManager();
     if (config) {
-        const { renderer: Renderer, onSubmit, onDismiss, onBeforeOpen, onAfterClose, heading = t('create_new') } = config;
+        const { renderer: Renderer, autoWidth, center, testId, formActionCancelTestId, formActionSubmitTestId, onSubmit, onDismiss, onBeforeOpen, onAfterClose, heading = t('create_new') } = config;
         const renderModal = ({ rendererProps, loading = false }) => {
             const modalContent = _jsx(Renderer, { ...rendererProps });
             let formActions = null;
@@ -16,9 +16,9 @@ const useCreateModal = (config) => {
                     modalMethods.current?.dismiss();
                     modalMethods.current = undefined;
                 };
-                formActions = (_jsxs(_Fragment, { children: [_jsx(Button, { disabled: loading, onClick: () => {
+                formActions = (_jsxs(_Fragment, { children: [_jsx(Button, { "data-testid": formActionCancelTestId, disabled: loading, onClick: () => {
                                 onDismiss({ close });
-                            }, children: t('cancel') }), _jsx(Button, { disabled: loading, type: 'submit', variant: 'primary', onClick: () => {
+                            }, children: t('cancel') }), _jsx(Button, { "data-testid": formActionSubmitTestId, disabled: loading, type: 'submit', variant: 'primary', onClick: () => {
                                 submittingRef.current = true;
                                 onSubmit({ close });
                             }, children: t('submit') })] }));
@@ -37,12 +37,15 @@ const useCreateModal = (config) => {
             else {
                 modalMethods.current = createModal(Modal, {
                     ...modalProps,
+                    autoWidth,
+                    center,
                     heading,
                     onBeforeOpen,
                     onAfterClose: () => {
                         onAfterClose?.();
                         submittingRef.current = false;
-                    }
+                    },
+                    'data-testid': testId
                 }, {
                     dismissible: false
                 });

package/lib/components/ObjectSelect/useCreateModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useCreateModal.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;~~AA0BlF~~,MAAM,cAAc,GAAG,CAA4B,MAA2C,EAAE,EAAE;IAChG,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IACpC,MAAM,YAAY,GAAG,MAAM,EAAgB,CAAC;IAC5C,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,eAAe,EAAE,CAAC;IAElD,IAAI,MAAM,EAAE,CAAC;QACX,MAAM,EACJ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,OAAO,GAAG,CAAC,CAAC,YAAY,CAAC,EAC1B,GAAG,MAAM,CAAC;QACX,MAAM,WAAW,GAAG,CAAC,EAAE,aAAa,EAAE,OAAO,GAAG,KAAK,EAA6B,EAAE,EAAE;YACpF,MAAM,YAAY,GAAc,KAAC,QAAQ,OAAK,aAAa,GAAI,CAAC;YAEhE,IAAI,WAAW,GAAc,IAAI,CAAC;YAElC,IAAI,CAAC,OAAO,IAAI,aAAa,CAAC,OAAO,EAAE,CAAC;gBACtC,MAAM,KAAK,GAAG,GAAG,EAAE;oBACjB,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC;oBAChC,YAAY,CAAC,OAAO,GAAG,SAAS,CAAC;gBACnC,CAAC,CAAC;gBAEF,WAAW,GAAG,CACZ,8BACE,KAAC,MAAM,~~IACL~~,QAAQ,EAAE,OAAO,EACjB,OAAO,EAAE,GAAG,EAAE;gCACZ,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;4BACvB,CAAC,YAEA,CAAC,CAAC,QAAQ,CAAC,GACL,EACT,KAAC,MAAM,~~IACL~~,QAAQ,EAAE,OAAO,EACjB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE;gCACZ,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;gCAC7B,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;4BACtB,CAAC,YAEA,CAAC,CAAC,QAAQ,CAAC,GACL,IACR,CACJ,CAAC;YACJ,CAAC;YAED,MAAM,UAAU,GAAsC;gBACpD,QAAQ,EAAE,OAAO;oBACf,CAAC,CAAC,EAAE,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,EAAE;oBACrE,CAAC,CAAC,SAAS;gBACb,QAAQ,EAAE,YAAY;gBACtB,OAAO,EAAE,WAAW;gBACpB,gBAAgB,EAAE,OAAO,IAAI,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;aAC7E,CAAC;YAEF,IAAI,YAAY,CAAC,OAAO,EAAE,CAAC;gBACzB,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YAC1C,CAAC;iBAAM,CAAC;gBACN,YAAY,CAAC,OAAO,GAAG,WAAW,CAChC,KAAK,EACL;oBACE,GAAG,UAAU;oBACb,OAAO;oBACP,YAAY;oBACZ,YAAY,EAAE,GAAG,EAAE;wBACjB,YAAY,EAAE,EAAE,CAAC;wBACjB,aAAa,CAAC,OAAO,GAAG,KAAK,CAAC;oBAChC,CAAC;~~iBACF~~,EACD;oBACE,WAAW,EAAE,KAAK;iBACnB,CACF,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QAEF,OAAO;YACL,WAAW;SACZ,CAAC;IACJ,CAAC;IAED,OAAO;QACL,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;KACtB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { useRef } from 'react';\nimport type { ReactNode, ComponentType } from 'react';\n\nimport { Button, Modal, useModalManager, useI18n } from '@pega/cosmos-react-core';\nimport type { ModalMethods, OmitStrict, ModalProps } from '@pega/cosmos-react-core';\n\nexport interface UseCreateModalConfig<P extends object = object> {\n /*\n Heading for the Modal.\n * @default 'Create new'\n /\n heading?: string;\n /* A component to render the add new form. /\n renderer: ComponentType<P>;\n /* Called when a user submits a form. /\n onSubmit: ({ close }: { close: () => void }) => void;\n /* Called when a user cancels a form. /\n onDismiss: ({ close }: { close: () => void }) => void;\n /* Called before the modal opens. /\n onBeforeOpen?: ModalProps['onBeforeOpen'];\n /* Called after the modal closes. */\n onAfterClose?: ModalProps['onAfterClose'];\n}\n\nexport interface CreateModalActionProps<P extends object = object> {\n loading?: boolean;\n rendererProps: P;\n}\n\nconst useCreateModal = <P extends object = object>(config: UseCreateModalConfig<P> \| undefined) => {\n const t = useI18n();\n\n const submittingRef = useRef(false);\n const modalMethods = useRef<ModalMethods>();\n const { create: createModal } = useModalManager();\n\n if (config) {\n const {\n renderer: Renderer,\n onSubmit,\n onDismiss,\n onBeforeOpen,\n onAfterClose,\n heading = t('create_new')\n } = config;\n const renderModal = ({ rendererProps, loading = false }: CreateModalActionProps<P>) => {\n const modalContent: ReactNode = <Renderer {...rendererProps} />;\n\n let formActions: ReactNode = null;\n\n if (!loading \|\| submittingRef.current) {\n const close = () => {\n modalMethods.current?.dismiss();\n modalMethods.current = undefined;\n };\n\n formActions = (\n <>\n <Button\n disabled={loading}\n onClick={() => {\n onDismiss({ close });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={loading}\n type='submit'\n variant='primary'\n onClick={() => {\n submittingRef.current = true;\n onSubmit({ close });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress: loading\n ? { message: submittingRef.current ? t('submitting') : t('loading') }\n : undefined,\n children: modalContent,\n actions: formActions,\n onRequestDismiss: loading && submittingRef.current ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(\n Modal,\n {\n ...modalProps,\n heading,\n onBeforeOpen,\n onAfterClose: () => {\n onAfterClose?.();\n submittingRef.current = false;\n }\n },\n {\n dismissible: false\n }\n );\n }\n };\n\n return {\n renderModal\n };\n }\n\n return {\n renderModal: () => {}\n };\n};\n\nexport default useCreateModal;\n"]}
1	+ {"version":3,"file":"useCreateModal.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAgClF,MAAM,cAAc,GAAG,CAA4B,MAA2C,EAAE,EAAE;IAChG,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IACpC,MAAM,YAAY,GAAG,MAAM,EAAgB,CAAC;IAC5C,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,eAAe,EAAE,CAAC;IAElD,IAAI,MAAM,EAAE,CAAC;QACX,MAAM,EACJ,QAAQ,EAAE,QAAQ,EAClB,SAAS,EACT,MAAM,EACN,MAAM,EACN,sBAAsB,EACtB,sBAAsB,EACtB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,OAAO,GAAG,CAAC,CAAC,YAAY,CAAC,EAC1B,GAAG,MAAM,CAAC;QACX,MAAM,WAAW,GAAG,CAAC,EAAE,aAAa,EAAE,OAAO,GAAG,KAAK,EAA6B,EAAE,EAAE;YACpF,MAAM,YAAY,GAAc,KAAC,QAAQ,OAAK,aAAa,GAAI,CAAC;YAEhE,IAAI,WAAW,GAAc,IAAI,CAAC;YAElC,IAAI,CAAC,OAAO,IAAI,aAAa,CAAC,OAAO,EAAE,CAAC;gBACtC,MAAM,KAAK,GAAG,GAAG,EAAE;oBACjB,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC;oBAChC,YAAY,CAAC,OAAO,GAAG,SAAS,CAAC;gBACnC,CAAC,CAAC;gBAEF,WAAW,GAAG,CACZ,8BACE,KAAC,MAAM,mBACQ,sBAAsB,EACnC,QAAQ,EAAE,OAAO,EACjB,OAAO,EAAE,GAAG,EAAE;gCACZ,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;4BACvB,CAAC,YAEA,CAAC,CAAC,QAAQ,CAAC,GACL,EACT,KAAC,MAAM,mBACQ,sBAAsB,EACnC,QAAQ,EAAE,OAAO,EACjB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE;gCACZ,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;gCAC7B,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;4BACtB,CAAC,YAEA,CAAC,CAAC,QAAQ,CAAC,GACL,IACR,CACJ,CAAC;YACJ,CAAC;YAED,MAAM,UAAU,GAAsC;gBACpD,QAAQ,EAAE,OAAO;oBACf,CAAC,CAAC,EAAE,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,EAAE;oBACrE,CAAC,CAAC,SAAS;gBACb,QAAQ,EAAE,YAAY;gBACtB,OAAO,EAAE,WAAW;gBACpB,gBAAgB,EAAE,OAAO,IAAI,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;aAC7E,CAAC;YAEF,IAAI,YAAY,CAAC,OAAO,EAAE,CAAC;gBACzB,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YAC1C,CAAC;iBAAM,CAAC;gBACN,YAAY,CAAC,OAAO,GAAG,WAAW,CAChC,KAAK,EACL;oBACE,GAAG,UAAU;oBACb,SAAS;oBACT,MAAM;oBACN,OAAO;oBACP,YAAY;oBACZ,YAAY,EAAE,GAAG,EAAE;wBACjB,YAAY,EAAE,EAAE,CAAC;wBACjB,aAAa,CAAC,OAAO,GAAG,KAAK,CAAC;oBAChC,CAAC;oBACD,aAAa,EAAE,MAAM;iBACtB,EACD;oBACE,WAAW,EAAE,KAAK;iBACnB,CACF,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QAEF,OAAO;YACL,WAAW;SACZ,CAAC;IACJ,CAAC;IAED,OAAO;QACL,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;KACtB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { useRef } from 'react';\nimport type { ReactNode, ComponentType } from 'react';\n\nimport { Button, Modal, useModalManager, useI18n } from '@pega/cosmos-react-core';\nimport type { ModalMethods, OmitStrict, ModalProps, TestIdProp } from '@pega/cosmos-react-core';\n\nexport interface UseCreateModalConfig<P extends object = object>\n extends TestIdProp,\n Pick<ModalProps, 'autoWidth' \| 'center'> {\n /*\n Heading for the Modal.\n * @default 'Create new'\n /\n heading?: string;\n /* A component to render the add new form. /\n renderer: ComponentType<P>;\n /* Called when a user submits a form. /\n onSubmit: ({ close }: { close: () => void }) => void;\n /* Called when a user cancels a form. /\n onDismiss: ({ close }: { close: () => void }) => void;\n /* Called before the modal opens. /\n onBeforeOpen?: ModalProps['onBeforeOpen'];\n /* Called after the modal closes. /\n onAfterClose?: ModalProps['onAfterClose'];\n /* formactions Submit testId of modal /\n formActionSubmitTestId?: TestIdProp['testId'];\n /* formactions Cancel testId of modal */\n formActionCancelTestId?: TestIdProp['testId'];\n}\n\nexport interface CreateModalActionProps<P extends object = object> {\n loading?: boolean;\n rendererProps: P;\n}\n\nconst useCreateModal = <P extends object = object>(config: UseCreateModalConfig<P> \| undefined) => {\n const t = useI18n();\n\n const submittingRef = useRef(false);\n const modalMethods = useRef<ModalMethods>();\n const { create: createModal } = useModalManager();\n\n if (config) {\n const {\n renderer: Renderer,\n autoWidth,\n center,\n testId,\n formActionCancelTestId,\n formActionSubmitTestId,\n onSubmit,\n onDismiss,\n onBeforeOpen,\n onAfterClose,\n heading = t('create_new')\n } = config;\n const renderModal = ({ rendererProps, loading = false }: CreateModalActionProps<P>) => {\n const modalContent: ReactNode = <Renderer {...rendererProps} />;\n\n let formActions: ReactNode = null;\n\n if (!loading \|\| submittingRef.current) {\n const close = () => {\n modalMethods.current?.dismiss();\n modalMethods.current = undefined;\n };\n\n formActions = (\n <>\n <Button\n data-testid={formActionCancelTestId}\n disabled={loading}\n onClick={() => {\n onDismiss({ close });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n data-testid={formActionSubmitTestId}\n disabled={loading}\n type='submit'\n variant='primary'\n onClick={() => {\n submittingRef.current = true;\n onSubmit({ close });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress: loading\n ? { message: submittingRef.current ? t('submitting') : t('loading') }\n : undefined,\n children: modalContent,\n actions: formActions,\n onRequestDismiss: loading && submittingRef.current ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(\n Modal,\n {\n ...modalProps,\n autoWidth,\n center,\n heading,\n onBeforeOpen,\n onAfterClose: () => {\n onAfterClose?.();\n submittingRef.current = false;\n },\n 'data-testid': testId\n },\n {\n dismissible: false\n }\n );\n }\n };\n\n return {\n renderModal\n };\n }\n\n return {\n renderModal: () => {}\n };\n};\n\nexport default useCreateModal;\n"]}

package/lib/components/PageTemplates/PageTemplate.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplate.styles.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,IAAI,EAEJ,MAAM,~~EAQP~~,MAAM,yBAAyB,CAAC;AAWjC,eAAO,MAAM,gBAAgB,~~yGAuC3B~~,CAAC;AAIH,eAAO,MAAM,aAAa,kNAEzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,yGAO5B,CAAC;AAKH,eAAO,MAAM,mBAAmB,~~yGAgC~~/B,CAAC;AAIF,eAAO,MAAM,+BAA+B,kNAW1C,CAAC;AAKH,eAAO,MAAM,kBAAkB,~~yGAS9B~~,CAAC;AAGF,eAAO,MAAM,YAAY,~~yGAMvB~~,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,OAAO,IAG3C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,OAAO,IAQ9B,CAAC;AAEH,eAAO,MAAM,uBAAuB,EAAE,OAAO,MAoB3C,CAAC"}
1	+ {"version":3,"file":"PageTemplate.styles.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,IAAI,EAEJ,MAAM,EAOP,MAAM,yBAAyB,CAAC;AAWjC,eAAO,MAAM,gBAAgB,yGAiD3B,CAAC;AAIH,eAAO,MAAM,aAAa,kNAEzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,yGAO5B,CAAC;AAKH,eAAO,MAAM,mBAAmB,yGA+B/B,CAAC;AAIF,eAAO,MAAM,+BAA+B,kNAW1C,CAAC;AAKH,eAAO,MAAM,kBAAkB,yGAa9B,CAAC;AAGF,eAAO,MAAM,YAAY,yGAUvB,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,OAAO,IAG3C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,OAAO,IAQ9B,CAAC;AAEH,eAAO,MAAM,uBAAuB,EAAE,OAAO,MAoB3C,CAAC"}

package/lib/components/PageTemplates/PageTemplate.styles.js CHANGED Viewed

@@ -1,22 +1,31 @@
 import styled, { css } from 'styled-components';
-import { readableColor } from 'polished';
-import { Text, defaultThemeProp, Button, StyledPageHeader, tryCatch, StyledButton, StyledLink, StyledShowMoreLessButton, Flex, StyledImage } from '@pega/cosmos-react-core';
+import { transparentize } from 'polished';
+import { Text, defaultThemeProp, Button, StyledPageHeader, StyledButton, StyledLink, StyledShowMoreLessButton, Flex, StyledImage } from '@pega/cosmos-react-core';
 import { StyledBanner, StyledBannerMessageList } from '@pega/cosmos-react-core/lib/components/Banner/Banner';
 import { StyledTabs } from '@pega/cosmos-react-core/lib/components/Tabs/Tabs.styles';
 import { calculateFontSize } from '@pega/cosmos-react-core/lib/styles';
 import { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';
 // Page banner styles
 export const StyledPageBanner = styled.div(({ theme }) => {
-    const { base: { palette: { 'brand-primary': brandBackground }, 'font-weight': fontWeight, 'content-width': contentWidth } } = theme;
-    const color = tryCatch(() => readableColor(brandBackground));
+    const { base: { 'font-weight': fontWeight, 'content-width': contentWidth, 'border-radius': borderRadius, spacing, palette: { 'foreground-color': color } } } = theme;
     return css `
-    background: ${brandBackground};
-    color: ${color};
+    background: ${transparentize(0.95, color)};
+    border-radius: ${borderRadius};
+    padding-block-start: ${spacing};
+    &,
+    h1 {
+      color: ${color};
+    }
     h1:focus-visible {
       outline: transparent;
     }
+    ${StyledButton} {
+      color: ${color};
+    }
     ${StyledButton} + ${StyledButton} {
       margin-inline-start: 0;
     }
@@ -53,7 +62,7 @@ export const StyledDescription = styled.div(({ theme }) => {
 });
 StyledDescription.defaultProps = defaultThemeProp;
 // Inventory page styles
-export const StyledInventoryPage = styled.div(({ theme: { base: { spacing, palette: { 'primary-background': primaryBackground, 'border-line': borderLine } } } }) => {
+export const StyledInventoryPage = styled.div(({ theme: { base: { spacing, palette: { 'primary-background': primaryBackground } } } }) => {
     return css `
       background: ${primaryBackground};
       height: 100%;
@@ -65,7 +74,6 @@ export const StyledInventoryPage = styled.div(({ theme: { base: { spacing, palet
       ${StyledPageHeader} {
         padding: calc(2 * ${spacing});
-        border-block-end: 0.0625rem solid ${borderLine};
       }
       ${StyledBannerMessageList} {
@@ -99,10 +107,18 @@ export const StyledOverviewPage = styled.div `
   ${StyledShowMoreLessButton} {
     max-width: fit-content;
   }
+  ${StyledPageBanner} {
+    background: none;
+  }
 `;
 // Construct page styles
 export const StyledHeader = styled.div(({ theme }) => {
     return css `
+    background: ${transparentize(0.95, theme.base.palette['foreground-color'])};
+    border-radius: ${theme.base['border-radius']};
+    padding: calc(2 * ${theme.base.spacing});
     h1:focus-visible {
       box-shadow: ${theme.base.shadow['focus-inset']};
     }

package/lib/components/PageTemplates/PageTemplate.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplate.styles.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,~~aAAa~~,EAAE,MAAM,UAAU,CAAC;~~AAEzC~~,OAAO,EACL,IAAI,EACJ,gBAAgB,EAChB,MAAM,EACN,gBAAgB,EAChB,~~QAAQ,EACR,~~YAAY,EACZ,UAAU,EACV,wBAAwB,EACxB,IAAI,EACJ,WAAW,EACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,YAAY,EACZ,uBAAuB,EACxB,MAAM,sDAAsD,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAE7E,qBAAqB;AACrB,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvD,MAAM,EACJ,IAAI,EAAE,EACJ,~~OAAO~~,EAAE,~~EAAE~~,eAAe,EAAE,eAAe,EAAE,~~EAC7C~~,~~aAAa~~,EAAE,~~UAAU~~,~~EACzB~~,~~eAAe~~,EAAE,~~YAAY~~,~~EAC9B,~~EACF,GAAG,KAAK,CAAC;IAEV,~~MAAM~~,~~KAAK,~~GAAG,~~QAAQ~~,CAAC,~~GAAG~~,EAAE,~~CAAC~~,~~aAAa,~~CAAC,~~eAAe,CAAC,CAAC,CAAC~~;~~IAE7D~~,OAAO,~~GAAG~~,~~CAAA~~;~~kBACM~~,~~eAAe;aACpB,~~KAAK~~;;;;;;MAMZ~~,YAAY,MAAM,YAAY;;;;MAI9B,UAAU,KAAK,wBAAwB;qBACxB,UAAU,CAAC,WAAW,CAAC;eAC7B,KAAK;;;;mBAID,YAAY,CAAC,EAAE;;;MAG5B,WAAW;;;;;;GAMd,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAExC,CAAC;AAEF,gBAAgB;AAChB,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;iBACK,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;;;;GAI5C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,wBAAwB;AACxB,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAC3C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,OAAO,EAAE,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,~~aAAa~~,~~EAAE,UAAU,EAAE,EAChF,~~EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;oBACM,iBAAiB;;;QAG7B,YAAY;QACZ,UAAU;yCACuB,OAAO;;;QAGxC,gBAAgB;4BACI,OAAO~~;4CACS,UAAU~~;;;~~QAG9C~~,uBAAuB;;;;QAIvB,iBAAiB;mCACU,OAAO;;KAErC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,+BAA+B,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxE,MAAM,EACJ,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,OAAO,EAAE,EACjD,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;iBACK,YAAY,CAAC,EAAE;;;gCAGA,OAAO;;GAEpC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,+BAA+B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhE,uBAAuB;AACvB,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;IAExC,gBAAgB;;;;IAIhB,wBAAwB;;;~~CAG3B~~,CAAC;AAEF,wBAAwB;AACxB,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACnD,OAAO,GAAG,CAAA~~;;oBAEQ~~,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;;GAEjD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAE7C,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAgB,MAAM,CAAC,IAAI,CAAC,CAAA;;IAE3D,gBAAgB;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAgB,MAAM,CAAC,IAAI,CAAC,CAA4B,CAAC,EAC9E,YAAY,EACb,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;MAGN,YAAY,IAAI,gBAAgB;GACnC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,uBAAuB,GAAkB,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,EAAE;IAC3E,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,EAAE,EAChE,UAAU,EAAE,EAAE,IAAI,EAAE,EACrB,EACF,GAAG,KAAK,CAAC;IAEV,MAAM,SAAS,GAAG,iBAAiB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;iBACK,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAa,CAAC;mBACzC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;;MAEnC,gBAAgB;;;oBAGF,MAAM,CAAC,aAAa,CAAC;;GAEtC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { ~~readableColor~~ } from 'polished';\n\nimport {\n Text,\n defaultThemeProp,\n Button,\n StyledPageHeader,\n ~~tryCatch,\n~~ StyledButton,\n StyledLink,\n StyledShowMoreLessButton,\n Flex,\n StyledImage\n} from '@pega/cosmos-react-core';\nimport {\n StyledBanner,\n StyledBannerMessageList\n} from '@pega/cosmos-react-core/lib/components/Banner/Banner';\nimport { StyledTabs } from '@pega/cosmos-react-core/lib/components/Tabs/Tabs.styles';\nimport { calculateFontSize } from '@pega/cosmos-react-core/lib/styles';\nimport type { FontSize } from '@pega/cosmos-react-core/lib/styles';\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\n\n// Page banner styles\nexport const StyledPageBanner = styled.div(({ theme }) => {\n const {\n base: {\n ~~palette~~: { '~~brand~~-~~primary~~': ~~brandBackground }~~,\n '~~font~~-~~weight~~': ~~fontWeight~~,\n '~~content~~-~~width~~': ~~contentWidth~~\n }\n } = theme;\n\n ~~const~~ ~~color~~ ~~= tryCatch~~(() ~~=> readableColor(brandBackground~~));\n~~\n return~~ ~~css`\~~n ~~background~~: ${~~brandBackground~~};\n color: ${color};\n\n h1:focus-visible {\n outline: transparent;\n }\n\n ${StyledButton} + ${StyledButton} {\n margin-inline-start: 0;\n }\n\n ${StyledLink}, ${StyledShowMoreLessButton} {\n font-weight: ${fontWeight['semi-bold']};\n color: ${color};\n }\n\n p {\n max-width: ${contentWidth.xl};\n }\n\n ${StyledImage} {\n object-fit: contain;\n max-height: 10rem;\n justify-self: center;\n align-self: center;\n }\n `;\n});\n\nStyledPageBanner.defaultProps = defaultThemeProp;\n\nexport const StyledActions = styled(Flex)`\n margin-block-start: auto;\n`;\n\n// Common styles\nexport const StyledDescription = styled.div(({ theme }) => {\n return css`\n max-width: ${theme.base['content-width'].lg};\n * {\n overflow: hidden;\n }\n `;\n});\n\nStyledDescription.defaultProps = defaultThemeProp;\n\n// Inventory page styles\nexport const StyledInventoryPage = styled.div(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground, ~~'border-line': borderLine~~ }\n }\n }\n }) => {\n return css`\n background: ${primaryBackground};\n height: 100%;\n\n ${StyledBanner},\n ${StyledTabs} {\n margin-block-start: calc(1.5 * ${spacing});\n }\n\n ${StyledPageHeader} {\n padding: calc(2 * ${spacing});\n ~~border-block-end: 0.0625rem solid ${borderLine};\n~~ }\n\n ${StyledBannerMessageList} {\n max-height: 25vh;\n overflow: auto;\n }\n ${StyledDescription} {\n margin-block-start: calc(${spacing} * 1.5);\n }\n `;\n }\n);\n\nStyledInventoryPage.defaultProps = defaultThemeProp;\n\nexport const StyledInventoryPageTitleWrapper = styled(Flex)(({ theme }) => {\n const {\n base: { 'content-width': contentWidth, spacing }\n } = theme;\n return css`\n max-width: ${contentWidth.xl};\n\n h1 {\n margin-inline-end: calc(${spacing} * 2);\n }\n `;\n});\n\nStyledInventoryPageTitleWrapper.defaultProps = defaultThemeProp;\n\n// overview page styles\nexport const StyledOverviewPage = styled.div`\n /* remove the default padding set by header */\n ${StyledPageHeader} {\n padding: 0;\n }\n\n ${StyledShowMoreLessButton} {\n max-width: fit-content;\n }\n`;\n\n// Construct page styles\nexport const StyledHeader = styled.div(({ theme }) => {\n return css`\n h1:focus-visible {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n `;\n});\n\nStyledHeader.defaultProps = defaultThemeProp;\n\nexport const StyledTitleContainer = styled.div`\n width: calc(100% - 3rem);\n`;\n\nexport const StyledTextWithEllipsis: typeof Text = styled(Text)`\n display: block;\n ${ellipsisOverflow}\n`;\n\nexport const StyledText: typeof Text = styled(Text)<{ showEllipsis: boolean }>(({\n showEllipsis\n}) => {\n return css`\n width: 100%;\n white-space: nowrap;\n ${showEllipsis && ellipsisOverflow}\n `;\n});\n\nexport const StyledPrimaryMetaButton: typeof Button = styled(Button)(props => {\n const {\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, shadow },\n components: { text }\n }\n } = props;\n\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${fontSizes[text.h1['font-size'] as FontSize]};\n font-weight: ${text.h1['font-weight']};\n width: 100%;\n ${ellipsisOverflow}\n\n &:not([disabled]):focus {\n box-shadow: ${shadow['focus-inset']};\n }\n `;\n});\n\nStyledPrimaryMetaButton.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"PageTemplate.styles.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport {\n Text,\n defaultThemeProp,\n Button,\n StyledPageHeader,\n StyledButton,\n StyledLink,\n StyledShowMoreLessButton,\n Flex,\n StyledImage\n} from '@pega/cosmos-react-core';\nimport {\n StyledBanner,\n StyledBannerMessageList\n} from '@pega/cosmos-react-core/lib/components/Banner/Banner';\nimport { StyledTabs } from '@pega/cosmos-react-core/lib/components/Tabs/Tabs.styles';\nimport { calculateFontSize } from '@pega/cosmos-react-core/lib/styles';\nimport type { FontSize } from '@pega/cosmos-react-core/lib/styles';\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\n\n// Page banner styles\nexport const StyledPageBanner = styled.div(({ theme }) => {\n const {\n base: {\n 'font-weight': fontWeight,\n 'content-width': contentWidth,\n 'border-radius': borderRadius,\n spacing,\n palette: { 'foreground-color': color }\n }\n } = theme;\n\n return css`\n background: ${transparentize(0.95, color)};\n border-radius: ${borderRadius};\n padding-block-start: ${spacing};\n\n &,\n h1 {\n color: ${color};\n }\n\n h1:focus-visible {\n outline: transparent;\n }\n\n ${StyledButton} {\n color: ${color};\n }\n\n ${StyledButton} + ${StyledButton} {\n margin-inline-start: 0;\n }\n\n ${StyledLink}, ${StyledShowMoreLessButton} {\n font-weight: ${fontWeight['semi-bold']};\n color: ${color};\n }\n\n p {\n max-width: ${contentWidth.xl};\n }\n\n ${StyledImage} {\n object-fit: contain;\n max-height: 10rem;\n justify-self: center;\n align-self: center;\n }\n `;\n});\n\nStyledPageBanner.defaultProps = defaultThemeProp;\n\nexport const StyledActions = styled(Flex)`\n margin-block-start: auto;\n`;\n\n// Common styles\nexport const StyledDescription = styled.div(({ theme }) => {\n return css`\n max-width: ${theme.base['content-width'].lg};\n * {\n overflow: hidden;\n }\n `;\n});\n\nStyledDescription.defaultProps = defaultThemeProp;\n\n// Inventory page styles\nexport const StyledInventoryPage = styled.div(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n }\n }\n }) => {\n return css`\n background: ${primaryBackground};\n height: 100%;\n\n ${StyledBanner},\n ${StyledTabs} {\n margin-block-start: calc(1.5 * ${spacing});\n }\n\n ${StyledPageHeader} {\n padding: calc(2 * ${spacing});\n }\n\n ${StyledBannerMessageList} {\n max-height: 25vh;\n overflow: auto;\n }\n ${StyledDescription} {\n margin-block-start: calc(${spacing} * 1.5);\n }\n `;\n }\n);\n\nStyledInventoryPage.defaultProps = defaultThemeProp;\n\nexport const StyledInventoryPageTitleWrapper = styled(Flex)(({ theme }) => {\n const {\n base: { 'content-width': contentWidth, spacing }\n } = theme;\n return css`\n max-width: ${contentWidth.xl};\n\n h1 {\n margin-inline-end: calc(${spacing} * 2);\n }\n `;\n});\n\nStyledInventoryPageTitleWrapper.defaultProps = defaultThemeProp;\n\n// overview page styles\nexport const StyledOverviewPage = styled.div`\n /* remove the default padding set by header /\n ${StyledPageHeader} {\n padding: 0;\n }\n\n ${StyledShowMoreLessButton} {\n max-width: fit-content;\n }\n\n ${StyledPageBanner} {\n background: none;\n }\n`;\n\n// Construct page styles\nexport const StyledHeader = styled.div(({ theme }) => {\n return css`\n background: ${transparentize(0.95, theme.base.palette['foreground-color'])};\n border-radius: ${theme.base['border-radius']};\n padding: calc(2 ${theme.base.spacing});\n\n h1:focus-visible {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n `;\n});\n\nStyledHeader.defaultProps = defaultThemeProp;\n\nexport const StyledTitleContainer = styled.div`\n width: calc(100% - 3rem);\n`;\n\nexport const StyledTextWithEllipsis: typeof Text = styled(Text)`\n display: block;\n ${ellipsisOverflow}\n`;\n\nexport const StyledText: typeof Text = styled(Text)<{ showEllipsis: boolean }>(({\n showEllipsis\n}) => {\n return css`\n width: 100%;\n white-space: nowrap;\n ${showEllipsis && ellipsisOverflow}\n `;\n});\n\nexport const StyledPrimaryMetaButton: typeof Button = styled(Button)(props => {\n const {\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, shadow },\n components: { text }\n }\n } = props;\n\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${fontSizes[text.h1['font-size'] as FontSize]};\n font-weight: ${text.h1['font-weight']};\n width: 100%;\n ${ellipsisOverflow}\n\n &:not([disabled]):focus {\n box-shadow: ${shadow['focus-inset']};\n }\n `;\n});\n\nStyledPrimaryMetaButton.defaultProps = defaultThemeProp;\n"]}

package/lib/components/PageTemplates/PageTemplates.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplates.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,UAAU,EAAE,MAAM,OAAO,CAAC;AA0BzD,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,eAAe,IAAI,mBAAmB,EACtC,mBAAmB,EACnB,iBAAiB,EACjB,UAAU,EACV,WAAW,EAEX,UAAU,EACV,+BAA+B,EAChC,MAAM,yBAAyB,CAAC;AASjC,MAAM,WAAW,mBAAoB,SAAQ,UAAU;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACrD;AACD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC,EAAE,UAAU;IAC/F,QAAQ,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACzC,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACzD,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,mBAAmB,CAAC;CACtC;AAED,KAAK,gBAAgB,GAAG,QAAQ,GAAG,eAAe,CAAC;AAEnD,MAAM,WAAW,kBACf,SAAQ,UAAU,CAAC,sBAAsB,EAAE,gBAAgB,CAAC,EAC1D,eAAe,EACf,UAAU;CAAG;AAEjB,MAAM,WAAW,eACf,SAAQ,UAAU,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,EACvD,eAAe,EACf,UAAU;CAAG;AA6BjB,eAAO,MAAM,UAAU,~~yGAiCtB~~,CAAC;AAIF,eAAO,MAAM,UAAU,GAAI,wEAQxB,eAAe,4CAuEjB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CAgBvE,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,+BAA+B,CAAC,kBAAkB,CAoB7E,CAAC;kGA/GC,eAAe;;;AAiHlB,wBAA6D"}
1	+ {"version":3,"file":"PageTemplates.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,UAAU,EAAE,MAAM,OAAO,CAAC;AA0BzD,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,eAAe,IAAI,mBAAmB,EACtC,mBAAmB,EACnB,iBAAiB,EACjB,UAAU,EACV,WAAW,EAEX,UAAU,EACV,+BAA+B,EAChC,MAAM,yBAAyB,CAAC;AASjC,MAAM,WAAW,mBAAoB,SAAQ,UAAU;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACrD;AACD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC,EAAE,UAAU;IAC/F,QAAQ,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACzC,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACzD,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,mBAAmB,CAAC;CACtC;AAED,KAAK,gBAAgB,GAAG,QAAQ,GAAG,eAAe,CAAC;AAEnD,MAAM,WAAW,kBACf,SAAQ,UAAU,CAAC,sBAAsB,EAAE,gBAAgB,CAAC,EAC1D,eAAe,EACf,UAAU;CAAG;AAEjB,MAAM,WAAW,eACf,SAAQ,UAAU,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,EACvD,eAAe,EACf,UAAU;CAAG;AA6BjB,eAAO,MAAM,UAAU,yGA8BtB,CAAC;AAIF,eAAO,MAAM,UAAU,GAAI,wEAQxB,eAAe,4CAuEjB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CAgBvE,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,+BAA+B,CAAC,kBAAkB,CAoB7E,CAAC;kGA/GC,eAAe;;;AAiHlB,wBAA6D"}

package/lib/components/PageTemplates/PageTemplates.js CHANGED Viewed

@@ -26,9 +26,9 @@ const StyledHeaderContent = styled(SummaryItem) `
     align-self: start;
   }
 `;
-export const StyledPage = styled.div(({ theme: { base: { spacing, palette: { 'primary-background': primaryBackground } } } }) => {
+export const StyledPage = styled.div(({ theme: { base: { spacing } } }) => {
     return css `
-      background: ${primaryBackground};
+      background: none;
       height: 100%;
       ${StyledBanner},

package/lib/components/PageTemplates/PageTemplates.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, useRef } from 'react';\nimport type { PropsWithoutRef, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n OneColumnPage as CoreOneColumnPage,\n TabbedPage as CoreTabbedPage,\n Flex,\n Status,\n SummaryItem,\n Text,\n Button,\n Popover,\n FieldValueList,\n defaultThemeProp,\n useI18n,\n StyledSummaryItemActions,\n StyledRegion,\n MetaList,\n StyledBreadcrumbs,\n StyledPageHeader,\n AdditionalInfo,\n useTestIds,\n withTestIds,\n useElement,\n Tooltip\n} from '@pega/cosmos-react-core';\nimport type {\n OneColumnPageProps as CoreOneColumnPageProps,\n TabbedPageProps as CoreTabbedPageProps,\n FieldValueListProps,\n PageTemplateProps,\n OmitStrict,\n StatusProps,\n DialogHandleValue,\n TestIdProp,\n ForwardRefForwardPropsComponent\n} from '@pega/cosmos-react-core';\nimport { StyledForm } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm';\nimport { StyledBanner } from '@pega/cosmos-react-core/lib/components/Banner/Banner';\nimport { StyledTabs } from '@pega/cosmos-react-core/lib/components/Tabs/Tabs.styles';\n\nimport { StyledWorkbench } from '../Workbench/Workbench.styles';\n\nimport { getPageHeaderTestIds } from './PageTemplates.test-ids';\n\nexport interface AdditionalInfoProps extends TestIdProp {\n title: string;\n description?: string;\n fields: FieldValueListProps['fields'];\n onEdit?: (e: MouseEvent<HTMLButtonElement>) => void;\n}\nexport interface PageHeaderProps extends Pick<PageTemplateProps, 'title' \| 'actions'>, TestIdProp {\n metadata?: FieldValueListProps['fields'];\n status?: { type: StatusProps['variant']; label: string };\n titleTag?: 'h1' \| 'h2';\n additionalInfo?: AdditionalInfoProps;\n}\n\ntype OmittedPageProps = 'header' \| 'scrollContent';\n\nexport interface OneColumnPageProps\n extends OmitStrict<CoreOneColumnPageProps, OmittedPageProps>,\n PageHeaderProps,\n TestIdProp {}\n\nexport interface TabbedPageProps\n extends OmitStrict<CoreTabbedPageProps, OmittedPageProps>,\n PageHeaderProps,\n TestIdProp {}\n\nconst StyledTextWithEllipsis: typeof Text = styled(Text)`\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n line-height: 1.15;\n`;\n\nconst StyledInfoPopover = styled(Popover)(({\n theme: {\n base: { 'content-width': contentWidth }\n }\n}) => {\n return css`\n min-width: ${contentWidth.sm};\n max-width: ${contentWidth.md};\n overflow-wrap: break-word;\n `;\n});\n\nStyledInfoPopover.defaultProps = defaultThemeProp;\n\nconst StyledHeaderContent = styled(SummaryItem)`\n ${StyledSummaryItemActions} {\n align-self: start;\n }\n`;\n\nexport const StyledPage = styled.div(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n }\n }\n }) => {\n return css`\n background: ${primaryBackground};\n height: 100%;\n\n ${StyledBanner},\n ${StyledTabs} {\n margin-block-start: calc(1.5 * ${spacing});\n }\n\n ${StyledRegion} ${StyledWorkbench} {\n position: absolute;\n width: 100%;\n margin: 0 calc(-2 * ${spacing});\n }\n\n ${StyledRegion} ${StyledForm} {\n max-width: 80ch;\n }\n\n ${StyledPageHeader} > ${StyledBreadcrumbs} {\n margin-block-end: 0;\n }\n `;\n }\n);\n\nStyledPage.defaultProps = defaultThemeProp;\n\nexport const PageHeader = ({\n testId,\n title,\n metadata,\n additionalInfo,\n actions,\n status,\n titleTag\n}: PageHeaderProps) => {\n const t = useI18n();\n const [el, setEl] = useElement();\n const testIds = useTestIds(testId, getPageHeaderTestIds);\n const metaListItems = useMemo(\n () => metadata?.map(({ name, value }) => `${name}: ${value}`),\n [metadata]\n );\n\n const infoDialogHandle = useRef<DialogHandleValue>(null);\n\n return (\n <StyledHeaderContent\n testId={testId}\n container\n primary={\n <Flex container={{ alignItems: 'center', gap: 0.5, wrap: 'wrap' }}>\n <Flex container={{ gap: 0.5, alignItems: 'end' }} item={{ shrink: 0 }}>\n <StyledTextWithEllipsis\n data-testid={testIds.title}\n variant='h1'\n as={titleTag}\n ref={setEl}\n >\n {title}\n </StyledTextWithEllipsis>\n {el && (\n <Tooltip target={el} smart showDelay='none' hideDelay='none'>\n {title}\n </Tooltip>\n )}\n {additionalInfo && (\n <AdditionalInfo\n data-testid={additionalInfo.testId}\n heading={additionalInfo.title}\n dialogHandle={infoDialogHandle}\n >\n <Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>\n <Flex\n container={{ direction: 'column', gap: 1 }}\n item={{ grow: 1, alignSelf: 'stretch' }}\n >\n {additionalInfo.description && <Text as='p'>{additionalInfo.description}</Text>}\n <FieldValueList variant='inline' fields={additionalInfo.fields} />\n </Flex>\n {additionalInfo.onEdit && (\n <Button\n data-testid={testIds.editDetails}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n infoDialogHandle.current?.close();\n additionalInfo.onEdit?.(e);\n }}\n >\n {t('edit_details')}\n </Button>\n )}\n </Flex>\n </AdditionalInfo>\n )}\n </Flex>\n {status && (\n <Status data-testid={testIds.status} variant={status.type}>\n {status.label}\n </Status>\n )}\n </Flex>\n }\n secondary={metaListItems && <MetaList items={metaListItems} />}\n actions={actions}\n />\n );\n};\n\nexport const TabbedPage: ForwardRefForwardPropsComponent<TabbedPageProps> = forwardRef(\n function TabbedPage(\n { tabs, ...restProps }: PropsWithoutRef<TabbedPageProps>,\n ref: TabbedPageProps['ref']\n ) {\n return (\n <CoreTabbedPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n tabs={tabs}\n ref={ref}\n scrollContent\n />\n );\n }\n);\n\nexport const OneColumnPage: ForwardRefForwardPropsComponent<OneColumnPageProps> = forwardRef(\n function OneColumnPage(\n {\n a,\n\n ...restProps\n }: PropsWithoutRef<OneColumnPageProps>,\n ref: OneColumnPageProps['ref']\n ) {\n return (\n <CoreOneColumnPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n scrollContent\n a={a}\n ref={ref}\n />\n );\n }\n);\n\nexport default withTestIds(PageHeader, getPageHeaderTestIds);\n"]}
1	+ {"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, useRef } from 'react';\nimport type { PropsWithoutRef, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n OneColumnPage as CoreOneColumnPage,\n TabbedPage as CoreTabbedPage,\n Flex,\n Status,\n SummaryItem,\n Text,\n Button,\n Popover,\n FieldValueList,\n defaultThemeProp,\n useI18n,\n StyledSummaryItemActions,\n StyledRegion,\n MetaList,\n StyledBreadcrumbs,\n StyledPageHeader,\n AdditionalInfo,\n useTestIds,\n withTestIds,\n useElement,\n Tooltip\n} from '@pega/cosmos-react-core';\nimport type {\n OneColumnPageProps as CoreOneColumnPageProps,\n TabbedPageProps as CoreTabbedPageProps,\n FieldValueListProps,\n PageTemplateProps,\n OmitStrict,\n StatusProps,\n DialogHandleValue,\n TestIdProp,\n ForwardRefForwardPropsComponent\n} from '@pega/cosmos-react-core';\nimport { StyledForm } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm';\nimport { StyledBanner } from '@pega/cosmos-react-core/lib/components/Banner/Banner';\nimport { StyledTabs } from '@pega/cosmos-react-core/lib/components/Tabs/Tabs.styles';\n\nimport { StyledWorkbench } from '../Workbench/Workbench.styles';\n\nimport { getPageHeaderTestIds } from './PageTemplates.test-ids';\n\nexport interface AdditionalInfoProps extends TestIdProp {\n title: string;\n description?: string;\n fields: FieldValueListProps['fields'];\n onEdit?: (e: MouseEvent<HTMLButtonElement>) => void;\n}\nexport interface PageHeaderProps extends Pick<PageTemplateProps, 'title' \| 'actions'>, TestIdProp {\n metadata?: FieldValueListProps['fields'];\n status?: { type: StatusProps['variant']; label: string };\n titleTag?: 'h1' \| 'h2';\n additionalInfo?: AdditionalInfoProps;\n}\n\ntype OmittedPageProps = 'header' \| 'scrollContent';\n\nexport interface OneColumnPageProps\n extends OmitStrict<CoreOneColumnPageProps, OmittedPageProps>,\n PageHeaderProps,\n TestIdProp {}\n\nexport interface TabbedPageProps\n extends OmitStrict<CoreTabbedPageProps, OmittedPageProps>,\n PageHeaderProps,\n TestIdProp {}\n\nconst StyledTextWithEllipsis: typeof Text = styled(Text)`\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n line-height: 1.15;\n`;\n\nconst StyledInfoPopover = styled(Popover)(({\n theme: {\n base: { 'content-width': contentWidth }\n }\n}) => {\n return css`\n min-width: ${contentWidth.sm};\n max-width: ${contentWidth.md};\n overflow-wrap: break-word;\n `;\n});\n\nStyledInfoPopover.defaultProps = defaultThemeProp;\n\nconst StyledHeaderContent = styled(SummaryItem)`\n ${StyledSummaryItemActions} {\n align-self: start;\n }\n`;\n\nexport const StyledPage = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n background: none;\n height: 100%;\n\n ${StyledBanner},\n ${StyledTabs} {\n margin-block-start: calc(1.5 * ${spacing});\n }\n\n ${StyledRegion} ${StyledWorkbench} {\n position: absolute;\n width: 100%;\n margin: 0 calc(-2 * ${spacing});\n }\n\n ${StyledRegion} ${StyledForm} {\n max-width: 80ch;\n }\n\n ${StyledPageHeader} > ${StyledBreadcrumbs} {\n margin-block-end: 0;\n }\n `;\n }\n);\n\nStyledPage.defaultProps = defaultThemeProp;\n\nexport const PageHeader = ({\n testId,\n title,\n metadata,\n additionalInfo,\n actions,\n status,\n titleTag\n}: PageHeaderProps) => {\n const t = useI18n();\n const [el, setEl] = useElement();\n const testIds = useTestIds(testId, getPageHeaderTestIds);\n const metaListItems = useMemo(\n () => metadata?.map(({ name, value }) => `${name}: ${value}`),\n [metadata]\n );\n\n const infoDialogHandle = useRef<DialogHandleValue>(null);\n\n return (\n <StyledHeaderContent\n testId={testId}\n container\n primary={\n <Flex container={{ alignItems: 'center', gap: 0.5, wrap: 'wrap' }}>\n <Flex container={{ gap: 0.5, alignItems: 'end' }} item={{ shrink: 0 }}>\n <StyledTextWithEllipsis\n data-testid={testIds.title}\n variant='h1'\n as={titleTag}\n ref={setEl}\n >\n {title}\n </StyledTextWithEllipsis>\n {el && (\n <Tooltip target={el} smart showDelay='none' hideDelay='none'>\n {title}\n </Tooltip>\n )}\n {additionalInfo && (\n <AdditionalInfo\n data-testid={additionalInfo.testId}\n heading={additionalInfo.title}\n dialogHandle={infoDialogHandle}\n >\n <Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>\n <Flex\n container={{ direction: 'column', gap: 1 }}\n item={{ grow: 1, alignSelf: 'stretch' }}\n >\n {additionalInfo.description && <Text as='p'>{additionalInfo.description}</Text>}\n <FieldValueList variant='inline' fields={additionalInfo.fields} />\n </Flex>\n {additionalInfo.onEdit && (\n <Button\n data-testid={testIds.editDetails}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n infoDialogHandle.current?.close();\n additionalInfo.onEdit?.(e);\n }}\n >\n {t('edit_details')}\n </Button>\n )}\n </Flex>\n </AdditionalInfo>\n )}\n </Flex>\n {status && (\n <Status data-testid={testIds.status} variant={status.type}>\n {status.label}\n </Status>\n )}\n </Flex>\n }\n secondary={metaListItems && <MetaList items={metaListItems} />}\n actions={actions}\n />\n );\n};\n\nexport const TabbedPage: ForwardRefForwardPropsComponent<TabbedPageProps> = forwardRef(\n function TabbedPage(\n { tabs, ...restProps }: PropsWithoutRef<TabbedPageProps>,\n ref: TabbedPageProps['ref']\n ) {\n return (\n <CoreTabbedPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n tabs={tabs}\n ref={ref}\n scrollContent\n />\n );\n }\n);\n\nexport const OneColumnPage: ForwardRefForwardPropsComponent<OneColumnPageProps> = forwardRef(\n function OneColumnPage(\n {\n a,\n\n ...restProps\n }: PropsWithoutRef<OneColumnPageProps>,\n ref: OneColumnPageProps['ref']\n ) {\n return (\n <CoreOneColumnPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n scrollContent\n a={a}\n ref={ref}\n />\n );\n }\n);\n\nexport default withTestIds(PageHeader, getPageHeaderTestIds);\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-build",
-  "version": "9.0.0-build.6.8",
+  "version": "9.0.0-build.7.0",
   "license": "SEE LICENSE IN LICENSE",
   "author": "Pegasystems",
   "sideEffects": false,
@@ -14,9 +14,9 @@
     "build": "tsc -b tsconfig.build.json"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "9.0.0-build.6.8",
-    "@pega/cosmos-react-dnd": "9.0.0-build.6.8",
-    "@pega/cosmos-react-rte": "9.0.0-build.6.8",
+    "@pega/cosmos-react-core": "9.0.0-build.7.0",
+    "@pega/cosmos-react-dnd": "9.0.0-build.7.0",
+    "@pega/cosmos-react-rte": "9.0.0-build.7.0",
     "@types/codemirror": "^5.60.15",
     "@types/dagre": "^0.7.46",
     "@types/react": "^17.0.62 || ^18.3.3",