@flipdish/portal-library 1.0.71 → 1.0.73
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/dist/components/index.cjs.js +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +1 -1
- package/dist/components/ui/PageLayout/PageLayout.cjs.js +1 -1
- package/dist/components/ui/PageLayout/PageLayout.cjs.js.map +1 -1
- package/dist/components/ui/PageLayout/PageLayout.js +1 -1
- package/dist/components/ui/PageLayout/PageLayout.js.map +1 -1
- package/dist/components/ui/Tooltip/Tooltip.cjs.js +2 -0
- package/dist/components/ui/Tooltip/Tooltip.cjs.js.map +1 -0
- package/dist/components/ui/Tooltip/Tooltip.d.ts +11 -0
- package/dist/components/ui/Tooltip/Tooltip.js +2 -0
- package/dist/components/ui/Tooltip/Tooltip.js.map +1 -0
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("./themes/flipdishPublicTheme.cjs.js"),i=require("./ui/NotFoundPage/NotFoundPage.cjs.js"),r=require("./ui/FlipdishStaffContainer/FlipdishStaffContainer.cjs.js"),t=require("./ui/PageLayout/PageLayout.cjs.js"),
|
|
1
|
+
"use strict";var e=require("./themes/flipdishPublicTheme.cjs.js"),i=require("./ui/NotFoundPage/NotFoundPage.cjs.js"),r=require("./ui/FlipdishStaffContainer/FlipdishStaffContainer.cjs.js"),t=require("./ui/PageLayout/PageLayout.cjs.js"),o=require("./ui/PortalMock/PortalMock.cjs.js"),s=require("./ui/LazyComponent/LazyComponent.cjs.js"),c=require("./ui/Spacer/Spacer.cjs.js"),u=require("./ui/Chip/Chip.cjs.js"),n=require("./ui/Switch/Switch.cjs.js"),a=require("./ui/Tooltip/Tooltip.cjs.js"),l=require("./ui/Form/utilities/formValidation.cjs.js"),d=require("./ui/Form/GenericAutocompleteField.cjs.js"),p=require("./ui/Form/GenericFormContainer.cjs.js"),j=require("./ui/Form/GenericTextField.cjs.js"),m=require("./ui/Form/PaginatedAutocompleteField.cjs.js"),x=require("./ui/GenericDatePickerField/GenericDatePickerField.cjs.js"),q=require("./ui/GenericDateTimePickerField/GenericDateTimePickerField.cjs.js"),T=require("./ui/GenericRadioButtons/GenericRadioButtons.cjs.js"),F=require("./ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.cjs.js"),G=require("./ui/GenericTable/GenericTable.cjs.js"),L=require("./ui/GenericTableBody/GenericTableBody.cjs.js"),h=require("./ui/GenericTableBodyRow/GenericTableBodyRow.cjs.js"),P=require("./ui/GenericTableTitle/GenericTableTitle.cjs.js"),g=require("./ui/ListItemLink/ListItemLink.cjs.js"),b=require("./ui/ListItemLinkButton/ListItemLinkButton.cjs.js"),k=require("./ui/NoResults/NoResults.cjs.js"),I=require("@mui/icons-material/Search"),y=require("@mui/icons-material/CalendarToday"),f=require("@mui/icons-material/AccessTime"),B=require("@mui/icons-material/Done"),C=require("./custom-hooks/useRenderValidText.cjs.js"),R=require("./custom-hooks/useMicroFrontendAttributes.cjs.js"),S=require("./renderUtilities/renderUtilities.cjs.js"),A=require("./genericUtilities/index.cjs.js");exports.flipdishPublicTheme=e,exports.NotFoundPage=i,exports.FlipdishStaffContainer=r,exports.PageLayout=t.default,exports.PortalMock=o,exports.LazyComponent=s,exports.Spacer=c,exports.Chip=u.default,exports.Switch=n,exports.Tooltip=a,exports.formikValidate=l.formikValidate,exports.GenericAutocompleteField=d,exports.GenericFormContainer=p,exports.GenericTextField=j,exports.PaginatedAutocompleteField=m,exports.GenericDatePickerField=x,exports.GenericDateTimePickerField=q,exports.GenericRadioButtons=T,exports.DateTimeLocalizationProvider=F,exports.GenericTable=G,exports.GenericTableBody=L,exports.GenericTableBodyRow=h,exports.GenericTableTitle=P,exports.ListItemLink=g,exports.ListItemLinkButton=b.ListItemLinkButton,exports.NoResults=k,exports.SearchIcon=I,exports.CalendarTodayIcon=y,exports.AccessTimeIcon=f,exports.DoneIcon=B,exports.useRenderValidText=C,exports.useMicroFrontendAttributes=R,exports.getAppId=S.getAppId,exports.getBrandId=S.getBrandId,exports.getIsFlipdishStaff=S.getIsFlipdishStaff,exports.getMicroFrontendAttribute=S.getMicroFrontendAttribute,exports.getOrgId=S.getOrgId,exports.lazyWithRetry=S.lazyWithRetry,exports.debounce=A.debounce;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -7,6 +7,7 @@ export { default as LazyComponent } from './ui/LazyComponent/LazyComponent.js';
|
|
|
7
7
|
export { default as Spacer } from './ui/Spacer/Spacer.js';
|
|
8
8
|
export { default as Chip } from './ui/Chip/Chip.js';
|
|
9
9
|
export { default as Switch } from './ui/Switch/Switch.js';
|
|
10
|
+
export { default as Tooltip } from './ui/Tooltip/Tooltip.js';
|
|
10
11
|
export { formikValidate } from './ui/Form/utilities/formValidation.js';
|
|
11
12
|
export { default as GenericAutocompleteField } from './ui/Form/GenericAutocompleteField.js';
|
|
12
13
|
export { default as GenericFormContainer } from './ui/Form/GenericFormContainer.js';
|
package/dist/components/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export{default as flipdishPublicTheme}from"./themes/flipdishPublicTheme.js";export{default as NotFoundPage}from"./ui/NotFoundPage/NotFoundPage.js";export{default as FlipdishStaffContainer}from"./ui/FlipdishStaffContainer/FlipdishStaffContainer.js";export{default as PageLayout}from"./ui/PageLayout/PageLayout.js";export{default as PortalMock}from"./ui/PortalMock/PortalMock.js";export{default as LazyComponent}from"./ui/LazyComponent/LazyComponent.js";export{default as Spacer}from"./ui/Spacer/Spacer.js";export{default as Chip}from"./ui/Chip/Chip.js";export{default as Switch}from"./ui/Switch/Switch.js";export{formikValidate}from"./ui/Form/utilities/formValidation.js";export{default as GenericAutocompleteField}from"./ui/Form/GenericAutocompleteField.js";export{default as GenericFormContainer}from"./ui/Form/GenericFormContainer.js";export{default as GenericTextField}from"./ui/Form/GenericTextField.js";export{default as PaginatedAutocompleteField}from"./ui/Form/PaginatedAutocompleteField.js";export{default as GenericDatePickerField}from"./ui/GenericDatePickerField/GenericDatePickerField.js";export{default as GenericDateTimePickerField}from"./ui/GenericDateTimePickerField/GenericDateTimePickerField.js";export{default as GenericRadioButtons}from"./ui/GenericRadioButtons/GenericRadioButtons.js";export{default as DateTimeLocalizationProvider}from"./ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.js";export{default as GenericTable}from"./ui/GenericTable/GenericTable.js";export{default as GenericTableBody}from"./ui/GenericTableBody/GenericTableBody.js";export{default as GenericTableBodyRow}from"./ui/GenericTableBodyRow/GenericTableBodyRow.js";export{default as GenericTableTitle}from"./ui/GenericTableTitle/GenericTableTitle.js";export{default as ListItemLink}from"./ui/ListItemLink/ListItemLink.js";export{ListItemLinkButton}from"./ui/ListItemLinkButton/ListItemLinkButton.js";export{default as NoResults}from"./ui/NoResults/NoResults.js";export{default as SearchIcon}from"@mui/icons-material/Search";export{default as CalendarTodayIcon}from"@mui/icons-material/CalendarToday";export{default as AccessTimeIcon}from"@mui/icons-material/AccessTime";export{default as DoneIcon}from"@mui/icons-material/Done";export{default as useRenderValidText}from"./custom-hooks/useRenderValidText.js";export{default as useMicroFrontendAttributes}from"./custom-hooks/useMicroFrontendAttributes.js";export{getAppId,getBrandId,getIsFlipdishStaff,getMicroFrontendAttribute,getOrgId,lazyWithRetry}from"./renderUtilities/renderUtilities.js";export{debounce}from"./genericUtilities/index.js";
|
|
1
|
+
export{default as flipdishPublicTheme}from"./themes/flipdishPublicTheme.js";export{default as NotFoundPage}from"./ui/NotFoundPage/NotFoundPage.js";export{default as FlipdishStaffContainer}from"./ui/FlipdishStaffContainer/FlipdishStaffContainer.js";export{default as PageLayout}from"./ui/PageLayout/PageLayout.js";export{default as PortalMock}from"./ui/PortalMock/PortalMock.js";export{default as LazyComponent}from"./ui/LazyComponent/LazyComponent.js";export{default as Spacer}from"./ui/Spacer/Spacer.js";export{default as Chip}from"./ui/Chip/Chip.js";export{default as Switch}from"./ui/Switch/Switch.js";export{default as Tooltip}from"./ui/Tooltip/Tooltip.js";export{formikValidate}from"./ui/Form/utilities/formValidation.js";export{default as GenericAutocompleteField}from"./ui/Form/GenericAutocompleteField.js";export{default as GenericFormContainer}from"./ui/Form/GenericFormContainer.js";export{default as GenericTextField}from"./ui/Form/GenericTextField.js";export{default as PaginatedAutocompleteField}from"./ui/Form/PaginatedAutocompleteField.js";export{default as GenericDatePickerField}from"./ui/GenericDatePickerField/GenericDatePickerField.js";export{default as GenericDateTimePickerField}from"./ui/GenericDateTimePickerField/GenericDateTimePickerField.js";export{default as GenericRadioButtons}from"./ui/GenericRadioButtons/GenericRadioButtons.js";export{default as DateTimeLocalizationProvider}from"./ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.js";export{default as GenericTable}from"./ui/GenericTable/GenericTable.js";export{default as GenericTableBody}from"./ui/GenericTableBody/GenericTableBody.js";export{default as GenericTableBodyRow}from"./ui/GenericTableBodyRow/GenericTableBodyRow.js";export{default as GenericTableTitle}from"./ui/GenericTableTitle/GenericTableTitle.js";export{default as ListItemLink}from"./ui/ListItemLink/ListItemLink.js";export{ListItemLinkButton}from"./ui/ListItemLinkButton/ListItemLinkButton.js";export{default as NoResults}from"./ui/NoResults/NoResults.js";export{default as SearchIcon}from"@mui/icons-material/Search";export{default as CalendarTodayIcon}from"@mui/icons-material/CalendarToday";export{default as AccessTimeIcon}from"@mui/icons-material/AccessTime";export{default as DoneIcon}from"@mui/icons-material/Done";export{default as useRenderValidText}from"./custom-hooks/useRenderValidText.js";export{default as useMicroFrontendAttributes}from"./custom-hooks/useMicroFrontendAttributes.js";export{getAppId,getBrandId,getIsFlipdishStaff,getMicroFrontendAttribute,getOrgId,lazyWithRetry}from"./renderUtilities/renderUtilities.js";export{debounce}from"./genericUtilities/index.js";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime")
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("react");var i=require("@mui/icons-material/Add"),t=require("@mui/icons-material/ArrowBack"),n=require("@mui/material/Grid"),r=require("@mui/material/IconButton"),a=require("@mui/material/styles"),s=require("@mui/material/Typography"),o=require("@mui/material/useMediaQuery"),d=require("./DocumentTitle.cjs.js"),l=require("./FullWidthContainer.cjs.js"),c=require("../FDErrorBoundary/FDErrorBoundary.cjs.js"),m=require("@mui/material/Button"),p=require("../../renderUtilities/renderUtilities.cjs.js"),h=require("../../../utilities/validation.cjs.js"),g=require("../Spacer/Spacer.cjs.js"),u=require("@mui/material/Box"),x=require("@mui/material/Divider");const j=1112,v=a.styled("div")((({theme:e,fluid:i})=>({maxWidth:i?"none":j,[e.breakpoints.down("md")]:{maxWidth:"none"},padding:e.spacing(2,4),position:"relative",minHeight:"100vh"}))),y=a.styled(n)((({theme:e})=>({[e.breakpoints.down("sm")]:{width:"100%",paddingTop:e.spacing(2)}}))),f=a.styled(n)((({theme:e})=>({flexWrap:"nowrap",alignItems:"flex-start",paddingTop:e.spacing(3),paddingBottom:e.spacing(3),[e.breakpoints.down("md")]:{paddingTop:e.spacing(2),paddingBottom:e.spacing(3)}}))),b=a.styled(n)((({theme:e})=>({paddingTop:e.spacing(2)}))),k=a.styled(n)((()=>({flexGrow:1}))),B=a.styled("div")((({theme:e})=>({maxWidth:j,paddingBottom:e.spacing(3),[e.breakpoints.down("md")]:{paddingBottom:e.spacing(2),paddingLeft:e.spacing(2),paddingRight:e.spacing(2)}}))),q=a.styled(r,{shouldForwardProp:e=>"hasTitleComponent"!==e})((({theme:e,hasTitleComponent:i})=>({margin:i?e.spacing(-.75,2,-1.5,-1.5):e.spacing(-1.5,2,-1.5,-1.5),[e.breakpoints.only("sm")]:{marginLeft:e.spacing(-2)},[e.breakpoints.only("xs")]:{marginLeft:e.spacing(-2)}}))),w=a.styled("div")((({theme:e})=>({maxWidth:j,marginLeft:e.spacing(6),marginRight:e.spacing(4),paddingBottom:e.spacing(2),[e.breakpoints.only("md")]:{marginLeft:12,marginRight:e.spacing(3)},[e.breakpoints.only("sm")]:{marginLeft:e.spacing(3),marginRight:e.spacing(3),maxWidth:"none"},[e.breakpoints.only("xs")]:{marginLeft:e.spacing(2),marginRight:e.spacing(2),maxWidth:"none"}}))),T=a.styled(n)((()=>({display:"flex",flexGrow:1,justifyContent:"flex-end"}))),W=a.styled(s)((()=>({lineHeight:"26px"}))),A=a.styled(s)((()=>({fontWeight:"bold"}))),C=a.styled(x)((({theme:e})=>({marginBottom:e.spacing(4)}))),F=({title:i})=>e.jsx(A,{variant:"h5",component:"h2",children:i}),L=a.styled("div")((({useAlternateBackground:e,theme:i})=>({backgroundColor:e?i.palette.alternateBackground.main:i.palette.white.main,width:"100%",height:"100%"})));exports.PageTitle=F,exports.default=r=>{const{actionBtnTitle:s,caption:x,children:j,contextButtons:A,documentTitle:P,fluid:I=!1,fullWidth:D,header:R,hideHeader:z,actionButtonLink:H,openLinkInNewTab:_=!1,pageHeader:G,showActionButton:M,showAddIcon:U,title:E,titleComponent:S,toPrevious:N,toParent:O,strictToParent:Q,navigate:$,hideDivider:J=!1,customActionButtons:K,useAlternateBackground:V=!1,titleComponentAfter:X}=r,Y=a.useTheme(),Z=o(Y.breakpoints.down("md")),ee=p.getMicroFrontendAttribute("data-portal-base-url")||"/",ie=H?.startsWith("https://"),te=ie?H:void 0!==H?h.joinUrlPaths(ee,H):"";return e.jsx(L,{useAlternateBackground:V,children:e.jsxs(v,{fluid:I,children:[P&&e.jsx(d,{children:P}),G||null,e.jsxs(w,{children:[G&&e.jsx(g,{size:16,variant:"vertical"}),!z&&e.jsxs(e.Fragment,{children:[e.jsxs(f,{container:!0,alignItems:"center",direction:"column",children:[e.jsx(n,{item:!0,container:!0,direction:"row",alignContent:"space-between",children:e.jsx(T,{item:!0,children:A&&A.map(((i,t)=>e.jsx("div",{children:i},t)))})}),e.jsxs(b,{item:!0,container:!0,children:[(O||N)&&e.jsx(u,{children:e.jsx(q,{"aria-label":"Back","data-testid":"back_button",hasTitleComponent:!!S,component:"button",onClick:()=>{N?$(-1):O&&Q||O&&history.length<3?$(O):$(-1)},children:e.jsx(t,{})})}),e.jsxs(k,{item:!0,children:[S?e.jsx(S,{}):e.jsx(e.Fragment,{children:e.jsxs(u,{display:"flex",alignItems:"center",gap:2,children:[e.jsx(F,{title:E}),X]})}),x&&e.jsx(W,{variant:"caption",component:"h3",children:x})]}),M&&e.jsxs(e.Fragment,{children:[Z&&e.jsx(g,{size:56,variant:"vertical"}),e.jsx(y,{item:!0,children:e.jsxs(m,{variant:"contained",fullWidth:!0,"data-testid":`Action-button-${s}`,href:_||ie?te:"",target:_?"_blank":void 0,rel:_?"noopener noreferrer":void 0,onClick:_||ie?()=>{}:()=>$(H),children:[U&&e.jsx(i,{}),s]})})]}),K&&K.map(((i,t)=>e.jsxs("div",{children:[Z&&e.jsx(g,{size:56,variant:"vertical"}),!Z&&e.jsx(g,{size:16,variant:"vertical"}),e.jsx(y,{item:!0,children:i})]},t)))]})]}),!J&&e.jsx(C,{})]}),e.jsxs(l,{fullWidth:D,children:[R?e.jsx(B,{children:R}):null,e.jsx(c,{identifier:P,children:e.jsx(e.Fragment,{children:j})})]})]})]})})},exports.maxWidth=j;
|
|
2
2
|
//# sourceMappingURL=PageLayout.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageLayout.cjs.js","sources":["../../../../src/components/ui/PageLayout/PageLayout.tsx"],"sourcesContent":["import React, { type ComponentType, type ReactNode, useEffect } from 'react';\n\nimport Add from '@mui/icons-material/Add';\nimport ArrowBackIcon from '@mui/icons-material/ArrowBack';\nimport Grid from '@mui/material/Grid';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport DocumentTitle from './DocumentTitle';\nimport FullWidthContainer from './FullWidthContainer';\nimport FDErrorBoundary from '../FDErrorBoundary/FDErrorBoundary';\nimport Button from '@mui/material/Button';\nimport { getMicroFrontendAttribute } from '../../renderUtilities';\nimport { joinUrlPaths } from '../../../utilities/validation';\nimport Spacer from '../Spacer/Spacer';\nimport Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\n\nexport const HORIZONTAL_SPACE_CLASSNAME = 'horizontal-content-space';\nexport const LEFT_HORIZONTAL_SPACE_CLASSNAME = 'left-horizontal-content-space';\nexport const RIGHT_HORIZONTAL_SPACE_CLASSNAME = 'right-horizontal-content-space';\nexport const VERTICAL_SPACE_CLASSNAME = 'vertical-content-space';\nexport const maxWidth = 1112;\nconst historyMinLength = 3;\n\nconst StyledWrapper = styled('div')<{ fluid: boolean }>(({ theme, fluid }) => ({\n maxWidth: fluid ? 'none' : maxWidth,\n [theme.breakpoints.down('md')]: {\n maxWidth: 'none',\n },\n margin: theme.spacing(2, 4),\n position: 'relative',\n minHeight: '100vh',\n}));\n\nconst StyledActionButtonGrid = styled(Grid)(({ theme }) => ({\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n paddingTop: theme.spacing(2),\n },\n}));\n\nconst StyledHeader = styled(Grid)(({ theme }) => ({\n flexWrap: 'nowrap',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(3),\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(3),\n },\n}));\n\nconst StyledTitleContainer = styled(Grid)(({ theme }) => ({\n paddingTop: theme.spacing(2),\n}));\n\nconst StyledTitleSection = styled(Grid)(() => ({\n flexGrow: 1,\n}));\n\nconst StyledTopSection = styled('div')(({ theme }) => ({\n maxWidth,\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingBottom: theme.spacing(2),\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n}));\n\nconst StyledBackButton = styled(IconButton, {\n shouldForwardProp: (prop) => prop !== 'hasTitleComponent',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n})<{ hasTitleComponent: boolean; component: any }>(({ theme, hasTitleComponent }) => ({\n margin: hasTitleComponent ? theme.spacing(-0.75, 2, -1.5, -1.5) : theme.spacing(-1.5, 2, -1.5, -1.5),\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(-2),\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(-2),\n },\n}));\n\nconst StyledInnerWrapper = styled('div')(({ theme }) => ({\n maxWidth,\n marginLeft: theme.spacing(6),\n marginRight: theme.spacing(4),\n paddingBottom: theme.spacing(2),\n\n [theme.breakpoints.only('md')]: {\n marginLeft: 12,\n marginRight: theme.spacing(3),\n },\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(3),\n marginRight: theme.spacing(3),\n maxWidth: 'none',\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(2),\n marginRight: theme.spacing(2),\n maxWidth: 'none',\n },\n}));\n\nconst StyledHeaderContainer = styled(Grid)(() => ({\n display: 'flex',\n flexGrow: 1,\n justifyContent: 'flex-end',\n}));\nconst StyledCaption = styled(Typography)<{ component: string }>(() => ({\n lineHeight: '26px',\n}));\n\nconst StyledPageTitle = styled(Typography)<{ component: string }>(() => ({\n fontWeight: 'bold',\n}));\n\nconst StyledPageDivider = styled(Divider)(({ theme }) => ({\n marginBottom: theme.spacing(4),\n}));\n\nexport const PageTitle = ({ title }: { title: string | ReactNode }) => (\n <StyledPageTitle variant=\"h5\" component=\"h2\">\n {title}\n </StyledPageTitle>\n);\n\nexport type Props = {\n actionBtnTitle?: string;\n caption?: ReactNode;\n children: ReactNode;\n contextButtons?: ReactNode[];\n documentTitle: string;\n fluid?: boolean;\n fullWidth?: boolean;\n header?: ReactNode;\n hideHeader?: boolean;\n actionButtonLink?: string;\n pageHeader?: ReactNode;\n showActionButton?: boolean;\n showAddIcon?: boolean;\n title: ReactNode;\n titleComponent?: ComponentType<React.PropsWithChildren<unknown>>;\n titleComponentAfter?: ReactNode;\n toPrevious?: boolean;\n toParent?: string;\n strictToParent?: boolean;\n openLinkInNewTab?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n navigate: (to: any) => void;\n hideDivider?: boolean;\n customActionButtons?: ReactNode[];\n useAlternateBackground?: boolean;\n};\n\nconst PageLayout = (props: Props) => {\n const {\n actionBtnTitle,\n caption,\n children,\n contextButtons,\n documentTitle,\n fluid = false,\n fullWidth,\n header,\n hideHeader,\n actionButtonLink,\n openLinkInNewTab = false,\n pageHeader,\n showActionButton,\n showAddIcon,\n title,\n titleComponent: TitleComponent,\n toPrevious,\n toParent,\n strictToParent,\n navigate,\n hideDivider = false,\n customActionButtons,\n useAlternateBackground = false,\n titleComponentAfter,\n } = props;\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('md'));\n\n useEffect(() => {\n if (useAlternateBackground) {\n document.body.style.backgroundColor = theme.palette.alternateBackground.main;\n }\n\n return () => {\n if (useAlternateBackground) {\n document.body.style.backgroundColor = theme.palette.white.main;\n }\n };\n }, [useAlternateBackground]);\n\n const baseUrl = getMicroFrontendAttribute('data-portal-base-url') || '/';\n const actionButtonWithHttps = actionButtonLink?.startsWith('https://');\n const actionButtonLinkFinal = actionButtonWithHttps\n ? actionButtonLink\n : actionButtonLink !== undefined\n ? joinUrlPaths(baseUrl, actionButtonLink)\n : '';\n\n return (\n <StyledWrapper fluid={fluid}>\n {documentTitle && <DocumentTitle>{documentTitle}</DocumentTitle>}\n\n {pageHeader ? pageHeader : null}\n <StyledInnerWrapper>\n {pageHeader && <Spacer size={16} variant=\"vertical\" />}\n {!hideHeader && (\n <>\n <StyledHeader container alignItems=\"center\" direction=\"column\">\n <Grid item container direction=\"row\" alignContent=\"space-between\">\n <StyledHeaderContainer item>\n {contextButtons && contextButtons.map((button, index) => <div key={index}>{button}</div>)}\n </StyledHeaderContainer>\n </Grid>\n <StyledTitleContainer item container>\n {(toParent || toPrevious) && (\n <Box>\n <StyledBackButton\n aria-label=\"Back\"\n data-testid=\"back_button\"\n hasTitleComponent={!!TitleComponent}\n component={'button'}\n onClick={() => {\n if (toPrevious) {\n navigate(-1);\n } else if (toParent && strictToParent) {\n navigate(toParent);\n } else if (toParent && history.length < historyMinLength) {\n navigate(toParent);\n } else {\n navigate(-1);\n }\n }}\n >\n <ArrowBackIcon />\n </StyledBackButton>\n </Box>\n )}\n\n <StyledTitleSection item>\n {TitleComponent ? (\n <TitleComponent />\n ) : (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap={2}>\n <PageTitle title={title} />\n {titleComponentAfter}\n </Box>\n </>\n )}\n {caption && (\n <StyledCaption variant=\"caption\" component=\"h3\">\n {caption}\n </StyledCaption>\n )}\n </StyledTitleSection>\n\n {showActionButton && (\n <>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n <StyledActionButtonGrid item>\n <Button\n variant=\"contained\"\n fullWidth={true}\n data-testid={`Action-button-${actionBtnTitle}`}\n href={openLinkInNewTab || actionButtonWithHttps ? actionButtonLinkFinal : ''}\n target={openLinkInNewTab ? '_blank' : undefined}\n rel={openLinkInNewTab ? 'noopener noreferrer' : undefined}\n onClick={!openLinkInNewTab && !actionButtonWithHttps ? () => navigate(actionButtonLink) : () => {}}\n >\n {showAddIcon && <Add />}\n {actionBtnTitle}\n </Button>\n </StyledActionButtonGrid>\n </>\n )}\n {customActionButtons &&\n customActionButtons.map((button, index) => (\n <div key={index}>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n {!isMobile && <Spacer size={16} variant=\"vertical\" />}\n <StyledActionButtonGrid item>{button}</StyledActionButtonGrid>\n </div>\n ))}\n </StyledTitleContainer>\n </StyledHeader>\n {!hideDivider && <StyledPageDivider />}\n </>\n )}\n <FullWidthContainer fullWidth={fullWidth}>\n {header ? <StyledTopSection>{header}</StyledTopSection> : null}\n <FDErrorBoundary identifier={documentTitle}>\n <>{children}</>\n </FDErrorBoundary>\n </FullWidthContainer>\n </StyledInnerWrapper>\n </StyledWrapper>\n );\n};\n\nexport default PageLayout;\n"],"names":["maxWidth","StyledWrapper","styled","theme","fluid","breakpoints","down","margin","spacing","position","minHeight","StyledActionButtonGrid","Grid","width","paddingTop","StyledHeader","flexWrap","alignItems","paddingBottom","StyledTitleContainer","StyledTitleSection","flexGrow","StyledTopSection","paddingLeft","paddingRight","StyledBackButton","IconButton","shouldForwardProp","prop","hasTitleComponent","only","marginLeft","StyledInnerWrapper","marginRight","StyledHeaderContainer","display","justifyContent","StyledCaption","Typography","lineHeight","StyledPageTitle","fontWeight","StyledPageDivider","Divider","marginBottom","PageTitle","title","_jsx","variant","component","children","props","actionBtnTitle","caption","contextButtons","documentTitle","fullWidth","header","hideHeader","actionButtonLink","openLinkInNewTab","pageHeader","showActionButton","showAddIcon","titleComponent","TitleComponent","toPrevious","toParent","strictToParent","navigate","hideDivider","customActionButtons","useAlternateBackground","titleComponentAfter","useTheme","isMobile","useMediaQuery","useEffect","document","body","style","backgroundColor","palette","alternateBackground","main","white","baseUrl","getMicroFrontendAttribute","actionButtonWithHttps","startsWith","actionButtonLinkFinal","undefined","joinUrlPaths","_jsxs","jsx","DocumentTitle","Spacer","size","_Fragment","container","direction","item","alignContent","map","button","index","Box","onClick","history","length","ArrowBackIcon","jsxs","Fragment","gap","Button","href","target","rel","Add","FullWidthContainer","FDErrorBoundary","identifier"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PageLayout.cjs.js","sources":["../../../../src/components/ui/PageLayout/PageLayout.tsx"],"sourcesContent":["import React, { type ComponentType, type ReactNode } from 'react';\n\nimport Add from '@mui/icons-material/Add';\nimport ArrowBackIcon from '@mui/icons-material/ArrowBack';\nimport Grid from '@mui/material/Grid';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport DocumentTitle from './DocumentTitle';\nimport FullWidthContainer from './FullWidthContainer';\nimport FDErrorBoundary from '../FDErrorBoundary/FDErrorBoundary';\nimport Button from '@mui/material/Button';\nimport { getMicroFrontendAttribute } from '../../renderUtilities';\nimport { joinUrlPaths } from '../../../utilities/validation';\nimport Spacer from '../Spacer/Spacer';\nimport Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\n\nexport const HORIZONTAL_SPACE_CLASSNAME = 'horizontal-content-space';\nexport const LEFT_HORIZONTAL_SPACE_CLASSNAME = 'left-horizontal-content-space';\nexport const RIGHT_HORIZONTAL_SPACE_CLASSNAME = 'right-horizontal-content-space';\nexport const VERTICAL_SPACE_CLASSNAME = 'vertical-content-space';\nexport const maxWidth = 1112;\nconst historyMinLength = 3;\n\nconst StyledWrapper = styled('div')<{ fluid: boolean }>(({ theme, fluid }) => ({\n maxWidth: fluid ? 'none' : maxWidth,\n [theme.breakpoints.down('md')]: {\n maxWidth: 'none',\n },\n padding: theme.spacing(2, 4),\n position: 'relative',\n minHeight: '100vh',\n}));\n\nconst StyledActionButtonGrid = styled(Grid)(({ theme }) => ({\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n paddingTop: theme.spacing(2),\n },\n}));\n\nconst StyledHeader = styled(Grid)(({ theme }) => ({\n flexWrap: 'nowrap',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(3),\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(3),\n },\n}));\n\nconst StyledTitleContainer = styled(Grid)(({ theme }) => ({\n paddingTop: theme.spacing(2),\n}));\n\nconst StyledTitleSection = styled(Grid)(() => ({\n flexGrow: 1,\n}));\n\nconst StyledTopSection = styled('div')(({ theme }) => ({\n maxWidth,\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingBottom: theme.spacing(2),\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n}));\n\nconst StyledBackButton = styled(IconButton, {\n shouldForwardProp: (prop) => prop !== 'hasTitleComponent',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n})<{ hasTitleComponent: boolean; component: any }>(({ theme, hasTitleComponent }) => ({\n margin: hasTitleComponent ? theme.spacing(-0.75, 2, -1.5, -1.5) : theme.spacing(-1.5, 2, -1.5, -1.5),\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(-2),\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(-2),\n },\n}));\n\nconst StyledInnerWrapper = styled('div')(({ theme }) => ({\n maxWidth,\n marginLeft: theme.spacing(6),\n marginRight: theme.spacing(4),\n paddingBottom: theme.spacing(2),\n\n [theme.breakpoints.only('md')]: {\n marginLeft: 12,\n marginRight: theme.spacing(3),\n },\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(3),\n marginRight: theme.spacing(3),\n maxWidth: 'none',\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(2),\n marginRight: theme.spacing(2),\n maxWidth: 'none',\n },\n}));\n\nconst StyledHeaderContainer = styled(Grid)(() => ({\n display: 'flex',\n flexGrow: 1,\n justifyContent: 'flex-end',\n}));\nconst StyledCaption = styled(Typography)<{ component: string }>(() => ({\n lineHeight: '26px',\n}));\n\nconst StyledPageTitle = styled(Typography)<{ component: string }>(() => ({\n fontWeight: 'bold',\n}));\n\nconst StyledPageDivider = styled(Divider)(({ theme }) => ({\n marginBottom: theme.spacing(4),\n}));\n\nexport const PageTitle = ({ title }: { title: string | ReactNode }) => (\n <StyledPageTitle variant=\"h5\" component=\"h2\">\n {title}\n </StyledPageTitle>\n);\n\nconst StyledPageContainer = styled('div')<{ useAlternateBackground: boolean }>(({ useAlternateBackground, theme }) => ({\n backgroundColor: useAlternateBackground ? theme.palette.alternateBackground.main : theme.palette.white.main,\n width: '100%',\n height: '100%',\n}));\n\nexport type Props = {\n actionBtnTitle?: string;\n caption?: ReactNode;\n children: ReactNode;\n contextButtons?: ReactNode[];\n documentTitle: string;\n fluid?: boolean;\n fullWidth?: boolean;\n header?: ReactNode;\n hideHeader?: boolean;\n actionButtonLink?: string;\n pageHeader?: ReactNode;\n showActionButton?: boolean;\n showAddIcon?: boolean;\n title: ReactNode;\n titleComponent?: ComponentType<React.PropsWithChildren<unknown>>;\n titleComponentAfter?: ReactNode;\n toPrevious?: boolean;\n toParent?: string;\n strictToParent?: boolean;\n openLinkInNewTab?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n navigate: (to: any) => void;\n hideDivider?: boolean;\n customActionButtons?: ReactNode[];\n useAlternateBackground?: boolean;\n};\n\nconst PageLayout = (props: Props) => {\n const {\n actionBtnTitle,\n caption,\n children,\n contextButtons,\n documentTitle,\n fluid = false,\n fullWidth,\n header,\n hideHeader,\n actionButtonLink,\n openLinkInNewTab = false,\n pageHeader,\n showActionButton,\n showAddIcon,\n title,\n titleComponent: TitleComponent,\n toPrevious,\n toParent,\n strictToParent,\n navigate,\n hideDivider = false,\n customActionButtons,\n useAlternateBackground = false,\n titleComponentAfter,\n } = props;\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('md'));\n\n const baseUrl = getMicroFrontendAttribute('data-portal-base-url') || '/';\n const actionButtonWithHttps = actionButtonLink?.startsWith('https://');\n const actionButtonLinkFinal = actionButtonWithHttps\n ? actionButtonLink\n : actionButtonLink !== undefined\n ? joinUrlPaths(baseUrl, actionButtonLink)\n : '';\n\n return (\n <StyledPageContainer useAlternateBackground={useAlternateBackground}>\n <StyledWrapper fluid={fluid}>\n {documentTitle && <DocumentTitle>{documentTitle}</DocumentTitle>}\n\n {pageHeader ? pageHeader : null}\n <StyledInnerWrapper>\n {pageHeader && <Spacer size={16} variant=\"vertical\" />}\n {!hideHeader && (\n <>\n <StyledHeader container alignItems=\"center\" direction=\"column\">\n <Grid item container direction=\"row\" alignContent=\"space-between\">\n <StyledHeaderContainer item>\n {contextButtons && contextButtons.map((button, index) => <div key={index}>{button}</div>)}\n </StyledHeaderContainer>\n </Grid>\n <StyledTitleContainer item container>\n {(toParent || toPrevious) && (\n <Box>\n <StyledBackButton\n aria-label=\"Back\"\n data-testid=\"back_button\"\n hasTitleComponent={!!TitleComponent}\n component={'button'}\n onClick={() => {\n if (toPrevious) {\n navigate(-1);\n } else if (toParent && strictToParent) {\n navigate(toParent);\n } else if (toParent && history.length < historyMinLength) {\n navigate(toParent);\n } else {\n navigate(-1);\n }\n }}\n >\n <ArrowBackIcon />\n </StyledBackButton>\n </Box>\n )}\n\n <StyledTitleSection item>\n {TitleComponent ? (\n <TitleComponent />\n ) : (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap={2}>\n <PageTitle title={title} />\n {titleComponentAfter}\n </Box>\n </>\n )}\n {caption && (\n <StyledCaption variant=\"caption\" component=\"h3\">\n {caption}\n </StyledCaption>\n )}\n </StyledTitleSection>\n\n {showActionButton && (\n <>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n <StyledActionButtonGrid item>\n <Button\n variant=\"contained\"\n fullWidth={true}\n data-testid={`Action-button-${actionBtnTitle}`}\n href={openLinkInNewTab || actionButtonWithHttps ? actionButtonLinkFinal : ''}\n target={openLinkInNewTab ? '_blank' : undefined}\n rel={openLinkInNewTab ? 'noopener noreferrer' : undefined}\n onClick={\n !openLinkInNewTab && !actionButtonWithHttps ? () => navigate(actionButtonLink) : () => {}\n }\n >\n {showAddIcon && <Add />}\n {actionBtnTitle}\n </Button>\n </StyledActionButtonGrid>\n </>\n )}\n {customActionButtons &&\n customActionButtons.map((button, index) => (\n <div key={index}>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n {!isMobile && <Spacer size={16} variant=\"vertical\" />}\n <StyledActionButtonGrid item>{button}</StyledActionButtonGrid>\n </div>\n ))}\n </StyledTitleContainer>\n </StyledHeader>\n {!hideDivider && <StyledPageDivider />}\n </>\n )}\n <FullWidthContainer fullWidth={fullWidth}>\n {header ? <StyledTopSection>{header}</StyledTopSection> : null}\n <FDErrorBoundary identifier={documentTitle}>\n <>{children}</>\n </FDErrorBoundary>\n </FullWidthContainer>\n </StyledInnerWrapper>\n </StyledWrapper>\n </StyledPageContainer>\n );\n};\n\nexport default PageLayout;\n"],"names":["maxWidth","StyledWrapper","styled","theme","fluid","breakpoints","down","padding","spacing","position","minHeight","StyledActionButtonGrid","Grid","width","paddingTop","StyledHeader","flexWrap","alignItems","paddingBottom","StyledTitleContainer","StyledTitleSection","flexGrow","StyledTopSection","paddingLeft","paddingRight","StyledBackButton","IconButton","shouldForwardProp","prop","hasTitleComponent","margin","only","marginLeft","StyledInnerWrapper","marginRight","StyledHeaderContainer","display","justifyContent","StyledCaption","Typography","lineHeight","StyledPageTitle","fontWeight","StyledPageDivider","Divider","marginBottom","PageTitle","title","_jsx","variant","component","children","StyledPageContainer","useAlternateBackground","backgroundColor","palette","alternateBackground","main","white","height","props","actionBtnTitle","caption","contextButtons","documentTitle","fullWidth","header","hideHeader","actionButtonLink","openLinkInNewTab","pageHeader","showActionButton","showAddIcon","titleComponent","TitleComponent","toPrevious","toParent","strictToParent","navigate","hideDivider","customActionButtons","titleComponentAfter","useTheme","isMobile","useMediaQuery","baseUrl","getMicroFrontendAttribute","actionButtonWithHttps","startsWith","actionButtonLinkFinal","undefined","joinUrlPaths","_jsxs","jsxs","jsx","DocumentTitle","Spacer","size","_Fragment","Fragment","container","direction","item","alignContent","map","button","index","Box","onClick","history","length","ArrowBackIcon","gap","Button","href","target","rel","Add","FullWidthContainer","FDErrorBoundary","identifier"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{jsx as i,jsxs as t,Fragment as n}from"react/jsx-runtime";import"react";import e from"@mui/icons-material/Add";import r from"@mui/icons-material/ArrowBack";import a from"@mui/material/Grid";import o from"@mui/material/IconButton";import{styled as d,useTheme as m}from"@mui/material/styles";import l from"@mui/material/Typography";import p from"@mui/material/useMediaQuery";import c from"./DocumentTitle.js";import s from"./FullWidthContainer.js";import h from"../FDErrorBoundary/FDErrorBoundary.js";import g from"@mui/material/Button";import{getMicroFrontendAttribute as u}from"../../renderUtilities/renderUtilities.js";import{joinUrlPaths as f}from"../../../utilities/validation.js";import v from"../Spacer/Spacer.js";import k from"@mui/material/Box";import B from"@mui/material/Divider";const b=1112,x=d("div")((({theme:i,fluid:t})=>({maxWidth:t?"none":b,[i.breakpoints.down("md")]:{maxWidth:"none"},padding:i.spacing(2,4),position:"relative",minHeight:"100vh"}))),w=d(a)((({theme:i})=>({[i.breakpoints.down("sm")]:{width:"100%",paddingTop:i.spacing(2)}}))),y=d(a)((({theme:i})=>({flexWrap:"nowrap",alignItems:"flex-start",paddingTop:i.spacing(3),paddingBottom:i.spacing(3),[i.breakpoints.down("md")]:{paddingTop:i.spacing(2),paddingBottom:i.spacing(3)}}))),T=d(a)((({theme:i})=>({paddingTop:i.spacing(2)}))),W=d(a)((()=>({flexGrow:1}))),C=d("div")((({theme:i})=>({maxWidth:b,paddingBottom:i.spacing(3),[i.breakpoints.down("md")]:{paddingBottom:i.spacing(2),paddingLeft:i.spacing(2),paddingRight:i.spacing(2)}}))),A=d(o,{shouldForwardProp:i=>"hasTitleComponent"!==i})((({theme:i,hasTitleComponent:t})=>({margin:t?i.spacing(-.75,2,-1.5,-1.5):i.spacing(-1.5,2,-1.5,-1.5),[i.breakpoints.only("sm")]:{marginLeft:i.spacing(-2)},[i.breakpoints.only("xs")]:{marginLeft:i.spacing(-2)}}))),L=d("div")((({theme:i})=>({maxWidth:b,marginLeft:i.spacing(6),marginRight:i.spacing(4),paddingBottom:i.spacing(2),[i.breakpoints.only("md")]:{marginLeft:12,marginRight:i.spacing(3)},[i.breakpoints.only("sm")]:{marginLeft:i.spacing(3),marginRight:i.spacing(3),maxWidth:"none"},[i.breakpoints.only("xs")]:{marginLeft:i.spacing(2),marginRight:i.spacing(2),maxWidth:"none"}}))),j=d(a)((()=>({display:"flex",flexGrow:1,justifyContent:"flex-end"}))),I=d(l)((()=>({lineHeight:"26px"}))),D=d(l)((()=>({fontWeight:"bold"}))),R=d(B)((({theme:i})=>({marginBottom:i.spacing(4)}))),z=({title:t})=>i(D,{variant:"h5",component:"h2",children:t}),F=d("div")((({useAlternateBackground:i,theme:t})=>({backgroundColor:i?t.palette.alternateBackground.main:t.palette.white.main,width:"100%",height:"100%"}))),H=o=>{const{actionBtnTitle:d,caption:l,children:B,contextButtons:b,documentTitle:D,fluid:H=!1,fullWidth:P,header:G,hideHeader:E,actionButtonLink:S,openLinkInNewTab:U=!1,pageHeader:_,showActionButton:M,showAddIcon:N,title:Q,titleComponent:$,toPrevious:q,toParent:J,strictToParent:K,navigate:O,hideDivider:V=!1,customActionButtons:X,useAlternateBackground:Y=!1,titleComponentAfter:Z}=o,ii=m(),ti=p(ii.breakpoints.down("md")),ni=u("data-portal-base-url")||"/",ei=S?.startsWith("https://"),ri=ei?S:void 0!==S?f(ni,S):"";return i(F,{useAlternateBackground:Y,children:t(x,{fluid:H,children:[D&&i(c,{children:D}),_||null,t(L,{children:[_&&i(v,{size:16,variant:"vertical"}),!E&&t(n,{children:[t(y,{container:!0,alignItems:"center",direction:"column",children:[i(a,{item:!0,container:!0,direction:"row",alignContent:"space-between",children:i(j,{item:!0,children:b&&b.map(((t,n)=>i("div",{children:t},n)))})}),t(T,{item:!0,container:!0,children:[(J||q)&&i(k,{children:i(A,{"aria-label":"Back","data-testid":"back_button",hasTitleComponent:!!$,component:"button",onClick:()=>{q?O(-1):J&&K||J&&history.length<3?O(J):O(-1)},children:i(r,{})})}),t(W,{item:!0,children:[$?i($,{}):i(n,{children:t(k,{display:"flex",alignItems:"center",gap:2,children:[i(z,{title:Q}),Z]})}),l&&i(I,{variant:"caption",component:"h3",children:l})]}),M&&t(n,{children:[ti&&i(v,{size:56,variant:"vertical"}),i(w,{item:!0,children:t(g,{variant:"contained",fullWidth:!0,"data-testid":`Action-button-${d}`,href:U||ei?ri:"",target:U?"_blank":void 0,rel:U?"noopener noreferrer":void 0,onClick:U||ei?()=>{}:()=>O(S),children:[N&&i(e,{}),d]})})]}),X&&X.map(((n,e)=>t("div",{children:[ti&&i(v,{size:56,variant:"vertical"}),!ti&&i(v,{size:16,variant:"vertical"}),i(w,{item:!0,children:n})]},e)))]})]}),!V&&i(R,{})]}),t(s,{fullWidth:P,children:[G?i(C,{children:G}):null,i(h,{identifier:D,children:i(n,{children:B})})]})]})]})})};export{z as PageTitle,H as default,b as maxWidth};
|
|
2
2
|
//# sourceMappingURL=PageLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageLayout.js","sources":["../../../../src/components/ui/PageLayout/PageLayout.tsx"],"sourcesContent":["import React, { type ComponentType, type ReactNode, useEffect } from 'react';\n\nimport Add from '@mui/icons-material/Add';\nimport ArrowBackIcon from '@mui/icons-material/ArrowBack';\nimport Grid from '@mui/material/Grid';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport DocumentTitle from './DocumentTitle';\nimport FullWidthContainer from './FullWidthContainer';\nimport FDErrorBoundary from '../FDErrorBoundary/FDErrorBoundary';\nimport Button from '@mui/material/Button';\nimport { getMicroFrontendAttribute } from '../../renderUtilities';\nimport { joinUrlPaths } from '../../../utilities/validation';\nimport Spacer from '../Spacer/Spacer';\nimport Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\n\nexport const HORIZONTAL_SPACE_CLASSNAME = 'horizontal-content-space';\nexport const LEFT_HORIZONTAL_SPACE_CLASSNAME = 'left-horizontal-content-space';\nexport const RIGHT_HORIZONTAL_SPACE_CLASSNAME = 'right-horizontal-content-space';\nexport const VERTICAL_SPACE_CLASSNAME = 'vertical-content-space';\nexport const maxWidth = 1112;\nconst historyMinLength = 3;\n\nconst StyledWrapper = styled('div')<{ fluid: boolean }>(({ theme, fluid }) => ({\n maxWidth: fluid ? 'none' : maxWidth,\n [theme.breakpoints.down('md')]: {\n maxWidth: 'none',\n },\n margin: theme.spacing(2, 4),\n position: 'relative',\n minHeight: '100vh',\n}));\n\nconst StyledActionButtonGrid = styled(Grid)(({ theme }) => ({\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n paddingTop: theme.spacing(2),\n },\n}));\n\nconst StyledHeader = styled(Grid)(({ theme }) => ({\n flexWrap: 'nowrap',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(3),\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(3),\n },\n}));\n\nconst StyledTitleContainer = styled(Grid)(({ theme }) => ({\n paddingTop: theme.spacing(2),\n}));\n\nconst StyledTitleSection = styled(Grid)(() => ({\n flexGrow: 1,\n}));\n\nconst StyledTopSection = styled('div')(({ theme }) => ({\n maxWidth,\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingBottom: theme.spacing(2),\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n}));\n\nconst StyledBackButton = styled(IconButton, {\n shouldForwardProp: (prop) => prop !== 'hasTitleComponent',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n})<{ hasTitleComponent: boolean; component: any }>(({ theme, hasTitleComponent }) => ({\n margin: hasTitleComponent ? theme.spacing(-0.75, 2, -1.5, -1.5) : theme.spacing(-1.5, 2, -1.5, -1.5),\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(-2),\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(-2),\n },\n}));\n\nconst StyledInnerWrapper = styled('div')(({ theme }) => ({\n maxWidth,\n marginLeft: theme.spacing(6),\n marginRight: theme.spacing(4),\n paddingBottom: theme.spacing(2),\n\n [theme.breakpoints.only('md')]: {\n marginLeft: 12,\n marginRight: theme.spacing(3),\n },\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(3),\n marginRight: theme.spacing(3),\n maxWidth: 'none',\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(2),\n marginRight: theme.spacing(2),\n maxWidth: 'none',\n },\n}));\n\nconst StyledHeaderContainer = styled(Grid)(() => ({\n display: 'flex',\n flexGrow: 1,\n justifyContent: 'flex-end',\n}));\nconst StyledCaption = styled(Typography)<{ component: string }>(() => ({\n lineHeight: '26px',\n}));\n\nconst StyledPageTitle = styled(Typography)<{ component: string }>(() => ({\n fontWeight: 'bold',\n}));\n\nconst StyledPageDivider = styled(Divider)(({ theme }) => ({\n marginBottom: theme.spacing(4),\n}));\n\nexport const PageTitle = ({ title }: { title: string | ReactNode }) => (\n <StyledPageTitle variant=\"h5\" component=\"h2\">\n {title}\n </StyledPageTitle>\n);\n\nexport type Props = {\n actionBtnTitle?: string;\n caption?: ReactNode;\n children: ReactNode;\n contextButtons?: ReactNode[];\n documentTitle: string;\n fluid?: boolean;\n fullWidth?: boolean;\n header?: ReactNode;\n hideHeader?: boolean;\n actionButtonLink?: string;\n pageHeader?: ReactNode;\n showActionButton?: boolean;\n showAddIcon?: boolean;\n title: ReactNode;\n titleComponent?: ComponentType<React.PropsWithChildren<unknown>>;\n titleComponentAfter?: ReactNode;\n toPrevious?: boolean;\n toParent?: string;\n strictToParent?: boolean;\n openLinkInNewTab?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n navigate: (to: any) => void;\n hideDivider?: boolean;\n customActionButtons?: ReactNode[];\n useAlternateBackground?: boolean;\n};\n\nconst PageLayout = (props: Props) => {\n const {\n actionBtnTitle,\n caption,\n children,\n contextButtons,\n documentTitle,\n fluid = false,\n fullWidth,\n header,\n hideHeader,\n actionButtonLink,\n openLinkInNewTab = false,\n pageHeader,\n showActionButton,\n showAddIcon,\n title,\n titleComponent: TitleComponent,\n toPrevious,\n toParent,\n strictToParent,\n navigate,\n hideDivider = false,\n customActionButtons,\n useAlternateBackground = false,\n titleComponentAfter,\n } = props;\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('md'));\n\n useEffect(() => {\n if (useAlternateBackground) {\n document.body.style.backgroundColor = theme.palette.alternateBackground.main;\n }\n\n return () => {\n if (useAlternateBackground) {\n document.body.style.backgroundColor = theme.palette.white.main;\n }\n };\n }, [useAlternateBackground]);\n\n const baseUrl = getMicroFrontendAttribute('data-portal-base-url') || '/';\n const actionButtonWithHttps = actionButtonLink?.startsWith('https://');\n const actionButtonLinkFinal = actionButtonWithHttps\n ? actionButtonLink\n : actionButtonLink !== undefined\n ? joinUrlPaths(baseUrl, actionButtonLink)\n : '';\n\n return (\n <StyledWrapper fluid={fluid}>\n {documentTitle && <DocumentTitle>{documentTitle}</DocumentTitle>}\n\n {pageHeader ? pageHeader : null}\n <StyledInnerWrapper>\n {pageHeader && <Spacer size={16} variant=\"vertical\" />}\n {!hideHeader && (\n <>\n <StyledHeader container alignItems=\"center\" direction=\"column\">\n <Grid item container direction=\"row\" alignContent=\"space-between\">\n <StyledHeaderContainer item>\n {contextButtons && contextButtons.map((button, index) => <div key={index}>{button}</div>)}\n </StyledHeaderContainer>\n </Grid>\n <StyledTitleContainer item container>\n {(toParent || toPrevious) && (\n <Box>\n <StyledBackButton\n aria-label=\"Back\"\n data-testid=\"back_button\"\n hasTitleComponent={!!TitleComponent}\n component={'button'}\n onClick={() => {\n if (toPrevious) {\n navigate(-1);\n } else if (toParent && strictToParent) {\n navigate(toParent);\n } else if (toParent && history.length < historyMinLength) {\n navigate(toParent);\n } else {\n navigate(-1);\n }\n }}\n >\n <ArrowBackIcon />\n </StyledBackButton>\n </Box>\n )}\n\n <StyledTitleSection item>\n {TitleComponent ? (\n <TitleComponent />\n ) : (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap={2}>\n <PageTitle title={title} />\n {titleComponentAfter}\n </Box>\n </>\n )}\n {caption && (\n <StyledCaption variant=\"caption\" component=\"h3\">\n {caption}\n </StyledCaption>\n )}\n </StyledTitleSection>\n\n {showActionButton && (\n <>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n <StyledActionButtonGrid item>\n <Button\n variant=\"contained\"\n fullWidth={true}\n data-testid={`Action-button-${actionBtnTitle}`}\n href={openLinkInNewTab || actionButtonWithHttps ? actionButtonLinkFinal : ''}\n target={openLinkInNewTab ? '_blank' : undefined}\n rel={openLinkInNewTab ? 'noopener noreferrer' : undefined}\n onClick={!openLinkInNewTab && !actionButtonWithHttps ? () => navigate(actionButtonLink) : () => {}}\n >\n {showAddIcon && <Add />}\n {actionBtnTitle}\n </Button>\n </StyledActionButtonGrid>\n </>\n )}\n {customActionButtons &&\n customActionButtons.map((button, index) => (\n <div key={index}>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n {!isMobile && <Spacer size={16} variant=\"vertical\" />}\n <StyledActionButtonGrid item>{button}</StyledActionButtonGrid>\n </div>\n ))}\n </StyledTitleContainer>\n </StyledHeader>\n {!hideDivider && <StyledPageDivider />}\n </>\n )}\n <FullWidthContainer fullWidth={fullWidth}>\n {header ? <StyledTopSection>{header}</StyledTopSection> : null}\n <FDErrorBoundary identifier={documentTitle}>\n <>{children}</>\n </FDErrorBoundary>\n </FullWidthContainer>\n </StyledInnerWrapper>\n </StyledWrapper>\n );\n};\n\nexport default PageLayout;\n"],"names":["maxWidth","StyledWrapper","styled","theme","fluid","breakpoints","down","margin","spacing","position","minHeight","StyledActionButtonGrid","Grid","width","paddingTop","StyledHeader","flexWrap","alignItems","paddingBottom","StyledTitleContainer","StyledTitleSection","flexGrow","StyledTopSection","paddingLeft","paddingRight","StyledBackButton","IconButton","shouldForwardProp","prop","hasTitleComponent","only","marginLeft","StyledInnerWrapper","marginRight","StyledHeaderContainer","display","justifyContent","StyledCaption","Typography","lineHeight","StyledPageTitle","fontWeight","StyledPageDivider","Divider","marginBottom","PageTitle","title","_jsx","variant","component","children","PageLayout","props","actionBtnTitle","caption","contextButtons","documentTitle","fullWidth","header","hideHeader","actionButtonLink","openLinkInNewTab","pageHeader","showActionButton","showAddIcon","titleComponent","TitleComponent","toPrevious","toParent","strictToParent","navigate","hideDivider","customActionButtons","useAlternateBackground","titleComponentAfter","useTheme","isMobile","useMediaQuery","useEffect","document","body","style","backgroundColor","palette","alternateBackground","main","white","baseUrl","getMicroFrontendAttribute","actionButtonWithHttps","startsWith","actionButtonLinkFinal","undefined","joinUrlPaths","_jsxs","DocumentTitle","Spacer","size","_Fragment","container","direction","item","alignContent","map","button","index","Box","onClick","history","length","ArrowBackIcon","gap","Button","href","target","rel","Add","FullWidthContainer","FDErrorBoundary","identifier"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PageLayout.js","sources":["../../../../src/components/ui/PageLayout/PageLayout.tsx"],"sourcesContent":["import React, { type ComponentType, type ReactNode } from 'react';\n\nimport Add from '@mui/icons-material/Add';\nimport ArrowBackIcon from '@mui/icons-material/ArrowBack';\nimport Grid from '@mui/material/Grid';\nimport IconButton from '@mui/material/IconButton';\nimport { styled, useTheme } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport DocumentTitle from './DocumentTitle';\nimport FullWidthContainer from './FullWidthContainer';\nimport FDErrorBoundary from '../FDErrorBoundary/FDErrorBoundary';\nimport Button from '@mui/material/Button';\nimport { getMicroFrontendAttribute } from '../../renderUtilities';\nimport { joinUrlPaths } from '../../../utilities/validation';\nimport Spacer from '../Spacer/Spacer';\nimport Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\n\nexport const HORIZONTAL_SPACE_CLASSNAME = 'horizontal-content-space';\nexport const LEFT_HORIZONTAL_SPACE_CLASSNAME = 'left-horizontal-content-space';\nexport const RIGHT_HORIZONTAL_SPACE_CLASSNAME = 'right-horizontal-content-space';\nexport const VERTICAL_SPACE_CLASSNAME = 'vertical-content-space';\nexport const maxWidth = 1112;\nconst historyMinLength = 3;\n\nconst StyledWrapper = styled('div')<{ fluid: boolean }>(({ theme, fluid }) => ({\n maxWidth: fluid ? 'none' : maxWidth,\n [theme.breakpoints.down('md')]: {\n maxWidth: 'none',\n },\n padding: theme.spacing(2, 4),\n position: 'relative',\n minHeight: '100vh',\n}));\n\nconst StyledActionButtonGrid = styled(Grid)(({ theme }) => ({\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n paddingTop: theme.spacing(2),\n },\n}));\n\nconst StyledHeader = styled(Grid)(({ theme }) => ({\n flexWrap: 'nowrap',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(3),\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(3),\n },\n}));\n\nconst StyledTitleContainer = styled(Grid)(({ theme }) => ({\n paddingTop: theme.spacing(2),\n}));\n\nconst StyledTitleSection = styled(Grid)(() => ({\n flexGrow: 1,\n}));\n\nconst StyledTopSection = styled('div')(({ theme }) => ({\n maxWidth,\n paddingBottom: theme.spacing(3),\n\n [theme.breakpoints.down('md')]: {\n paddingBottom: theme.spacing(2),\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n}));\n\nconst StyledBackButton = styled(IconButton, {\n shouldForwardProp: (prop) => prop !== 'hasTitleComponent',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n})<{ hasTitleComponent: boolean; component: any }>(({ theme, hasTitleComponent }) => ({\n margin: hasTitleComponent ? theme.spacing(-0.75, 2, -1.5, -1.5) : theme.spacing(-1.5, 2, -1.5, -1.5),\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(-2),\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(-2),\n },\n}));\n\nconst StyledInnerWrapper = styled('div')(({ theme }) => ({\n maxWidth,\n marginLeft: theme.spacing(6),\n marginRight: theme.spacing(4),\n paddingBottom: theme.spacing(2),\n\n [theme.breakpoints.only('md')]: {\n marginLeft: 12,\n marginRight: theme.spacing(3),\n },\n\n [theme.breakpoints.only('sm')]: {\n marginLeft: theme.spacing(3),\n marginRight: theme.spacing(3),\n maxWidth: 'none',\n },\n\n [theme.breakpoints.only('xs')]: {\n marginLeft: theme.spacing(2),\n marginRight: theme.spacing(2),\n maxWidth: 'none',\n },\n}));\n\nconst StyledHeaderContainer = styled(Grid)(() => ({\n display: 'flex',\n flexGrow: 1,\n justifyContent: 'flex-end',\n}));\nconst StyledCaption = styled(Typography)<{ component: string }>(() => ({\n lineHeight: '26px',\n}));\n\nconst StyledPageTitle = styled(Typography)<{ component: string }>(() => ({\n fontWeight: 'bold',\n}));\n\nconst StyledPageDivider = styled(Divider)(({ theme }) => ({\n marginBottom: theme.spacing(4),\n}));\n\nexport const PageTitle = ({ title }: { title: string | ReactNode }) => (\n <StyledPageTitle variant=\"h5\" component=\"h2\">\n {title}\n </StyledPageTitle>\n);\n\nconst StyledPageContainer = styled('div')<{ useAlternateBackground: boolean }>(({ useAlternateBackground, theme }) => ({\n backgroundColor: useAlternateBackground ? theme.palette.alternateBackground.main : theme.palette.white.main,\n width: '100%',\n height: '100%',\n}));\n\nexport type Props = {\n actionBtnTitle?: string;\n caption?: ReactNode;\n children: ReactNode;\n contextButtons?: ReactNode[];\n documentTitle: string;\n fluid?: boolean;\n fullWidth?: boolean;\n header?: ReactNode;\n hideHeader?: boolean;\n actionButtonLink?: string;\n pageHeader?: ReactNode;\n showActionButton?: boolean;\n showAddIcon?: boolean;\n title: ReactNode;\n titleComponent?: ComponentType<React.PropsWithChildren<unknown>>;\n titleComponentAfter?: ReactNode;\n toPrevious?: boolean;\n toParent?: string;\n strictToParent?: boolean;\n openLinkInNewTab?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n navigate: (to: any) => void;\n hideDivider?: boolean;\n customActionButtons?: ReactNode[];\n useAlternateBackground?: boolean;\n};\n\nconst PageLayout = (props: Props) => {\n const {\n actionBtnTitle,\n caption,\n children,\n contextButtons,\n documentTitle,\n fluid = false,\n fullWidth,\n header,\n hideHeader,\n actionButtonLink,\n openLinkInNewTab = false,\n pageHeader,\n showActionButton,\n showAddIcon,\n title,\n titleComponent: TitleComponent,\n toPrevious,\n toParent,\n strictToParent,\n navigate,\n hideDivider = false,\n customActionButtons,\n useAlternateBackground = false,\n titleComponentAfter,\n } = props;\n const theme = useTheme();\n const isMobile = useMediaQuery(theme.breakpoints.down('md'));\n\n const baseUrl = getMicroFrontendAttribute('data-portal-base-url') || '/';\n const actionButtonWithHttps = actionButtonLink?.startsWith('https://');\n const actionButtonLinkFinal = actionButtonWithHttps\n ? actionButtonLink\n : actionButtonLink !== undefined\n ? joinUrlPaths(baseUrl, actionButtonLink)\n : '';\n\n return (\n <StyledPageContainer useAlternateBackground={useAlternateBackground}>\n <StyledWrapper fluid={fluid}>\n {documentTitle && <DocumentTitle>{documentTitle}</DocumentTitle>}\n\n {pageHeader ? pageHeader : null}\n <StyledInnerWrapper>\n {pageHeader && <Spacer size={16} variant=\"vertical\" />}\n {!hideHeader && (\n <>\n <StyledHeader container alignItems=\"center\" direction=\"column\">\n <Grid item container direction=\"row\" alignContent=\"space-between\">\n <StyledHeaderContainer item>\n {contextButtons && contextButtons.map((button, index) => <div key={index}>{button}</div>)}\n </StyledHeaderContainer>\n </Grid>\n <StyledTitleContainer item container>\n {(toParent || toPrevious) && (\n <Box>\n <StyledBackButton\n aria-label=\"Back\"\n data-testid=\"back_button\"\n hasTitleComponent={!!TitleComponent}\n component={'button'}\n onClick={() => {\n if (toPrevious) {\n navigate(-1);\n } else if (toParent && strictToParent) {\n navigate(toParent);\n } else if (toParent && history.length < historyMinLength) {\n navigate(toParent);\n } else {\n navigate(-1);\n }\n }}\n >\n <ArrowBackIcon />\n </StyledBackButton>\n </Box>\n )}\n\n <StyledTitleSection item>\n {TitleComponent ? (\n <TitleComponent />\n ) : (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap={2}>\n <PageTitle title={title} />\n {titleComponentAfter}\n </Box>\n </>\n )}\n {caption && (\n <StyledCaption variant=\"caption\" component=\"h3\">\n {caption}\n </StyledCaption>\n )}\n </StyledTitleSection>\n\n {showActionButton && (\n <>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n <StyledActionButtonGrid item>\n <Button\n variant=\"contained\"\n fullWidth={true}\n data-testid={`Action-button-${actionBtnTitle}`}\n href={openLinkInNewTab || actionButtonWithHttps ? actionButtonLinkFinal : ''}\n target={openLinkInNewTab ? '_blank' : undefined}\n rel={openLinkInNewTab ? 'noopener noreferrer' : undefined}\n onClick={\n !openLinkInNewTab && !actionButtonWithHttps ? () => navigate(actionButtonLink) : () => {}\n }\n >\n {showAddIcon && <Add />}\n {actionBtnTitle}\n </Button>\n </StyledActionButtonGrid>\n </>\n )}\n {customActionButtons &&\n customActionButtons.map((button, index) => (\n <div key={index}>\n {isMobile && <Spacer size={56} variant=\"vertical\" />}\n {!isMobile && <Spacer size={16} variant=\"vertical\" />}\n <StyledActionButtonGrid item>{button}</StyledActionButtonGrid>\n </div>\n ))}\n </StyledTitleContainer>\n </StyledHeader>\n {!hideDivider && <StyledPageDivider />}\n </>\n )}\n <FullWidthContainer fullWidth={fullWidth}>\n {header ? <StyledTopSection>{header}</StyledTopSection> : null}\n <FDErrorBoundary identifier={documentTitle}>\n <>{children}</>\n </FDErrorBoundary>\n </FullWidthContainer>\n </StyledInnerWrapper>\n </StyledWrapper>\n </StyledPageContainer>\n );\n};\n\nexport default PageLayout;\n"],"names":["maxWidth","StyledWrapper","styled","theme","fluid","breakpoints","down","padding","spacing","position","minHeight","StyledActionButtonGrid","Grid","width","paddingTop","StyledHeader","flexWrap","alignItems","paddingBottom","StyledTitleContainer","StyledTitleSection","flexGrow","StyledTopSection","paddingLeft","paddingRight","StyledBackButton","IconButton","shouldForwardProp","prop","hasTitleComponent","margin","only","marginLeft","StyledInnerWrapper","marginRight","StyledHeaderContainer","display","justifyContent","StyledCaption","Typography","lineHeight","StyledPageTitle","fontWeight","StyledPageDivider","Divider","marginBottom","PageTitle","title","_jsx","variant","component","children","StyledPageContainer","useAlternateBackground","backgroundColor","palette","alternateBackground","main","white","height","PageLayout","props","actionBtnTitle","caption","contextButtons","documentTitle","fullWidth","header","hideHeader","actionButtonLink","openLinkInNewTab","pageHeader","showActionButton","showAddIcon","titleComponent","TitleComponent","toPrevious","toParent","strictToParent","navigate","hideDivider","customActionButtons","titleComponentAfter","useTheme","isMobile","useMediaQuery","baseUrl","getMicroFrontendAttribute","actionButtonWithHttps","startsWith","actionButtonLinkFinal","undefined","joinUrlPaths","_jsxs","DocumentTitle","Spacer","size","_Fragment","container","direction","item","alignContent","map","button","index","Box","onClick","history","length","ArrowBackIcon","gap","Button","href","target","rel","Add","FullWidthContainer","FDErrorBoundary","identifier"],"mappings":"2xBAwBO,MAAMA,EAAW,KAGlBC,EAAgBC,EAAO,MAAPA,EAAkC,EAAGC,QAAOC,YAAa,CAC3EJ,SAAUI,EAAQ,OAASJ,EAC3B,CAACG,EAAME,YAAYC,KAAK,OAAQ,CAC5BN,SAAU,QAEdO,QAASJ,EAAMK,QAAQ,EAAG,GAC1BC,SAAU,WACVC,UAAW,YAGTC,EAAyBT,EAAOU,EAAPV,EAAa,EAAGC,YAAa,CACxD,CAACA,EAAME,YAAYC,KAAK,OAAQ,CAC5BO,MAAO,OACPC,WAAYX,EAAMK,QAAQ,QAI5BO,EAAeb,EAAOU,EAAPV,EAAa,EAAGC,YAAa,CAC9Ca,SAAU,SACVC,WAAY,aACZH,WAAYX,EAAMK,QAAQ,GAC1BU,cAAef,EAAMK,QAAQ,GAE7B,CAACL,EAAME,YAAYC,KAAK,OAAQ,CAC5BQ,WAAYX,EAAMK,QAAQ,GAC1BU,cAAef,EAAMK,QAAQ,QAI/BW,EAAuBjB,EAAOU,EAAPV,EAAa,EAAGC,YAAa,CACtDW,WAAYX,EAAMK,QAAQ,OAGxBY,EAAqBlB,EAAOU,EAAPV,EAAa,KAAO,CAC3CmB,SAAU,MAGRC,EAAmBpB,EAAO,MAAPA,EAAc,EAAGC,YAAa,CACnDH,WACAkB,cAAef,EAAMK,QAAQ,GAE7B,CAACL,EAAME,YAAYC,KAAK,OAAQ,CAC5BY,cAAef,EAAMK,QAAQ,GAC7Be,YAAapB,EAAMK,QAAQ,GAC3BgB,aAAcrB,EAAMK,QAAQ,QAI9BiB,EAAmBvB,EAAOwB,EAAY,CACxCC,kBAAoBC,GAAkB,sBAATA,GADR1B,EAG0B,EAAGC,QAAO0B,wBAAyB,CAClFC,OAAQD,EAAoB1B,EAAMK,SAAS,IAAM,GAAI,KAAM,KAAOL,EAAMK,SAAS,IAAK,GAAI,KAAM,KAEhG,CAACL,EAAME,YAAY0B,KAAK,OAAQ,CAC5BC,WAAY7B,EAAMK,SAAS,IAG/B,CAACL,EAAME,YAAY0B,KAAK,OAAQ,CAC5BC,WAAY7B,EAAMK,SAAS,QAI7ByB,EAAqB/B,EAAO,MAAPA,EAAc,EAAGC,YAAa,CACrDH,WACAgC,WAAY7B,EAAMK,QAAQ,GAC1B0B,YAAa/B,EAAMK,QAAQ,GAC3BU,cAAef,EAAMK,QAAQ,GAE7B,CAACL,EAAME,YAAY0B,KAAK,OAAQ,CAC5BC,WAAY,GACZE,YAAa/B,EAAMK,QAAQ,IAG/B,CAACL,EAAME,YAAY0B,KAAK,OAAQ,CAC5BC,WAAY7B,EAAMK,QAAQ,GAC1B0B,YAAa/B,EAAMK,QAAQ,GAC3BR,SAAU,QAGd,CAACG,EAAME,YAAY0B,KAAK,OAAQ,CAC5BC,WAAY7B,EAAMK,QAAQ,GAC1B0B,YAAa/B,EAAMK,QAAQ,GAC3BR,SAAU,YAIZmC,EAAwBjC,EAAOU,EAAPV,EAAa,KAAO,CAC9CkC,QAAS,OACTf,SAAU,EACVgB,eAAgB,eAEdC,EAAgBpC,EAAOqC,EAAPrC,EAA0C,KAAO,CACnEsC,WAAY,WAGVC,EAAkBvC,EAAOqC,EAAPrC,EAA0C,KAAO,CACrEwC,WAAY,WAGVC,EAAoBzC,EAAO0C,EAAP1C,EAAgB,EAAGC,YAAa,CACtD0C,aAAc1C,EAAMK,QAAQ,OAGnBsC,EAAY,EAAGC,WACxBC,EAACP,EAAgB,CAAAQ,QAAQ,KAAKC,UAAU,KACnCC,SAAAJ,IAIHK,EAAsBlD,EAAO,MAAPA,EAAmD,EAAGmD,yBAAwBlD,YAAa,CACnHmD,gBAAiBD,EAAyBlD,EAAMoD,QAAQC,oBAAoBC,KAAOtD,EAAMoD,QAAQG,MAAMD,KACvG5C,MAAO,OACP8C,OAAQ,WA+BNC,EAAcC,IAChB,MAAMC,eACFA,EAAcC,QACdA,EAAOZ,SACPA,EAAQa,eACRA,EAAcC,cACdA,EAAa7D,MACbA,GAAQ,EAAK8D,UACbA,EAASC,OACTA,EAAMC,WACNA,EAAUC,iBACVA,EAAgBC,iBAChBA,GAAmB,EAAKC,WACxBA,EAAUC,iBACVA,EAAgBC,YAChBA,EAAW1B,MACXA,EACA2B,eAAgBC,EAAcC,WAC9BA,EAAUC,SACVA,EAAQC,eACRA,EAAcC,SACdA,EAAQC,YACRA,GAAc,EAAKC,oBACnBA,EAAmB5B,uBACnBA,GAAyB,EAAK6B,oBAC9BA,GACArB,EACE1D,GAAQgF,IACRC,GAAWC,EAAclF,GAAME,YAAYC,KAAK,OAEhDgF,GAAUC,EAA0B,yBAA2B,IAC/DC,GAAwBnB,GAAkBoB,WAAW,YACrDC,GAAwBF,GACxBnB,OACqBsB,IAArBtB,EACEuB,EAAaN,GAASjB,GACtB,GAER,OACIrB,EAACI,EAAmB,CAACC,uBAAwBA,EACzCF,SAAA0C,EAAC5F,EAAa,CAACG,MAAOA,EACjB+C,SAAA,CAAAc,GAAiBjB,EAAC8C,EAAa,CAAA3C,SAAEc,IAEjCM,GAA0B,KAC3BsB,EAAC5D,EACI,CAAAkB,SAAA,CAAAoB,GAAcvB,EAAC+C,EAAM,CAACC,KAAM,GAAI/C,QAAQ,cACvCmB,GACEyB,EACII,EAAA,CAAA9C,SAAA,CAAA0C,EAAC9E,EAAY,CAACmF,WAAS,EAACjF,WAAW,SAASkF,UAAU,SAAQhD,SAAA,CAC1DH,EAACpC,GAAKwF,MAAI,EAACF,WAAS,EAACC,UAAU,MAAME,aAAa,gBAC9ClD,SAAAH,EAACb,EAAsB,CAAAiE,MAClB,EAAAjD,SAAAa,GAAkBA,EAAesC,KAAI,CAACC,EAAQC,IAAUxD,EAAkB,MAAA,CAAAG,SAAAoD,GAARC,SAG3EX,EAAC1E,EAAoB,CAACiF,MAAI,EAACF,WAAS,EAAA/C,SAAA,EAC9B0B,GAAYD,IACV5B,EAACyD,EAAG,CAAAtD,SACAH,EAACvB,EAAgB,CAAA,aACF,OAAM,cACL,cACZI,oBAAqB8C,EACrBzB,UAAW,SACXwD,QAAS,KACD9B,EACAG,GAAU,GACHF,GAAYC,GAEZD,GAAY8B,QAAQC,OArN1D,EAoN+B7B,EAASF,GAITE,GAAU,EACb,WAGL/B,EAAC6D,UAKbhB,EAACzE,EAAmB,CAAAgF,kBACfzB,EACG3B,EAAC2B,EAAc,CAAA,GAEf3B,EAAAiD,EAAA,CAAA9C,SACI0C,EAACY,EAAG,CAACrE,QAAQ,OAAOnB,WAAW,SAAS6F,IAAK,EAAC3D,SAAA,CAC1CH,EAACF,EAAS,CAACC,MAAOA,IACjBmC,OAIZnB,GACGf,EAACV,GAAcW,QAAQ,UAAUC,UAAU,KAAIC,SAC1CY,OAKZS,GACGqB,EAAAI,EAAA,CAAA9C,SAAA,CACKiC,IAAYpC,EAAC+C,EAAO,CAAAC,KAAM,GAAI/C,QAAQ,aACvCD,EAACrC,EAAuB,CAAAyF,iBACpBP,EAACkB,GACG9D,QAAQ,YACRiB,WAAW,EAAI,cACF,iBAAiBJ,IAC9BkD,KAAM1C,GAAoBkB,GAAwBE,GAAwB,GAC1EuB,OAAQ3C,EAAmB,cAAWqB,EACtCuB,IAAK5C,EAAmB,2BAAwBqB,EAChDe,QACKpC,GAAqBkB,GAA2D,OAAnC,IAAMT,EAASV,aAGhEI,GAAezB,EAACmE,EAAG,CAAA,GACnBrD,UAKhBmB,GACGA,EAAoBqB,KAAI,CAACC,EAAQC,IAC7BX,mBACKT,IAAYpC,EAAC+C,EAAM,CAACC,KAAM,GAAI/C,QAAQ,cACrCmC,IAAYpC,EAAC+C,EAAO,CAAAC,KAAM,GAAI/C,QAAQ,aACxCD,EAACrC,EAAsB,CAACyF,MAAM,EAAAjD,SAAAoD,MAHxBC,YAQxBxB,GAAehC,EAACL,EAAiB,CAAA,MAG3CkD,EAACuB,GAAmBlD,UAAWA,EAC1Bf,SAAA,CAAAgB,EAASnB,EAAC1B,EAAkB,CAAA6B,SAAAgB,IAA6B,KAC1DnB,EAACqE,EAAgB,CAAAC,WAAYrD,EAAad,SACtCH,EAAGiD,EAAA,CAAA9C,SAAAA,gBAMzB"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),i=require("@mui/material/Tooltip"),r=require("@mui/material/IconButton"),t=require("@mui/icons-material/InfoOutlined");module.exports=({text:u,iconSize:l="small"})=>e.jsx(i,{title:u,children:e.jsx(r,{children:e.jsx(t,{fontSize:l})})});
|
|
2
|
+
//# sourceMappingURL=Tooltip.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.cjs.js","sources":["../../../../src/components/ui/Tooltip/Tooltip.tsx"],"sourcesContent":["import MuiTooltip from '@mui/material/Tooltip';\nimport IconButton from '@mui/material/IconButton';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\n\nexport const ICON_SIZES = ['small', 'medium', 'large'] as const;\nexport type IconSize = (typeof ICON_SIZES)[number];\n\nexport type TooltipProps = {\n text: string;\n iconSize?: IconSize;\n};\n\nconst Tooltip = ({ text, iconSize = 'small' }: TooltipProps) => (\n <MuiTooltip title={text}>\n <IconButton>\n <InfoOutlinedIcon fontSize={iconSize} />\n </IconButton>\n </MuiTooltip>\n);\n\nexport default Tooltip;\n"],"names":["text","iconSize","_jsx","MuiTooltip","title","children","IconButton","InfoOutlinedIcon","fontSize"],"mappings":"sLAYgB,EAAGA,OAAMC,WAAW,WAChCC,EAAAA,IAACC,EAAU,CAACC,MAAOJ,EAAIK,SACnBH,EAAAA,IAACI,YACGJ,MAACK,EAAiB,CAAAC,SAAUP"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
|
|
3
|
+
declare const ICON_SIZES: readonly ["small", "medium", "large"];
|
|
4
|
+
type IconSize = (typeof ICON_SIZES)[number];
|
|
5
|
+
type TooltipProps = {
|
|
6
|
+
text: string;
|
|
7
|
+
iconSize?: IconSize;
|
|
8
|
+
};
|
|
9
|
+
declare const Tooltip: ({ text, iconSize }: TooltipProps) => react_jsx_runtime.JSX.Element;
|
|
10
|
+
|
|
11
|
+
export { ICON_SIZES, type IconSize, type TooltipProps, Tooltip as default };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import i from"@mui/material/Tooltip";import o from"@mui/material/IconButton";import m from"@mui/icons-material/InfoOutlined";const r=({text:r,iconSize:e="small"})=>t(i,{title:r,children:t(o,{children:t(m,{fontSize:e})})});export{r as default};
|
|
2
|
+
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/ui/Tooltip/Tooltip.tsx"],"sourcesContent":["import MuiTooltip from '@mui/material/Tooltip';\nimport IconButton from '@mui/material/IconButton';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\n\nexport const ICON_SIZES = ['small', 'medium', 'large'] as const;\nexport type IconSize = (typeof ICON_SIZES)[number];\n\nexport type TooltipProps = {\n text: string;\n iconSize?: IconSize;\n};\n\nconst Tooltip = ({ text, iconSize = 'small' }: TooltipProps) => (\n <MuiTooltip title={text}>\n <IconButton>\n <InfoOutlinedIcon fontSize={iconSize} />\n </IconButton>\n </MuiTooltip>\n);\n\nexport default Tooltip;\n"],"names":["Tooltip","text","iconSize","_jsx","MuiTooltip","title","children","IconButton","InfoOutlinedIcon","fontSize"],"mappings":"qKAYA,MAAMA,EAAU,EAAGC,OAAMC,WAAW,WAChCC,EAACC,EAAU,CAACC,MAAOJ,EAAIK,SACnBH,EAACI,YACGJ,EAACK,EAAiB,CAAAC,SAAUP"}
|