@pega/cosmos-react-build 9.0.0-build.29.2 → 9.0.0-build.29.21
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.
- package/lib/components/DynamicInput/DynamicInput.styles.d.ts.map +1 -1
- package/lib/components/DynamicInput/DynamicInput.styles.js +8 -0
- package/lib/components/DynamicInput/DynamicInput.styles.js.map +1 -1
- package/lib/components/ExpressionBuilder/ExpressionBuilder.styles.d.ts.map +1 -1
- package/lib/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.d.ts.map +1 -1
- package/lib/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.js +1 -1
- package/lib/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.js.map +1 -1
- package/lib/components/PageTemplates/PageTemplate.styles.d.ts.map +1 -1
- package/lib/components/PageTemplates/PageTemplate.styles.js +3 -1
- package/lib/components/PageTemplates/PageTemplate.styles.js.map +1 -1
- package/package.json +5 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DynamicInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sOAAiB,CAAC;AAEtD,eAAO,MAAM,kBAAkB;eAA2B,OAAO;eAAa,OAAO;
|
|
1
|
+
{"version":3,"file":"DynamicInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sOAAiB,CAAC;AAEtD,eAAO,MAAM,kBAAkB;eAA2B,OAAO;eAAa,OAAO;YAqGpF,CAAC"}
|
|
@@ -80,6 +80,14 @@ export const StyledDynamicInput = styled.div(({ theme: { base: { palette: { 'for
|
|
|
80
80
|
width: 100%;
|
|
81
81
|
min-width: ${contentWidth.xs};
|
|
82
82
|
}
|
|
83
|
+
|
|
84
|
+
/* When CodeMirror (Expression source) is inside, allow the control wrapper
|
|
85
|
+
to shrink so CodeMirror's intrinsic text width cannot expand the field. */
|
|
86
|
+
${StyledMenuButton} + div:has(.CodeMirror) {
|
|
87
|
+
& * {
|
|
88
|
+
min-width: 0;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
83
91
|
`;
|
|
84
92
|
});
|
|
85
93
|
StyledDynamicInput.defaultProps = defaultThemeProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DynamicInput.styles.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChG,OAAO,EAAE,gBAAgB,EAAE,MAAM,8DAA8D,CAAC;AAEhG,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AACnG,OAAO,EACL,yBAAyB,EACzB,0BAA0B,EAC3B,MAAM,yCAAyC,CAAC;AAEjD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AAEtD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAC1C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAChD,eAAe,EAAE,YAAY,EAC9B,EACD,UAAU,EAAE,EACV,cAAc,EAAE,EACd,cAAc,EAAE,sBAAsB,EACtC,YAAY,EAAE,EAAE,kBAAkB,EAAE,uBAAuB,EAAE,EAC9D,EACF,EACF,EACD,QAAQ,EACT,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;QAGN,eAAe;;;;QAIf,0BAA0B,MAAM,yBAAyB,MAAM,UAAU;;;;QAIzE,oBAAoB;;;;QAIpB,iBAAiB;;;;;;QAMjB,uBAAuB;;;;;;;;;;0BAUL,sBAAsB;;;;;;QAMxC,gBAAgB;;;wBAGA,sBAAsB;;;iBAG7B,eAAe;;;;;;;;cAQlB,gBAAgB,QAAQ,gBAAgB,OAAO,gBAAgB;;;;;;UAMnE,gBAAgB;;;;;QAKlB,QAAQ;QACV,GAAG,CAAA;UACC,gBAAgB;8BACI,uBAAuB;;OAE9C;;QAEC,gBAAgB;;;;qBAIH,YAAY,CAAC,EAAE
|
|
1
|
+
{"version":3,"file":"DynamicInput.styles.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChG,OAAO,EAAE,gBAAgB,EAAE,MAAM,8DAA8D,CAAC;AAEhG,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AACnG,OAAO,EACL,yBAAyB,EACzB,0BAA0B,EAC3B,MAAM,yCAAyC,CAAC;AAEjD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AAEtD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAC1C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAChD,eAAe,EAAE,YAAY,EAC9B,EACD,UAAU,EAAE,EACV,cAAc,EAAE,EACd,cAAc,EAAE,sBAAsB,EACtC,YAAY,EAAE,EAAE,kBAAkB,EAAE,uBAAuB,EAAE,EAC9D,EACF,EACF,EACD,QAAQ,EACT,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;QAGN,eAAe;;;;QAIf,0BAA0B,MAAM,yBAAyB,MAAM,UAAU;;;;QAIzE,oBAAoB;;;;QAIpB,iBAAiB;;;;;;QAMjB,uBAAuB;;;;;;;;;;0BAUL,sBAAsB;;;;;;QAMxC,gBAAgB;;;wBAGA,sBAAsB;;;iBAG7B,eAAe;;;;;;;;cAQlB,gBAAgB,QAAQ,gBAAgB,OAAO,gBAAgB;;;;;;UAMnE,gBAAgB;;;;;QAKlB,QAAQ;QACV,GAAG,CAAA;UACC,gBAAgB;8BACI,uBAAuB;;OAE9C;;QAEC,gBAAgB;;;;qBAIH,YAAY,CAAC,EAAE;;;;;QAK5B,gBAAgB;;;;;KAKnB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { Flex, StyledFormControl, StyledGrid, defaultThemeProp } from '@pega/cosmos-react-core';\nimport { StyledMenuButton } from '@pega/cosmos-react-core/lib/components/MenuButton/MenuButton';\n\nimport { StyledContentWrapper, StyledInputTree } from '../ObjectSelect/InputTree/InputTree.styles';\nimport {\n StyledFieldReferenceInput,\n StyledFieldReferencePicker\n} from '../FieldReference/FieldReference.styles';\n\nexport const StyledExpressionControl = styled(Flex)``;\n\nexport const StyledDynamicInput = styled.div<{ disabled?: boolean; readOnly?: boolean }>(\n ({\n theme: {\n base: {\n palette: { 'foreground-color': foregroundColor },\n 'content-width': contentWidth\n },\n components: {\n 'form-control': {\n 'border-color': formControlBorderColor,\n ':read-only': { 'background-color': readOnlyBackgroundColor }\n }\n }\n },\n readOnly\n }) => {\n return css`\n display: flex;\n\n ${StyledInputTree} {\n margin-inline-start: -2.5rem;\n }\n\n ${StyledFieldReferencePicker} > ${StyledFieldReferenceInput} > ${StyledGrid} {\n padding: 0;\n }\n\n ${StyledContentWrapper} {\n padding-block-start: 0;\n }\n\n ${StyledFormControl} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n width: 100%;\n }\n\n ${StyledExpressionControl} {\n position: relative;\n z-index: 1;\n\n .react-codemirror2 {\n min-height: 0;\n }\n\n .CodeMirror,\n .CodeMirror-wrap {\n border-color: ${formControlBorderColor};\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n\n ${StyledMenuButton} {\n z-index: 0;\n border-inline-end: 0;\n border-color: ${formControlBorderColor};\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n color: ${foregroundColor};\n &:focus {\n z-index: 2;\n }\n }\n\n /* When the sibling content contains a nested DynamicInput (another MenuButton),\n pin the source button to the top so it doesn't stretch over nested Parameters. */\n &:has(${StyledMenuButton} ~ * ${StyledMenuButton}) > ${StyledMenuButton} {\n align-self: flex-start;\n }\n\n /* disabled-opacity is already being applied on DynamicInput, so we need to unset it on MenuButton */\n &[disabled] {\n ${StyledMenuButton}:disabled {\n opacity: 1;\n }\n }\n\n ${readOnly &&\n css`\n ${StyledMenuButton} {\n background-color: ${readOnlyBackgroundColor};\n }\n `}\n\n ${StyledMenuButton} + * {\n flex-grow: 1;\n z-index: 1;\n width: 100%;\n min-width: ${contentWidth.xs};\n }\n\n /* When CodeMirror (Expression source) is inside, allow the control wrapper\n to shrink so CodeMirror's intrinsic text width cannot expand the field. */\n ${StyledMenuButton} + div:has(.CodeMirror) {\n & * {\n min-width: 0;\n }\n }\n `;\n }\n);\n\nStyledDynamicInput.defaultProps = defaultThemeProp;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpressionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAKrE,eAAO,MAAM,iBAAiB;;yLAE7B,CAAC;AAEF,eAAO,MAAM,2BAA2B,6NAKtC,CAAC;AAIH,eAAO,MAAM,oBAAoB,iOAWhC,CAAC;AAIF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BACkC,OAAO;kLAuB3E,CAAC;AAGH,eAAO,MAAM,iBAAiB,6NAQ5B,CAAC;AAIH,eAAO,MAAM,sBAAsB;;mBAIjC,CAAC;AAIH,eAAO,MAAM,uBAAuB,6NAAe,CAAC;AAIpD,eAAO,MAAM,2BAA2B,6NAQtC,CAAC;AAIH,eAAO,MAAM,oBAAoB;cACrB,mBAAmB,CAAC,UAAU,CAAC;YAuBzC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yOAE7B,CAAC;AAEF,eAAO,MAAM,0BAA0B,6NAKtC,CAAC;AAEF,eAAO,MAAM,uBAAuB,6NAOnC,CAAC;AAIF,eAAO,MAAM,yBAAyB;oBAAgC,OAAO;YAW5E,CAAC;AAEF,eAAO,MAAM,sBAAsB,6NAElC,CAAC;AAEF,eAAO,MAAM,iBAAiB,6NAE7B,CAAC;AAEF,eAAO,MAAM,eAAe;
|
|
1
|
+
{"version":3,"file":"ExpressionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAKrE,eAAO,MAAM,iBAAiB;;yLAE7B,CAAC;AAEF,eAAO,MAAM,2BAA2B,6NAKtC,CAAC;AAIH,eAAO,MAAM,oBAAoB,iOAWhC,CAAC;AAIF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BACkC,OAAO;kLAuB3E,CAAC;AAGH,eAAO,MAAM,iBAAiB,6NAQ5B,CAAC;AAIH,eAAO,MAAM,sBAAsB;;mBAIjC,CAAC;AAIH,eAAO,MAAM,uBAAuB,6NAAe,CAAC;AAIpD,eAAO,MAAM,2BAA2B,6NAQtC,CAAC;AAIH,eAAO,MAAM,oBAAoB;cACrB,mBAAmB,CAAC,UAAU,CAAC;YAuBzC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yOAE7B,CAAC;AAEF,eAAO,MAAM,0BAA0B,6NAKtC,CAAC;AAEF,eAAO,MAAM,uBAAuB,6NAOnC,CAAC;AAIF,eAAO,MAAM,yBAAyB;oBAAgC,OAAO;YAW5E,CAAC;AAEF,eAAO,MAAM,sBAAsB,6NAElC,CAAC;AAEF,eAAO,MAAM,iBAAiB,6NAE7B,CAAC;AAEF,eAAO,MAAM,eAAe;2BAvBR,CAAC;iDA0BpB,CAAC;AAEF,eAAO,MAAM,yBAAyB,6NASrC,CAAC;AAIF,eAAO,MAAM,kBAAkB,yOAE9B,CAAC;AAEF,eAAO,MAAM,wBAAwB;;yLAInC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConstructPageHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,EAgBL,KAAK,UAAU,EAChB,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,0BAA0B,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAU3F,KAAK,wBAAwB,GAAG,0BAA0B,CAAC,QAAQ,CAAC,GAClE,IAAI,CAAC,iBAAiB,EAAE,UAAU,CAAC,GACnC,UAAU,GAAG;IACX,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEJ,eAAO,MAAM,iBAAiB,GAAI,2CAG/B;IACD,IAAI,EAAE,wBAAwB,CAAC,MAAM,CAAC,CAAC;IACvC,MAAM,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;CAC/B,4CASA,CAAC;4KAeC,wBAAwB;;;
|
|
1
|
+
{"version":3,"file":"ConstructPageHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,EAgBL,KAAK,UAAU,EAChB,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,0BAA0B,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAU3F,KAAK,wBAAwB,GAAG,0BAA0B,CAAC,QAAQ,CAAC,GAClE,IAAI,CAAC,iBAAiB,EAAE,UAAU,CAAC,GACnC,UAAU,GAAG;IACX,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEJ,eAAO,MAAM,iBAAiB,GAAI,2CAG/B;IACD,IAAI,EAAE,wBAAwB,CAAC,MAAM,CAAC,CAAC;IACvC,MAAM,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;CAC/B,4CASA,CAAC;4KAeC,wBAAwB;;;AAkU3B,wBAAsE"}
|
|
@@ -163,7 +163,7 @@ const ConstructPageHeader = ({ testId, title, primaryAction, additionalActions =
|
|
|
163
163
|
direction: 'column',
|
|
164
164
|
alignItems: 'start',
|
|
165
165
|
gap: 1
|
|
166
|
-
}, item: { grow: 1, alignSelf: 'stretch' }, children: [_jsx(FieldValueList, { fields: metadata.additional, variant: 'inline', testId: testIds.metaData }), description && (_jsxs(StyledStackedFieldValue, { children: [_jsx(StyledLabel, { as: StyledFieldName, children: t('description') }), _jsx(ShowMoreLess, { lines: 3, children: description })] }))] }) }) })), actions] })] }), description && (_jsx(StyledDescription, { children: _jsx(ShowMoreLess, { lines: 2, children: _jsx(Text, { children: description }) }) }))] }));
|
|
166
|
+
}, item: { grow: 1, alignSelf: 'stretch' }, children: [_jsx(FieldValueList, { fields: metadata.additional, variant: 'inline', testId: testIds.metaData }), description && (_jsxs(StyledStackedFieldValue, { children: [_jsx(StyledLabel, { as: StyledFieldName, children: t('description') }), _jsx(StyledDescription, { children: _jsx(ShowMoreLess, { lines: 3, children: description }) })] }))] }) }) })), actions] })] }), description && (_jsx(StyledDescription, { children: _jsx(ShowMoreLess, { lines: 2, children: _jsx(Text, { children: description }) }) }))] }));
|
|
167
167
|
};
|
|
168
168
|
export default withTestIds(ConstructPageHeader, getPageHeaderTestIds);
|
|
169
169
|
//# sourceMappingURL=ConstructPageHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConstructPageHeader.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useRef, useState, useLayoutEffect, useCallback } from 'react';\n\nimport {\n Text,\n Flex,\n useTestIds,\n withTestIds,\n useElement,\n Tooltip,\n Button,\n ShowMoreLess,\n StyledStackedFieldValue,\n StyledLabel,\n StyledFieldName,\n FieldValueList,\n AdditionalInfo,\n useI18n,\n useChToPxConversionFactor,\n type TestIdProp\n} from '@pega/cosmos-react-core';\n\nimport IconTile from '../../IconTile';\nimport { getPageHeaderTestIds } from '../PageTemplates.test-ids';\nimport type { ConstructPageTemplateProps, PageTemplateProps } from '../PageTemplate.types';\nimport HeaderActionButtons from '../HeaderActionButtons';\nimport {\n StyledText,\n StyledDescription,\n StyledPrimaryMetaButton,\n StyledHeader,\n StyledTitleContainer\n} from '../PageTemplate.styles';\n\ntype ConstructPageHeaderProps = ConstructPageTemplateProps['header'] &\n Pick<PageTemplateProps, 'progress'> &\n TestIdProp & {\n onHeightChange?: (height: number) => void;\n };\n\nexport const PrimaryHeaderText = ({\n type: { href, onClick, name },\n testId\n}: {\n type: ConstructPageHeaderProps['type'];\n testId?: TestIdProp['testId'];\n}) => {\n if (href || onClick) {\n return (\n <Button variant='link' href={href} onClick={onClick} data-testid={testId}>\n {name}\n </Button>\n );\n }\n return <StyledLabel as={StyledText}>{name}</StyledLabel>;\n};\n\nconst ConstructPageHeader = ({\n testId,\n title,\n primaryAction,\n additionalActions = [],\n metadata = { additional: [] },\n visual,\n type,\n description,\n secondaryAction,\n progress,\n onHeightChange,\n closeAction\n}: ConstructPageHeaderProps) => {\n // States\n const [countOfSecondaryMetaToShow, setCountOfSecondaryMetaToShow] = useState<number>(\n metadata?.secondary?.length ?? 0\n );\n const [countOfPrimaryMetaToShow, setCountOfPrimaryMetaToShow] = useState<number>(\n metadata.primary?.length ?? 0\n );\n const [showSecondaryAction, setShowSecondaryAction] = useState(true);\n const [pageTitleEl, setPageTitleEl] = useElement();\n const [primaryMetaEl, setPrimaryMetaEl] = useElement();\n\n // Hooks\n const chToPxConversionFactor = useChToPxConversionFactor();\n const testIds = useTestIds(testId, getPageHeaderTestIds);\n const t = useI18n();\n\n // Refs\n const headerRef = useRef<HTMLDivElement>(null);\n const headerContentRef = useRef<HTMLDivElement>(null);\n const pageTitleContainerRef = useRef<HTMLDivElement>(null);\n const actionsContainerRef = useRef<HTMLDivElement>(null);\n const secondaryMetaDataRef = useRef<HTMLDivElement>(null);\n const primaryMetaDataRef = useRef<HTMLDivElement>(null);\n const observerRef = useRef<ResizeObserver>();\n const primaryMetaLengths = useRef<number[]>([]);\n const secondaryMetaLengths = useRef<number[]>([]);\n\n // Memos\n const secondaryActionWidth = useMemo(\n () => (secondaryAction ? secondaryAction.primary.length * chToPxConversionFactor + 44 : 0),\n [secondaryAction]\n );\n\n // Page actions component\n const actions = useMemo(() => {\n const additionalActionsData = [...additionalActions];\n const secondaryActionsData =\n showSecondaryAction || additionalActionsData.length === 0 ? secondaryAction : undefined;\n if (additionalActionsData.length > 0 && secondaryAction && !showSecondaryAction) {\n additionalActionsData.unshift(secondaryAction);\n }\n\n return (\n <HeaderActionButtons\n additionalActions={additionalActionsData}\n primaryAction={primaryAction}\n secondaryAction={secondaryActionsData}\n testIds={testIds}\n progress={progress}\n animatePrimaryButton\n closeAction={closeAction}\n />\n );\n }, [\n showSecondaryAction,\n primaryAction,\n secondaryAction,\n additionalActions,\n testIds,\n progress,\n closeAction\n ]);\n\n // CB to be run on resize observer\n const showOrHideElements = useCallback(() => {\n // Logic to show or hide primary metadata\n const headerWidth = headerContentRef.current?.offsetWidth ?? 0;\n const titleWidth = pageTitleContainerRef.current?.offsetWidth ?? 0;\n let actionsWidth = actionsContainerRef.current?.offsetWidth ?? 0;\n let newCountOfPrimaryMetaToShow = countOfPrimaryMetaToShow;\n let newCountOfSecondaryMetaToShow = countOfSecondaryMetaToShow;\n\n if (primaryMetaLengths.current.length > 0 && primaryMetaDataRef.current) {\n if (countOfSecondaryMetaToShow === 0) {\n const availableSpace = headerWidth - titleWidth - actionsWidth - 48;\n const closestIndex = primaryMetaLengths.current.findIndex(i => i > availableSpace);\n newCountOfPrimaryMetaToShow =\n closestIndex === -1 ? primaryMetaLengths.current.length : closestIndex;\n } else {\n newCountOfPrimaryMetaToShow = primaryMetaLengths.current.length;\n }\n }\n\n // Logic to show and hide secondary metadata items\n if (\n secondaryMetaLengths.current.length !== 0 &&\n secondaryMetaDataRef.current &&\n primaryMetaDataRef.current &&\n primaryMetaLengths.current.length === newCountOfPrimaryMetaToShow\n ) {\n const availableSpace =\n primaryMetaDataRef.current.offsetWidth -\n (primaryMetaLengths.current[primaryMetaLengths.current.length - 1] ?? 0);\n if (availableSpace > secondaryMetaLengths.current[secondaryMetaLengths.current.length - 1]) {\n newCountOfSecondaryMetaToShow = secondaryMetaLengths.current.length;\n } else if (availableSpace < secondaryMetaLengths.current[0]) {\n newCountOfSecondaryMetaToShow = 0;\n } else {\n const closestIndex = secondaryMetaLengths.current.findIndex(i => i > availableSpace);\n newCountOfSecondaryMetaToShow =\n closestIndex === -1 ? secondaryMetaLengths.current.length : closestIndex;\n }\n }\n\n // Logic to show or hide secondary action\n actionsWidth =\n secondaryAction && showSecondaryAction ? actionsWidth : actionsWidth + secondaryActionWidth;\n setShowSecondaryAction(!!secondaryAction && headerWidth >= titleWidth + actionsWidth + 25);\n setCountOfPrimaryMetaToShow(newCountOfPrimaryMetaToShow);\n setCountOfSecondaryMetaToShow(newCountOfSecondaryMetaToShow);\n\n if (!headerContentRef.current?.offsetWidth) {\n setCountOfPrimaryMetaToShow(primaryMetaLengths.current.length);\n setShowSecondaryAction(!!secondaryAction);\n setCountOfSecondaryMetaToShow(secondaryMetaLengths.current.length);\n }\n\n onHeightChange?.(headerRef.current?.offsetHeight ?? 0);\n }, [\n countOfSecondaryMetaToShow,\n secondaryMetaLengths,\n showSecondaryAction,\n primaryMetaLengths,\n countOfPrimaryMetaToShow,\n onHeightChange\n ]);\n\n useLayoutEffect(() => {\n primaryMetaLengths.current = [];\n secondaryMetaLengths.current = [];\n const primaryMetaDataLength = metadata.primary?.length ?? 0;\n primaryMetaDataRef.current?.querySelectorAll('div:has(>dt)').forEach((el, index) => {\n if (index < primaryMetaDataLength) {\n primaryMetaLengths.current.push(\n (index === 0 ? el.clientWidth : el.clientWidth + primaryMetaLengths.current[index - 1]) +\n 16\n );\n } else {\n secondaryMetaLengths.current.push(\n (index === primaryMetaDataLength\n ? el.clientWidth\n : el.clientWidth + secondaryMetaLengths.current[index - primaryMetaDataLength - 1]) + 16\n );\n }\n });\n }, [metadata.primary, metadata.secondary]);\n\n // Resize observer for header\n useLayoutEffect(() => {\n if (observerRef.current) {\n observerRef.current.disconnect();\n }\n if (headerContentRef.current) {\n observerRef.current = new ResizeObserver(() => showOrHideElements());\n observerRef.current.observe(headerContentRef.current);\n }\n return () => observerRef.current?.disconnect();\n }, [showOrHideElements]);\n\n // Run CB once on mount incase if component is mounted initially on resized screen\n useLayoutEffect(() => {\n showOrHideElements();\n }, []);\n\n return (\n <Flex\n as={StyledHeader}\n container={{\n direction: 'column',\n rowGap: 1\n }}\n ref={headerRef}\n >\n <Flex\n container={{\n direction: 'row',\n alignItems: 'center',\n colGap: countOfPrimaryMetaToShow > 0 ? 3 : 1.5\n }}\n ref={headerContentRef}\n >\n <Flex\n ref={pageTitleContainerRef}\n container={{ direction: 'row', colGap: 1, alignItems: 'center' }}\n item={{ shrink: showSecondaryAction || countOfPrimaryMetaToShow > 0 ? 0 : 1 }}\n >\n {visual && <IconTile testId={testIds.visual} {...visual} size='xl' />}\n <Flex\n as={StyledTitleContainer}\n container={{\n alignItems: 'start',\n direction: 'column',\n wrap: 'wrap'\n }}\n >\n {type.name && <PrimaryHeaderText type={type} testId={testIds.type} />}\n <StyledText\n showEllipsis={!showSecondaryAction && countOfPrimaryMetaToShow === 0}\n data-testid={testIds.title}\n variant='h1'\n ref={setPageTitleEl}\n >\n {title}\n </StyledText>\n <Tooltip target={pageTitleEl} smart showDelay='none' hideDelay='none'>\n {title}\n </Tooltip>\n </Flex>\n </Flex>\n\n <Flex\n container={{\n direction: 'row',\n colGap: countOfSecondaryMetaToShow > 0 || countOfPrimaryMetaToShow > 1 ? 3 : 0,\n alignItems: 'center'\n }}\n item={{ grow: 1, shrink: 1 }}\n ref={primaryMetaDataRef}\n as='dl'\n >\n {metadata.primary?.slice(0, countOfPrimaryMetaToShow).map(metaItem => (\n <Flex\n key={metaItem.name}\n as={StyledStackedFieldValue}\n container={{ direction: 'column' }}\n item={{ shrink: 0 }}\n data-testid={testIds.primaryMetaData}\n >\n <StyledLabel as={StyledFieldName}>{metaItem.name}</StyledLabel>\n {metaItem.onClick ? (\n <dd>\n <StyledPrimaryMetaButton\n ref={setPrimaryMetaEl}\n variant='link'\n onClick={metaItem.onClick}\n data-testid={testId}\n >\n {metaItem.value}\n </StyledPrimaryMetaButton>\n </dd>\n ) : (\n <StyledText ref={setPrimaryMetaEl} variant='h1' forwardedAs='dd'>\n {metaItem.value}\n </StyledText>\n )}\n <Tooltip target={primaryMetaEl} smart showDelay='none' hideDelay='none'>\n {metaItem.value}\n </Tooltip>\n </Flex>\n ))}\n\n {metadata.secondary && (\n <Flex\n container={{ direction: 'row', colGap: 2, justify: 'end' }}\n item={{ grow: 1, shrink: 1 }}\n ref={secondaryMetaDataRef}\n data-testid={testIds.secondaryMetaData}\n >\n {metadata.secondary.slice(0, countOfSecondaryMetaToShow).map(metaItem => (\n <Flex as={StyledStackedFieldValue} item={{ shrink: 0 }} key={metaItem.name}>\n <StyledLabel as={StyledFieldName}>{metaItem.name}</StyledLabel>\n <StyledText as='dd'>{metaItem.value}</StyledText>\n </Flex>\n ))}\n </Flex>\n )}\n </Flex>\n\n <Flex\n ref={actionsContainerRef}\n container={{\n direction: 'row',\n colGap: 2,\n justify: 'center'\n }}\n item={{ alignSelf: 'center', shrink: 0 }}\n >\n {metadata.additional.length > 0 && (\n <Flex container={{ direction: 'row', colGap: 2, alignItems: 'center' }}>\n <AdditionalInfo data-testid={testIds.additionalInfoIcon} heading={title}>\n <Flex\n container={{\n direction: 'column',\n alignItems: 'start',\n gap: 1\n }}\n item={{ grow: 1, alignSelf: 'stretch' }}\n >\n <FieldValueList\n fields={metadata.additional}\n variant='inline'\n testId={testIds.metaData}\n />\n {description && (\n <StyledStackedFieldValue>\n <StyledLabel as={StyledFieldName}>{t('description')}</StyledLabel>\n <ShowMoreLess lines={3}>{description}</ShowMoreLess>\n </StyledStackedFieldValue>\n )}\n </Flex>\n </AdditionalInfo>\n </Flex>\n )}\n\n {actions}\n </Flex>\n </Flex>\n\n {description && (\n <StyledDescription>\n <ShowMoreLess lines={2}>\n <Text>{description}</Text>\n </ShowMoreLess>\n </StyledDescription>\n )}\n </Flex>\n );\n};\n\nexport default withTestIds(ConstructPageHeader, getPageHeaderTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"ConstructPageHeader.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/ConstructPageTemplate/ConstructPageHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useRef, useState, useLayoutEffect, useCallback } from 'react';\n\nimport {\n Text,\n Flex,\n useTestIds,\n withTestIds,\n useElement,\n Tooltip,\n Button,\n ShowMoreLess,\n StyledStackedFieldValue,\n StyledLabel,\n StyledFieldName,\n FieldValueList,\n AdditionalInfo,\n useI18n,\n useChToPxConversionFactor,\n type TestIdProp\n} from '@pega/cosmos-react-core';\n\nimport IconTile from '../../IconTile';\nimport { getPageHeaderTestIds } from '../PageTemplates.test-ids';\nimport type { ConstructPageTemplateProps, PageTemplateProps } from '../PageTemplate.types';\nimport HeaderActionButtons from '../HeaderActionButtons';\nimport {\n StyledText,\n StyledDescription,\n StyledPrimaryMetaButton,\n StyledHeader,\n StyledTitleContainer\n} from '../PageTemplate.styles';\n\ntype ConstructPageHeaderProps = ConstructPageTemplateProps['header'] &\n Pick<PageTemplateProps, 'progress'> &\n TestIdProp & {\n onHeightChange?: (height: number) => void;\n };\n\nexport const PrimaryHeaderText = ({\n type: { href, onClick, name },\n testId\n}: {\n type: ConstructPageHeaderProps['type'];\n testId?: TestIdProp['testId'];\n}) => {\n if (href || onClick) {\n return (\n <Button variant='link' href={href} onClick={onClick} data-testid={testId}>\n {name}\n </Button>\n );\n }\n return <StyledLabel as={StyledText}>{name}</StyledLabel>;\n};\n\nconst ConstructPageHeader = ({\n testId,\n title,\n primaryAction,\n additionalActions = [],\n metadata = { additional: [] },\n visual,\n type,\n description,\n secondaryAction,\n progress,\n onHeightChange,\n closeAction\n}: ConstructPageHeaderProps) => {\n // States\n const [countOfSecondaryMetaToShow, setCountOfSecondaryMetaToShow] = useState<number>(\n metadata?.secondary?.length ?? 0\n );\n const [countOfPrimaryMetaToShow, setCountOfPrimaryMetaToShow] = useState<number>(\n metadata.primary?.length ?? 0\n );\n const [showSecondaryAction, setShowSecondaryAction] = useState(true);\n const [pageTitleEl, setPageTitleEl] = useElement();\n const [primaryMetaEl, setPrimaryMetaEl] = useElement();\n\n // Hooks\n const chToPxConversionFactor = useChToPxConversionFactor();\n const testIds = useTestIds(testId, getPageHeaderTestIds);\n const t = useI18n();\n\n // Refs\n const headerRef = useRef<HTMLDivElement>(null);\n const headerContentRef = useRef<HTMLDivElement>(null);\n const pageTitleContainerRef = useRef<HTMLDivElement>(null);\n const actionsContainerRef = useRef<HTMLDivElement>(null);\n const secondaryMetaDataRef = useRef<HTMLDivElement>(null);\n const primaryMetaDataRef = useRef<HTMLDivElement>(null);\n const observerRef = useRef<ResizeObserver>();\n const primaryMetaLengths = useRef<number[]>([]);\n const secondaryMetaLengths = useRef<number[]>([]);\n\n // Memos\n const secondaryActionWidth = useMemo(\n () => (secondaryAction ? secondaryAction.primary.length * chToPxConversionFactor + 44 : 0),\n [secondaryAction]\n );\n\n // Page actions component\n const actions = useMemo(() => {\n const additionalActionsData = [...additionalActions];\n const secondaryActionsData =\n showSecondaryAction || additionalActionsData.length === 0 ? secondaryAction : undefined;\n if (additionalActionsData.length > 0 && secondaryAction && !showSecondaryAction) {\n additionalActionsData.unshift(secondaryAction);\n }\n\n return (\n <HeaderActionButtons\n additionalActions={additionalActionsData}\n primaryAction={primaryAction}\n secondaryAction={secondaryActionsData}\n testIds={testIds}\n progress={progress}\n animatePrimaryButton\n closeAction={closeAction}\n />\n );\n }, [\n showSecondaryAction,\n primaryAction,\n secondaryAction,\n additionalActions,\n testIds,\n progress,\n closeAction\n ]);\n\n // CB to be run on resize observer\n const showOrHideElements = useCallback(() => {\n // Logic to show or hide primary metadata\n const headerWidth = headerContentRef.current?.offsetWidth ?? 0;\n const titleWidth = pageTitleContainerRef.current?.offsetWidth ?? 0;\n let actionsWidth = actionsContainerRef.current?.offsetWidth ?? 0;\n let newCountOfPrimaryMetaToShow = countOfPrimaryMetaToShow;\n let newCountOfSecondaryMetaToShow = countOfSecondaryMetaToShow;\n\n if (primaryMetaLengths.current.length > 0 && primaryMetaDataRef.current) {\n if (countOfSecondaryMetaToShow === 0) {\n const availableSpace = headerWidth - titleWidth - actionsWidth - 48;\n const closestIndex = primaryMetaLengths.current.findIndex(i => i > availableSpace);\n newCountOfPrimaryMetaToShow =\n closestIndex === -1 ? primaryMetaLengths.current.length : closestIndex;\n } else {\n newCountOfPrimaryMetaToShow = primaryMetaLengths.current.length;\n }\n }\n\n // Logic to show and hide secondary metadata items\n if (\n secondaryMetaLengths.current.length !== 0 &&\n secondaryMetaDataRef.current &&\n primaryMetaDataRef.current &&\n primaryMetaLengths.current.length === newCountOfPrimaryMetaToShow\n ) {\n const availableSpace =\n primaryMetaDataRef.current.offsetWidth -\n (primaryMetaLengths.current[primaryMetaLengths.current.length - 1] ?? 0);\n if (availableSpace > secondaryMetaLengths.current[secondaryMetaLengths.current.length - 1]) {\n newCountOfSecondaryMetaToShow = secondaryMetaLengths.current.length;\n } else if (availableSpace < secondaryMetaLengths.current[0]) {\n newCountOfSecondaryMetaToShow = 0;\n } else {\n const closestIndex = secondaryMetaLengths.current.findIndex(i => i > availableSpace);\n newCountOfSecondaryMetaToShow =\n closestIndex === -1 ? secondaryMetaLengths.current.length : closestIndex;\n }\n }\n\n // Logic to show or hide secondary action\n actionsWidth =\n secondaryAction && showSecondaryAction ? actionsWidth : actionsWidth + secondaryActionWidth;\n setShowSecondaryAction(!!secondaryAction && headerWidth >= titleWidth + actionsWidth + 25);\n setCountOfPrimaryMetaToShow(newCountOfPrimaryMetaToShow);\n setCountOfSecondaryMetaToShow(newCountOfSecondaryMetaToShow);\n\n if (!headerContentRef.current?.offsetWidth) {\n setCountOfPrimaryMetaToShow(primaryMetaLengths.current.length);\n setShowSecondaryAction(!!secondaryAction);\n setCountOfSecondaryMetaToShow(secondaryMetaLengths.current.length);\n }\n\n onHeightChange?.(headerRef.current?.offsetHeight ?? 0);\n }, [\n countOfSecondaryMetaToShow,\n secondaryMetaLengths,\n showSecondaryAction,\n primaryMetaLengths,\n countOfPrimaryMetaToShow,\n onHeightChange\n ]);\n\n useLayoutEffect(() => {\n primaryMetaLengths.current = [];\n secondaryMetaLengths.current = [];\n const primaryMetaDataLength = metadata.primary?.length ?? 0;\n primaryMetaDataRef.current?.querySelectorAll('div:has(>dt)').forEach((el, index) => {\n if (index < primaryMetaDataLength) {\n primaryMetaLengths.current.push(\n (index === 0 ? el.clientWidth : el.clientWidth + primaryMetaLengths.current[index - 1]) +\n 16\n );\n } else {\n secondaryMetaLengths.current.push(\n (index === primaryMetaDataLength\n ? el.clientWidth\n : el.clientWidth + secondaryMetaLengths.current[index - primaryMetaDataLength - 1]) + 16\n );\n }\n });\n }, [metadata.primary, metadata.secondary]);\n\n // Resize observer for header\n useLayoutEffect(() => {\n if (observerRef.current) {\n observerRef.current.disconnect();\n }\n if (headerContentRef.current) {\n observerRef.current = new ResizeObserver(() => showOrHideElements());\n observerRef.current.observe(headerContentRef.current);\n }\n return () => observerRef.current?.disconnect();\n }, [showOrHideElements]);\n\n // Run CB once on mount incase if component is mounted initially on resized screen\n useLayoutEffect(() => {\n showOrHideElements();\n }, []);\n\n return (\n <Flex\n as={StyledHeader}\n container={{\n direction: 'column',\n rowGap: 1\n }}\n ref={headerRef}\n >\n <Flex\n container={{\n direction: 'row',\n alignItems: 'center',\n colGap: countOfPrimaryMetaToShow > 0 ? 3 : 1.5\n }}\n ref={headerContentRef}\n >\n <Flex\n ref={pageTitleContainerRef}\n container={{ direction: 'row', colGap: 1, alignItems: 'center' }}\n item={{ shrink: showSecondaryAction || countOfPrimaryMetaToShow > 0 ? 0 : 1 }}\n >\n {visual && <IconTile testId={testIds.visual} {...visual} size='xl' />}\n <Flex\n as={StyledTitleContainer}\n container={{\n alignItems: 'start',\n direction: 'column',\n wrap: 'wrap'\n }}\n >\n {type.name && <PrimaryHeaderText type={type} testId={testIds.type} />}\n <StyledText\n showEllipsis={!showSecondaryAction && countOfPrimaryMetaToShow === 0}\n data-testid={testIds.title}\n variant='h1'\n ref={setPageTitleEl}\n >\n {title}\n </StyledText>\n <Tooltip target={pageTitleEl} smart showDelay='none' hideDelay='none'>\n {title}\n </Tooltip>\n </Flex>\n </Flex>\n\n <Flex\n container={{\n direction: 'row',\n colGap: countOfSecondaryMetaToShow > 0 || countOfPrimaryMetaToShow > 1 ? 3 : 0,\n alignItems: 'center'\n }}\n item={{ grow: 1, shrink: 1 }}\n ref={primaryMetaDataRef}\n as='dl'\n >\n {metadata.primary?.slice(0, countOfPrimaryMetaToShow).map(metaItem => (\n <Flex\n key={metaItem.name}\n as={StyledStackedFieldValue}\n container={{ direction: 'column' }}\n item={{ shrink: 0 }}\n data-testid={testIds.primaryMetaData}\n >\n <StyledLabel as={StyledFieldName}>{metaItem.name}</StyledLabel>\n {metaItem.onClick ? (\n <dd>\n <StyledPrimaryMetaButton\n ref={setPrimaryMetaEl}\n variant='link'\n onClick={metaItem.onClick}\n data-testid={testId}\n >\n {metaItem.value}\n </StyledPrimaryMetaButton>\n </dd>\n ) : (\n <StyledText ref={setPrimaryMetaEl} variant='h1' forwardedAs='dd'>\n {metaItem.value}\n </StyledText>\n )}\n <Tooltip target={primaryMetaEl} smart showDelay='none' hideDelay='none'>\n {metaItem.value}\n </Tooltip>\n </Flex>\n ))}\n\n {metadata.secondary && (\n <Flex\n container={{ direction: 'row', colGap: 2, justify: 'end' }}\n item={{ grow: 1, shrink: 1 }}\n ref={secondaryMetaDataRef}\n data-testid={testIds.secondaryMetaData}\n >\n {metadata.secondary.slice(0, countOfSecondaryMetaToShow).map(metaItem => (\n <Flex as={StyledStackedFieldValue} item={{ shrink: 0 }} key={metaItem.name}>\n <StyledLabel as={StyledFieldName}>{metaItem.name}</StyledLabel>\n <StyledText as='dd'>{metaItem.value}</StyledText>\n </Flex>\n ))}\n </Flex>\n )}\n </Flex>\n\n <Flex\n ref={actionsContainerRef}\n container={{\n direction: 'row',\n colGap: 2,\n justify: 'center'\n }}\n item={{ alignSelf: 'center', shrink: 0 }}\n >\n {metadata.additional.length > 0 && (\n <Flex container={{ direction: 'row', colGap: 2, alignItems: 'center' }}>\n <AdditionalInfo data-testid={testIds.additionalInfoIcon} heading={title}>\n <Flex\n container={{\n direction: 'column',\n alignItems: 'start',\n gap: 1\n }}\n item={{ grow: 1, alignSelf: 'stretch' }}\n >\n <FieldValueList\n fields={metadata.additional}\n variant='inline'\n testId={testIds.metaData}\n />\n {description && (\n <StyledStackedFieldValue>\n <StyledLabel as={StyledFieldName}>{t('description')}</StyledLabel>\n <StyledDescription>\n <ShowMoreLess lines={3}>{description}</ShowMoreLess>\n </StyledDescription>\n </StyledStackedFieldValue>\n )}\n </Flex>\n </AdditionalInfo>\n </Flex>\n )}\n\n {actions}\n </Flex>\n </Flex>\n\n {description && (\n <StyledDescription>\n <ShowMoreLess lines={2}>\n <Text>{description}</Text>\n </ShowMoreLess>\n </StyledDescription>\n )}\n </Flex>\n );\n};\n\nexport default withTestIds(ConstructPageHeader, getPageHeaderTestIds);\n"]}
|
|
@@ -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,EAOP,MAAM,yBAAyB,CAAC;AAWjC,eAAO,MAAM,gBAAgB,6NAiD3B,CAAC;AAIH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sOAEzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,
|
|
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,6NAiD3B,CAAC;AAIH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sOAEzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,6NAE7B,CAAC;AAGF,eAAO,MAAM,mBAAmB,6NA+B/B,CAAC;AAIF,eAAO,MAAM,+BAA+B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sOAW1C,CAAC;AAKH,eAAO,MAAM,kBAAkB,6NAa9B,CAAC;AAGF,eAAO,MAAM,YAAY,6NAcvB,CAAC;AAIH,eAAO,MAAM,oBAAoB,6NAEhC,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;AAIH,eAAO,MAAM,0BAA0B;yBAAqC,OAAO;YAUlF,CAAC"}
|
|
@@ -52,7 +52,9 @@ export const StyledActions = styled(Flex) `
|
|
|
52
52
|
margin-block-start: auto;
|
|
53
53
|
`;
|
|
54
54
|
// Common styles
|
|
55
|
-
export const StyledDescription = styled.div
|
|
55
|
+
export const StyledDescription = styled.div `
|
|
56
|
+
word-break: break-word;
|
|
57
|
+
`;
|
|
56
58
|
// Inventory page styles
|
|
57
59
|
export const StyledInventoryPage = styled.div(({ theme: { base: { spacing, palette: { 'primary-background': primaryBackground } } } }) => {
|
|
58
60
|
return css `
|
|
@@ -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,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,OAAO,EACL,IAAI,EACJ,gBAAgB,EAChB,MAAM,EACN,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,wBAAwB,EACxB,IAAI,EACJ,WAAW,EACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,YAAY,EACZ,uBAAuB,EACxB,MAAM,6DAA6D,CAAC;AACrE,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,aAAa,EAAE,UAAU,EACzB,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,EAC7B,OAAO,EACP,OAAO,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACvC,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;kBACM,cAAc,CAAC,IAAI,EAAE,KAAK,CAAC;qBACxB,YAAY;2BACN,OAAO;;;;eAInB,KAAK;;;;;;;MAOd,YAAY;eACH,KAAK;;;MAGd,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,CAAA,
|
|
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.styles';\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`\n word-break: break-word;\n`;\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 border: solid 0.0625rem ${transparentize(0.5, theme.base.palette['secondary-background'])};\n border-block-end-color: rgba(0, 0, 0, 0.1);\n border-inline-end-color: rgba(0, 0, 0, 0.1);\n backdrop-filter: blur(calc(0.25 * ${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\nexport const StyledPrimaryActionWrapper = styled.div<{ hasAdditionalAction: boolean }>(\n ({ theme, hasAdditionalAction }) => {\n return css`\n margin-inline-end: ${hasAdditionalAction ? theme.base.spacing : 0};\n\n ${StyledButton} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n `;\n }\n);\n\nStyledPrimaryActionWrapper.defaultProps = defaultThemeProp;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-build",
|
|
3
|
-
"version": "9.0.0-build.29.
|
|
3
|
+
"version": "9.0.0-build.29.21",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"author": "Pegasystems",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
17
|
"@dagrejs/dagre": "^3.0.0",
|
|
18
|
-
"@pega/cosmos-react-core": "9.0.0-build.29.
|
|
19
|
-
"@pega/cosmos-react-dnd": "9.0.0-build.29.
|
|
20
|
-
"@pega/cosmos-react-rte": "9.0.0-build.29.
|
|
18
|
+
"@pega/cosmos-react-core": "9.0.0-build.29.21",
|
|
19
|
+
"@pega/cosmos-react-dnd": "9.0.0-build.29.21",
|
|
20
|
+
"@pega/cosmos-react-rte": "9.0.0-build.29.21",
|
|
21
21
|
"@types/codemirror": "^5.60.15",
|
|
22
22
|
"@types/react": "^17.0.62 || ^18.3.3",
|
|
23
23
|
"@types/react-dom": "^17.0.20 || ^18.3.0",
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"react": "^17.0.0 || ^18.0.0",
|
|
28
28
|
"react-codemirror2": "^8.0.1",
|
|
29
29
|
"react-dom": "^17.0.0 || ^18.0.0",
|
|
30
|
-
"styled-components": "
|
|
30
|
+
"styled-components": "~6.3.11"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
33
|
"@storybook/addon-actions": "~8.2.9",
|