npm - @pega/cosmos-react-core - Versions diffs - 9.0.0-build.9.9 → 9.0.0 - Mend

@pega/cosmos-react-core 9.0.0-build.9.9 → 9.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1414) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"CategorySubPage.styles.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/CategorySubPage.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport Text from '../Text';\nimport Button from '../Button';\nimport { StyledTab } from '../Tabs/Tab';\nimport { calculateFontSize, getHoverColors, readableColor } from '../../styles';\nimport type { FontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\n\nexport const StyledSkipNavigation = styled(Button)(({ theme }) => {\n const {\n base: {\n palette: { 'primary-background': primaryBackground },\n spacing\n }\n } = theme;\n\n return css`\n position: absolute;\n top: ${spacing};\n left: -200vw;\n background-color: ${primaryBackground};\n padding: calc(2 * ${spacing});\n\n &:focus,\n &:active {\n left: ${spacing};\n }\n `;\n});\nStyledSkipNavigation.defaultProps = defaultThemeProp;\n\nexport const StyledNavItem = styled(StyledTab)(({ theme }) => {\n const {\n base: {\n breakpoints,\n palette: { interactive, 'app-background': hoverBase },\n spacing\n }\n } = theme;\n const hoverColors = getHoverColors(hoverBase);\n\n return css`\n height: auto;\n\n a,\n button {\n display: block;\n width: 100%;\n padding: calc(0.8 * ${spacing}) calc(2 * ${spacing});\n }\n\n &[aria-current='page'] {\n a {\n color: ${interactive};\n }\n\n &::after {\n background: ${interactive};\n }\n }\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n a,\n button {\n text-transform: uppercase;\n padding: calc(1.5 ${spacing}) 0;\n\n &:hover {\n text-decoration: none;\n }\n }\n }\n\n /* md or above / \"Desktop\" /\n @media all and (min-width: ${breakpoints.md}) {\n padding-left: 0;\n padding-right: 0;\n border: none;\n\n &::after {\n content: none;\n }\n\n a,\n button {\n &:hover,\n &:focus {\n background: ${hoverColors.background};\n color: ${hoverColors.foreground};\n text-decoration: none;\n }\n }\n }\n `;\n});\nStyledNavItem.defaultProps = defaultThemeProp;\n\nexport const StyledNavGroupHeader = styled(Text)(({ theme }) => {\n const {\n base: { spacing, breakpoints }\n } = theme;\n\n return css`\n padding: calc(1.5 ${spacing}) calc(2 * ${spacing});\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n display: none;\n }\n `;\n});\nStyledNavGroupHeader.defaultProps = defaultThemeProp;\n\nexport const StyledNavGroupList = styled.ul``;\n\nexport const StyledNavGroup = styled.li(({ theme }) => {\n const {\n base: { breakpoints, spacing }\n } = theme;\n\n return css`\n margin: calc(2 ${spacing}) 0;\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n margin: 0;\n }\n `;\n});\nStyledNavGroup.defaultProps = defaultThemeProp;\n\nexport const StyledNavList = styled.ul(({ theme }) => {\n const {\n base: { breakpoints }\n } = theme;\n\n return css`\n &&,\n li {\n list-style-type: none;\n }\n\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n white-space: nowrap;\n\n li,\n > div {\n display: inline-block;\n }\n }\n\n > ${StyledNavGroup}:first-child {\n margin-top: 0;\n }\n `;\n});\nStyledNavList.defaultProps = defaultThemeProp;\n\nexport const StyledNav = styled.nav``;\n\nexport const StyledCategoryIconBlock = styled.div(({ theme }) => {\n const {\n base: {\n palette: { 'brand-primary': brandPrimary },\n 'border-radius': baseBorderRadius,\n spacing\n }\n } = theme;\n\n const color = tryCatch(() => readableColor(brandPrimary));\n\n return css`\n background: ${brandPrimary};\n width: 2rem;\n height: 2rem;\n margin-inline-end: ${spacing};\n border-radius: calc(0.5 ${baseBorderRadius});\n\n svg {\n color: ${color};\n }\n `;\n});\nStyledCategoryIconBlock.defaultProps = defaultThemeProp;\n\nexport const StyledCategoryHeadingRow = styled.div(({ theme }) => {\n const {\n base: { breakpoints, spacing }\n } = theme;\n\n return css`\n padding: 0 calc(2 * ${spacing});\n margin-bottom: calc(2 * ${spacing});\n\n h1:focus-visible {\n outline: transparent;\n box-shadow: ${theme.base.shadow.focus};\n }\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n margin-bottom: ${spacing};\n }\n `;\n});\nStyledCategoryHeadingRow.defaultProps = defaultThemeProp;\n\nexport const StyledMenuColumn = styled.div(({ theme }) => {\n const {\n base: {\n palette: { 'app-background': appBackground },\n breakpoints,\n spacing\n }\n } = theme;\n\n return css`\n background-color: ${appBackground};\n position: sticky;\n top: 0;\n overflow-y: auto;\n max-height: 100%;\n width: 100%;\n padding: calc(2 ${spacing}) 0;\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n position: static;\n padding-bottom: 0;\n }\n\n / md or above /\n @media all and (min-width: ${breakpoints.md}) {\n max-width: 14.438rem;\n }\n\n / lg or above /\n @media all and (min-width: ${breakpoints.lg}) {\n max-width: 17.563rem;\n }\n\n / xl or above /\n @media all and (min-width: ${breakpoints.xl}) {\n max-width: 20.75rem;\n }\n `;\n});\nStyledMenuColumn.defaultProps = defaultThemeProp;\n\nexport const StyledPageTitle = styled.h2(({ theme }) => {\n const {\n base: {\n 'font-weight': { 'semi-bold': fontWeight },\n 'font-size': fontSize,\n 'font-scale': fontScale\n }\n } = theme;\n\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${fontSizes['m' as FontSize]};\n font-weight: ${fontWeight};\n `;\n});\nStyledPageTitle.defaultProps = defaultThemeProp;\n\nexport const StyledPageActionCol = styled.div``;\n\nexport const StyledArticleHeader = styled.header(({ theme }) => {\n const {\n base: {\n palette: { 'primary-background': primaryBackground },\n spacing\n }\n } = theme;\n\n return css`\n position: sticky;\n top: 0;\n z-index: 1;\n background-color: ${primaryBackground};\n padding: calc(2 ${spacing}) 0 calc(3 * ${spacing});\n `;\n});\nStyledArticleHeader.defaultProps = defaultThemeProp;\n\nexport const StyledPageArticle = styled.article(({ theme }) => {\n const {\n base: {\n breakpoints,\n palette: { 'primary-background': primaryBackground },\n spacing\n }\n } = theme;\n\n return css`\n position: relative;\n background-color: ${primaryBackground};\n width: 100%;\n max-height: 100%;\n overflow-y: auto;\n padding: 0 calc(3 * ${spacing}) calc(2 * ${spacing});\n\n &:focus {\n outline: none;\n }\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n padding: 0 calc(2 ${spacing}) calc(2 * ${spacing});\n }\n `;\n});\nStyledPageArticle.defaultProps = defaultThemeProp;\n\nexport const StyledTemplateRow = styled.div(({ theme }) => {\n const {\n base: { breakpoints }\n } = theme;\n\n return css`\n position: relative;\n height: 100%;\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) */\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n flex-direction: column;\n height: auto;\n }\n `;\n});\nStyledTemplateRow.defaultProps = defaultThemeProp;\n\nexport const StyledTemplate = styled.div`\n height: 0;\n min-height: inherit;\n`;\n"]}
1	+ {"version":3,"file":"CategorySubPage.styles.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/CategorySubPage.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport Text from '../Text';\nimport Button from '../Button';\nimport { StyledTab } from '../Tabs/Tab';\nimport { calculateFontSize, getHoverColors, readableColor } from '../../styles';\nimport type { FontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\n\nexport const StyledSkipNavigation = styled(Button)(({ theme }) => {\n const {\n base: {\n palette: { 'primary-background': primaryBackground },\n spacing\n }\n } = theme;\n\n return css`\n position: absolute;\n top: ${spacing};\n left: -200vw;\n background-color: ${primaryBackground};\n padding: calc(2 * ${spacing});\n\n &:focus,\n &:active {\n left: ${spacing};\n }\n `;\n});\nStyledSkipNavigation.defaultProps = defaultThemeProp;\n\nexport const StyledNavItem = styled(StyledTab)(({ theme }) => {\n const {\n base: {\n breakpoints,\n palette: { interactive, 'app-background': hoverBase },\n spacing\n }\n } = theme;\n const hoverColors = getHoverColors(hoverBase);\n\n return css`\n height: auto;\n\n a,\n button {\n display: block;\n width: 100%;\n padding: calc(0.8 * ${spacing}) calc(2 * ${spacing});\n }\n\n &[aria-current='page'] {\n a {\n color: ${interactive};\n }\n\n &::after {\n background: ${interactive};\n }\n }\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n a,\n button {\n text-transform: uppercase;\n padding: calc(1.5 ${spacing}) 0;\n\n &:hover {\n text-decoration: none;\n }\n }\n }\n\n /* md or above / \"Desktop\" /\n @media all and (min-width: ${breakpoints.md}) {\n padding-left: 0;\n padding-right: 0;\n border: none;\n\n &::after {\n content: none;\n }\n\n a,\n button {\n &:hover,\n &:focus {\n background: ${hoverColors.background};\n color: ${hoverColors.foreground};\n text-decoration: none;\n }\n }\n }\n `;\n});\nStyledNavItem.defaultProps = defaultThemeProp;\n\nexport const StyledNavGroupHeader = styled(Text)(({ theme }) => {\n const {\n base: { spacing, breakpoints }\n } = theme;\n\n return css`\n padding: calc(1.5 ${spacing}) calc(2 * ${spacing});\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n display: none;\n }\n `;\n});\nStyledNavGroupHeader.defaultProps = defaultThemeProp;\n\nexport const StyledNavGroupList = styled.ul``;\n\nexport const StyledNavGroup = styled.li(({ theme }) => {\n const {\n base: { breakpoints, spacing }\n } = theme;\n\n return css`\n margin: calc(2 ${spacing}) 0;\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n margin: 0;\n }\n `;\n});\nStyledNavGroup.defaultProps = defaultThemeProp;\n\nexport const StyledNavList = styled.ul(({ theme }) => {\n const {\n base: { breakpoints }\n } = theme;\n\n return css`\n &&,\n li {\n list-style-type: none;\n }\n\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n white-space: nowrap;\n\n li,\n > div {\n display: inline-block;\n }\n }\n\n > ${StyledNavGroup}:first-child {\n margin-top: 0;\n }\n `;\n});\nStyledNavList.defaultProps = defaultThemeProp;\n\nexport const StyledNav = styled.nav``;\n\nexport const StyledCategoryIconBlock = styled.div(({ theme }) => {\n const {\n base: {\n palette: { 'brand-primary': brandPrimary },\n 'border-radius': baseBorderRadius,\n spacing\n }\n } = theme;\n\n const color = tryCatch(() => readableColor(brandPrimary));\n\n return css`\n background: ${brandPrimary};\n width: 2rem;\n height: 2rem;\n margin-inline-end: ${spacing};\n border-radius: calc(0.5 ${baseBorderRadius});\n\n svg {\n color: ${color};\n }\n `;\n});\nStyledCategoryIconBlock.defaultProps = defaultThemeProp;\n\nexport const StyledCategoryHeadingRow = styled.div(({ theme }) => {\n const {\n base: { breakpoints, spacing }\n } = theme;\n\n return css`\n padding: 0 calc(2 * ${spacing});\n margin-bottom: calc(2 * ${spacing});\n\n h1:focus-visible {\n outline: transparent;\n box-shadow: ${theme.base.shadow.focus};\n }\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n margin-bottom: ${spacing};\n }\n `;\n});\nStyledCategoryHeadingRow.defaultProps = defaultThemeProp;\n\nexport const StyledMenuColumn = styled.div(({ theme }) => {\n const {\n base: {\n palette: { 'app-background': appBackground },\n breakpoints,\n spacing\n }\n } = theme;\n\n return css`\n background-color: ${appBackground};\n position: sticky;\n top: 0;\n height: 100%;\n min-height: 0;\n max-height: 100%;\n overflow-y: auto;\n width: 100%;\n padding: calc(2 ${spacing}) 0;\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n position: static;\n padding-bottom: 0;\n }\n\n / md or above /\n @media all and (min-width: ${breakpoints.md}) {\n max-width: 14.438rem;\n }\n\n / lg or above /\n @media all and (min-width: ${breakpoints.lg}) {\n max-width: 17.563rem;\n }\n\n / xl or above /\n @media all and (min-width: ${breakpoints.xl}) {\n max-width: 20.75rem;\n }\n `;\n});\nStyledMenuColumn.defaultProps = defaultThemeProp;\n\nexport const StyledPageTitle = styled.h2(({ theme }) => {\n const {\n base: {\n 'font-weight': { 'semi-bold': fontWeight },\n 'font-size': fontSize,\n 'font-scale': fontScale\n }\n } = theme;\n\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${fontSizes['m' as FontSize]};\n font-weight: ${fontWeight};\n `;\n});\nStyledPageTitle.defaultProps = defaultThemeProp;\n\nexport const StyledPageActionCol = styled.div``;\n\nexport const StyledArticleHeader = styled.header(({ theme }) => {\n const {\n base: {\n palette: { 'primary-background': primaryBackground },\n spacing\n }\n } = theme;\n\n return css`\n position: sticky;\n top: 0;\n z-index: 1;\n background-color: ${primaryBackground};\n padding: calc(2 ${spacing}) 0 calc(3 * ${spacing});\n `;\n});\nStyledArticleHeader.defaultProps = defaultThemeProp;\n\nexport const StyledPageArticle = styled.article(({ theme }) => {\n const {\n base: {\n breakpoints,\n palette: { 'primary-background': primaryBackground },\n spacing\n }\n } = theme;\n\n return css`\n position: relative;\n background-color: ${primaryBackground};\n width: 100%;\n height: 100%;\n min-height: 0;\n max-height: 100%;\n overflow-y: auto;\n padding: 0 calc(3 * ${spacing}) calc(2 * ${spacing});\n\n &:focus {\n outline: none;\n }\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n padding: 0 calc(2 ${spacing}) calc(2 * ${spacing});\n }\n `;\n});\nStyledPageArticle.defaultProps = defaultThemeProp;\n\nexport const StyledTemplateRow = styled.div(({ theme }) => {\n const {\n base: { breakpoints }\n } = theme;\n\n return css`\n position: relative;\n height: 100%;\n min-height: 0;\n\n /* sm or below / \"Mobile\" (note: 0.0625em = 1px) /\n @media all and (max-width: calc(${breakpoints.md} - 0.0625em)) {\n flex-direction: column;\n height: auto;\n min-height: inherit;\n }\n `;\n});\nStyledTemplateRow.defaultProps = defaultThemeProp;\n\nexport const StyledTemplate = styled.div(({ theme }) => {\n const {\n base: { breakpoints }\n } = theme;\n const templateHeight = 'calc(100dvh - var(--appshell-offset, 0rem))';\n\n return css`\n height: 100%;\n min-height: 0;\n\n / md or above / split-scroll layout */\n @media all and (min-width: ${breakpoints.md}) {\n height: ${templateHeight};\n min-height: ${templateHeight};\n max-height: ${templateHeight};\n overflow: hidden;\n }\n `;\n});\nStyledTemplate.defaultProps = defaultThemeProp;\n"]}

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

@@ -14,16 +14,22 @@ export interface DashboardPageLayoutProps extends PageLayoutProps {
     fitToViewport?: boolean;
     regionFullWidth: ReactNode[];
 }
-export declare const StyledFilterRegion: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+export declare const StyledFilterRegion: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "renderSingleRegion"> & {
     renderSingleRegion?: boolean;
-}, never>;
-export declare const StyledDashboardRegion: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+}, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledDashboardRegion: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "renderSingleRegion"> & {
     renderSingleRegion?: boolean;
-}, never>;
-export declare const StyledDashboardPageLayout: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+}, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledDashboardPageLayout: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "scrollContent" | "minContentHeight"> & {
     scrollContent: PageLayoutProps["scrollContent"];
     minContentHeight?: number;
-} & Pick<DashboardPageProps, "fitToViewport">, never>;
+}, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, Pick<DashboardPageProps, "fitToViewport">>> & string;
 declare const DashboardPage: ForwardRefForwardPropsComponent<DashboardPageProps>;
 export default DashboardPage;
 //# sourceMappingURL=DashboardPage.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DashboardPage.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIxD,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAYnE,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAE1E,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,eAAe;IAC/D,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,cAAc,CAAC,EAAE,aAAa,GAAG,cAAc,GAAG,YAAY,CAAC;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,EAAE,SAAS,EAAE,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB~~;;SAAyB~~,CAAC;AAIzD,eAAO,MAAM,qBAAqB~~;;SAEjC~~,CAAC;AAIF,eAAO,MAAM,yBAAyB~~;;;qDA8BpC~~,CAAC;AAqPH,QAAA,MAAM,aAAa,EAAE,+BAA+B,CAAC,kBAAkB,CAgGtE,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"DashboardPage.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIxD,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAYnE,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAE1E,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,eAAe;IAC/D,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,cAAc,CAAC,EAAE,aAAa,GAAG,cAAc,GAAG,YAAY,CAAC;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,EAAE,SAAS,EAAE,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB;;;;mBAAyB,CAAC;AAIzD,eAAO,MAAM,qBAAqB;;;;mBAEjC,CAAC;AAIF,eAAO,MAAM,yBAAyB;;;;;uDA8BpC,CAAC;AAqPH,QAAA,MAAM,aAAa,EAAE,+BAA+B,CAAC,kBAAkB,CAgGtE,CAAC;AAEF,eAAe,aAAa,CAAC"}

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

@@ -19,7 +19,7 @@ export const StyledDashboardRegion = styled(StyledRegion) `
 `;
 StyledDashboardRegion.defaultProps = defaultThemeProp;
 export const StyledDashboardPageLayout = styled(StyledPageLayout)(({ fitToViewport, theme: { base: { palette: { 'primary-background': primaryBackground, 'secondary-background': secondaryBackground } }, components: { tabs: { detached: detachedTabs } } } }) => {
-    const height = 'calc(100vh - var(--appshell-offset, 0rem))';
+    const height = 'calc(100dvh - var(--appshell-offset, 0rem))';
     return css `
     min-height: ${height};
     background-color: ${detachedTabs ? primaryBackground : secondaryBackground};

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DashboardPage.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, useEffect, useRef, useState } from 'react';\nimport type { PropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport Text from '../Text';\nimport SummaryItem from '../SummaryItem';\nimport Icon from '../Icon';\nimport Breadcrumbs from '../Breadcrumbs';\nimport { useBreakpoint, useConfiguration, useConsolidatedRef, useI18n } from '../../hooks';\nimport { focusHeadingOrContainer } from '../../utils';\nimport Tabs, { TabPanel } from '../Tabs';\n\nimport { StyledPageHeader, StyledPageLayout, StyledPageIcon, StyledRegion } from './PageTemplates';\nimport type { PageTemplateProps, PageLayoutProps } from './PageTemplates';\n\nexport interface DashboardPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n filters?: ReactNode[];\n fitToViewport?: boolean;\n}\n\nexport interface DashboardPageLayoutProps extends PageLayoutProps {\n filters?: ReactNode[];\n filterPosition?: 'block-start' \| 'inline-start' \| 'inline-end';\n fitToViewport?: boolean;\n regionFullWidth: ReactNode[];\n}\n\nexport const StyledFilterRegion = styled(StyledRegion)``;\n\nStyledFilterRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardRegion = styled(StyledRegion)`\n overflow: auto;\n`;\n\nStyledDashboardRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardPageLayout = styled(StyledPageLayout)<\n Pick<DashboardPageProps, 'fitToViewport'>\n>(({\n fitToViewport,\n theme: {\n base: {\n palette: {\n 'primary-background': primaryBackground,\n 'secondary-background': secondaryBackground\n }\n },\n components: {\n tabs: { detached: detachedTabs }\n }\n }\n}) => {\n const height = 'calc(100vh - var(--appshell-offset, 0rem))';\n\n return css`\n min-height: ${height};\n background-color: ${detachedTabs ? primaryBackground : secondaryBackground};\n ${fitToViewport &&\n css`\n height: ${height};\n `}\n\n [role='tabpanel'] & {\n padding: 0;\n }\n `;\n});\n\nStyledDashboardPageLayout.defaultProps = defaultThemeProp;\n\nconst DashboardPageLayout: ForwardRefForwardPropsComponent<DashboardPageLayoutProps> = forwardRef(\n function DashboardPageLayout(\n {\n regions,\n regionFullWidth,\n cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n filters,\n filterPosition = 'block-start',\n fitToViewport = false,\n title,\n icon,\n actions,\n banners,\n path,\n as,\n utilities,\n ...restProps\n }: PropsWithoutRef<DashboardPageLayoutProps>,\n ref: DashboardPageLayoutProps['ref']\n ) {\n const pageRef = useConsolidatedRef(ref);\n const { loadedRef } = useConfiguration();\n\n const isMediumOrAbove = useBreakpoint('md');\n\n useEffect(() => {\n if (!pageRef.current) return;\n\n if (loadedRef.current) {\n focusHeadingOrContainer(pageRef.current, title);\n } else {\n loadedRef.current = true;\n }\n }, [title]);\n\n const headerArea = useMemo(() => {\n if (filterPosition === 'block-start' \|\| !filters \|\| Object.keys(filters).length === 0) {\n return `'${Array.from({ length: regions.length }, () => 'header').join(' ')}'`;\n }\n return `'${Array.from({ length: regions.length + 1 }, () => 'header').join(' ')}'`;\n }, [filterPosition, filters, regions.length]);\n\n const bannerArea = `'${Array.from({ length: regions.length }, () => 'banner').join(' ')}'`;\n const filterArea = `'${Array.from({ length: regions.length }, () => 'filter').join(' ')}'`;\n\n const regionArea = useMemo(() => {\n if (filters && Object.keys(filters).length !== 0) {\n if (filterPosition === 'inline-start') {\n return `'filter ${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n ' '\n )}'`;\n }\n if (filterPosition === 'inline-end') {\n return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n ' '\n )} filter'`;\n }\n }\n return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(' ')}'`;\n }, [filterPosition, filters, regions.length]);\n\n const regionFullWidthArea = useMemo(() => {\n if (filters && Object.keys(filters).length !== 0) {\n if (filterPosition === 'inline-start') {\n return `'filter ${Array.from({ length: regions.length }, () => 'col-full-width').join(\n ' '\n )}'`;\n }\n if (filterPosition === 'inline-end') {\n return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(\n ' '\n )} filter'`;\n }\n }\n return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(' ')}'`;\n }, [filterPosition, filters, regions.length]);\n\n const renderFilters =\n filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0;\n const renderHeader = !!path \|\| !!icon \|\| !!title \|\| !!actions;\n const renderBanners = !!banners;\n\n const gridAreas = useMemo(() => {\n if (renderFilters && renderBanners && renderHeader) {\n return `${headerArea}\\n${bannerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderFilters && renderBanners) {\n return `\\n${bannerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderFilters && renderHeader) {\n return `${headerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderBanners && renderHeader) {\n return `${headerArea}\\n${bannerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderFilters) {\n return `\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderBanners) {\n return `${bannerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderHeader) {\n return `${headerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n return `${regionArea}\\n${regionFullWidthArea}`;\n }, [filterPosition, filters, banners, renderHeader, renderFilters, renderBanners]);\n\n const pageRows = useMemo(() => {\n if (fitToViewport) {\n if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n return banners ? 'auto auto auto 1fr 1fr' : 'auto auto 1fr 1fr';\n }\n return banners ? 'auto auto 1fr 1fr' : 'auto 1fr 1fr';\n }\n return 'fit-content(100%)';\n }, [filterPosition, banners]);\n\n if (filterPosition === 'inline-start' && filters && Object.keys(filters).length !== 0) {\n cols = '1fr 2fr 2fr';\n }\n\n if (filterPosition === 'inline-end' && filters && Object.keys(filters).length !== 0) {\n cols = '2fr 2fr 1fr';\n }\n\n return (\n <Grid\n {...restProps}\n as={StyledDashboardPageLayout}\n forwardedAs={as}\n fitToViewport={fitToViewport}\n container={{\n autoRows: 'max-content',\n cols: '1fr',\n gap: 2,\n pad: 2\n }}\n md={{\n container: {\n areas: gridAreas,\n rows: pageRows,\n cols\n }\n }}\n ref={pageRef}\n >\n {renderHeader && (isMediumOrAbove \|\| (!isMediumOrAbove && !utilities)) && (\n <Grid as={StyledPageHeader} md={{ item: { area: 'header' } }}>\n {path && path.length > 0 && <Breadcrumbs path={path} />}\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n </Grid>\n )}\n {banners && <Grid md={{ item: { area: 'banner' } }}>{banners}</Grid>}\n {filters && Object.keys(filters).length !== 0 && (\n <Grid\n as={StyledFilterRegion}\n container={{\n autoRows: 'max-content',\n gap: 2\n }}\n md={{\n container: {\n cols:\n filterPosition === 'block-start'\n ? 'repeat(4, minmax(min(20ch, 100%), 1fr))'\n : 'repeat(auto-fit, minmax(min(20ch, 100%), 1fr))'\n },\n item: { area: 'filter' }\n }}\n >\n {filters}\n </Grid>\n )}\n {regions.map((colItems: ReactNode, i: number) => {\n const key = `${i}`;\n return (\n <Flex\n container={{\n direction: 'column',\n justify: 'start',\n gap: 2\n }}\n as={StyledDashboardRegion}\n key={key}\n >\n {colItems}\n </Flex>\n );\n })}\n {regionFullWidth.map((colItems: ReactNode, i: number) => {\n const key = `${i}`;\n return (\n <Grid\n container={{\n cols: 'minmax(0, 1fr)',\n alignItems: 'start',\n gap: 2\n }}\n md={{ item: { area: 'col-full-width' } }}\n as={StyledDashboardRegion}\n key={key}\n >\n {colItems}\n </Grid>\n );\n })}\n </Grid>\n );\n }\n);\n\nconst StylePageTabContent = styled.div(({ theme }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing});\n ${StyledDashboardPageLayout} {\n padding: 0;\n min-height: unset;\n height: unset;\n }\n `;\n});\n\nStylePageTabContent.defaultProps = defaultThemeProp;\n\nconst DashboardPage: ForwardRefForwardPropsComponent<DashboardPageProps> = forwardRef(\n function DashboardPage(\n {\n a,\n b,\n c,\n filters,\n fitToViewport,\n utilities,\n path,\n icon,\n title,\n actions,\n ...restProps\n }: PropsWithoutRef<DashboardPageProps>,\n ref: DashboardPageProps['ref']\n ) {\n const isMediumOrAbove = useBreakpoint('md');\n const [panel, setPanel] = useState('content');\n const pageTabsRef = useRef<HTMLElement>(null);\n const t = useI18n();\n\n const pageContent = (\n <DashboardPageLayout\n {...restProps}\n cols='1fr 1fr'\n filters={filters}\n fitToViewport={fitToViewport}\n regions={[a, b]}\n regionFullWidth={[c]}\n utilities={utilities}\n path={path}\n icon={icon}\n title={title}\n actions={actions}\n ref={ref}\n />\n );\n\n const pageTabs = [\n { name: t('content'), id: 'content', content: pageContent },\n {\n name: t('chat_with_ai'),\n id: 'chat_with_ai',\n content: utilities\n }\n ];\n\n const handleTabChange = (id: string) => {\n setPanel(id);\n };\n\n if (utilities) {\n if (isMediumOrAbove) {\n return (\n <Flex container={{ gap: 0.5 }}>\n <Flex item={{ grow: 1 }}>{pageContent}</Flex>\n <div>{utilities}</div>\n </Flex>\n );\n }\n\n return (\n <Flex container={{ direction: 'column' }}>\n <Flex container={{ direction: 'column', pad: [2, 2, undefined] }} as={StyledPageHeader}>\n {path && path.length > 0 && <Breadcrumbs path={path} />}\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n <Tabs\n tabs={pageTabs}\n onTabClick={handleTabChange}\n currentTabId={panel}\n ref={pageTabsRef}\n />\n </Flex>\n\n {pageTabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panel} tablistRef={pageTabsRef} key={tab.id}>\n <StylePageTabContent>{tab.content}</StylePageTabContent>\n </TabPanel>\n ))}\n </Flex>\n );\n }\n\n return pageContent;\n }\n);\n\nexport default DashboardPage;\n"]}
1	+ {"version":3,"file":"DashboardPage.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, useEffect, useRef, useState } from 'react';\nimport type { PropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport Text from '../Text';\nimport SummaryItem from '../SummaryItem';\nimport Icon from '../Icon';\nimport Breadcrumbs from '../Breadcrumbs';\nimport { useBreakpoint, useConfiguration, useConsolidatedRef, useI18n } from '../../hooks';\nimport { focusHeadingOrContainer } from '../../utils';\nimport Tabs, { TabPanel } from '../Tabs';\n\nimport { StyledPageHeader, StyledPageLayout, StyledPageIcon, StyledRegion } from './PageTemplates';\nimport type { PageTemplateProps, PageLayoutProps } from './PageTemplates';\n\nexport interface DashboardPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n filters?: ReactNode[];\n fitToViewport?: boolean;\n}\n\nexport interface DashboardPageLayoutProps extends PageLayoutProps {\n filters?: ReactNode[];\n filterPosition?: 'block-start' \| 'inline-start' \| 'inline-end';\n fitToViewport?: boolean;\n regionFullWidth: ReactNode[];\n}\n\nexport const StyledFilterRegion = styled(StyledRegion)``;\n\nStyledFilterRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardRegion = styled(StyledRegion)`\n overflow: auto;\n`;\n\nStyledDashboardRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardPageLayout = styled(StyledPageLayout)<\n Pick<DashboardPageProps, 'fitToViewport'>\n>(({\n fitToViewport,\n theme: {\n base: {\n palette: {\n 'primary-background': primaryBackground,\n 'secondary-background': secondaryBackground\n }\n },\n components: {\n tabs: { detached: detachedTabs }\n }\n }\n}) => {\n const height = 'calc(100dvh - var(--appshell-offset, 0rem))';\n\n return css`\n min-height: ${height};\n background-color: ${detachedTabs ? primaryBackground : secondaryBackground};\n ${fitToViewport &&\n css`\n height: ${height};\n `}\n\n [role='tabpanel'] & {\n padding: 0;\n }\n `;\n});\n\nStyledDashboardPageLayout.defaultProps = defaultThemeProp;\n\nconst DashboardPageLayout: ForwardRefForwardPropsComponent<DashboardPageLayoutProps> = forwardRef(\n function DashboardPageLayout(\n {\n regions,\n regionFullWidth,\n cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n filters,\n filterPosition = 'block-start',\n fitToViewport = false,\n title,\n icon,\n actions,\n banners,\n path,\n as,\n utilities,\n ...restProps\n }: PropsWithoutRef<DashboardPageLayoutProps>,\n ref: DashboardPageLayoutProps['ref']\n ) {\n const pageRef = useConsolidatedRef(ref);\n const { loadedRef } = useConfiguration();\n\n const isMediumOrAbove = useBreakpoint('md');\n\n useEffect(() => {\n if (!pageRef.current) return;\n\n if (loadedRef.current) {\n focusHeadingOrContainer(pageRef.current, title);\n } else {\n loadedRef.current = true;\n }\n }, [title]);\n\n const headerArea = useMemo(() => {\n if (filterPosition === 'block-start' \|\| !filters \|\| Object.keys(filters).length === 0) {\n return `'${Array.from({ length: regions.length }, () => 'header').join(' ')}'`;\n }\n return `'${Array.from({ length: regions.length + 1 }, () => 'header').join(' ')}'`;\n }, [filterPosition, filters, regions.length]);\n\n const bannerArea = `'${Array.from({ length: regions.length }, () => 'banner').join(' ')}'`;\n const filterArea = `'${Array.from({ length: regions.length }, () => 'filter').join(' ')}'`;\n\n const regionArea = useMemo(() => {\n if (filters && Object.keys(filters).length !== 0) {\n if (filterPosition === 'inline-start') {\n return `'filter ${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n ' '\n )}'`;\n }\n if (filterPosition === 'inline-end') {\n return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n ' '\n )} filter'`;\n }\n }\n return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(' ')}'`;\n }, [filterPosition, filters, regions.length]);\n\n const regionFullWidthArea = useMemo(() => {\n if (filters && Object.keys(filters).length !== 0) {\n if (filterPosition === 'inline-start') {\n return `'filter ${Array.from({ length: regions.length }, () => 'col-full-width').join(\n ' '\n )}'`;\n }\n if (filterPosition === 'inline-end') {\n return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(\n ' '\n )} filter'`;\n }\n }\n return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(' ')}'`;\n }, [filterPosition, filters, regions.length]);\n\n const renderFilters =\n filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0;\n const renderHeader = !!path \|\| !!icon \|\| !!title \|\| !!actions;\n const renderBanners = !!banners;\n\n const gridAreas = useMemo(() => {\n if (renderFilters && renderBanners && renderHeader) {\n return `${headerArea}\\n${bannerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderFilters && renderBanners) {\n return `\\n${bannerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderFilters && renderHeader) {\n return `${headerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderBanners && renderHeader) {\n return `${headerArea}\\n${bannerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderFilters) {\n return `\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderBanners) {\n return `${bannerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n if (renderHeader) {\n return `${headerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n }\n\n return `${regionArea}\\n${regionFullWidthArea}`;\n }, [filterPosition, filters, banners, renderHeader, renderFilters, renderBanners]);\n\n const pageRows = useMemo(() => {\n if (fitToViewport) {\n if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n return banners ? 'auto auto auto 1fr 1fr' : 'auto auto 1fr 1fr';\n }\n return banners ? 'auto auto 1fr 1fr' : 'auto 1fr 1fr';\n }\n return 'fit-content(100%)';\n }, [filterPosition, banners]);\n\n if (filterPosition === 'inline-start' && filters && Object.keys(filters).length !== 0) {\n cols = '1fr 2fr 2fr';\n }\n\n if (filterPosition === 'inline-end' && filters && Object.keys(filters).length !== 0) {\n cols = '2fr 2fr 1fr';\n }\n\n return (\n <Grid\n {...restProps}\n as={StyledDashboardPageLayout}\n forwardedAs={as}\n fitToViewport={fitToViewport}\n container={{\n autoRows: 'max-content',\n cols: '1fr',\n gap: 2,\n pad: 2\n }}\n md={{\n container: {\n areas: gridAreas,\n rows: pageRows,\n cols\n }\n }}\n ref={pageRef}\n >\n {renderHeader && (isMediumOrAbove \|\| (!isMediumOrAbove && !utilities)) && (\n <Grid as={StyledPageHeader} md={{ item: { area: 'header' } }}>\n {path && path.length > 0 && <Breadcrumbs path={path} />}\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n </Grid>\n )}\n {banners && <Grid md={{ item: { area: 'banner' } }}>{banners}</Grid>}\n {filters && Object.keys(filters).length !== 0 && (\n <Grid\n as={StyledFilterRegion}\n container={{\n autoRows: 'max-content',\n gap: 2\n }}\n md={{\n container: {\n cols:\n filterPosition === 'block-start'\n ? 'repeat(4, minmax(min(20ch, 100%), 1fr))'\n : 'repeat(auto-fit, minmax(min(20ch, 100%), 1fr))'\n },\n item: { area: 'filter' }\n }}\n >\n {filters}\n </Grid>\n )}\n {regions.map((colItems: ReactNode, i: number) => {\n const key = `${i}`;\n return (\n <Flex\n container={{\n direction: 'column',\n justify: 'start',\n gap: 2\n }}\n as={StyledDashboardRegion}\n key={key}\n >\n {colItems}\n </Flex>\n );\n })}\n {regionFullWidth.map((colItems: ReactNode, i: number) => {\n const key = `${i}`;\n return (\n <Grid\n container={{\n cols: 'minmax(0, 1fr)',\n alignItems: 'start',\n gap: 2\n }}\n md={{ item: { area: 'col-full-width' } }}\n as={StyledDashboardRegion}\n key={key}\n >\n {colItems}\n </Grid>\n );\n })}\n </Grid>\n );\n }\n);\n\nconst StylePageTabContent = styled.div(({ theme }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing});\n ${StyledDashboardPageLayout} {\n padding: 0;\n min-height: unset;\n height: unset;\n }\n `;\n});\n\nStylePageTabContent.defaultProps = defaultThemeProp;\n\nconst DashboardPage: ForwardRefForwardPropsComponent<DashboardPageProps> = forwardRef(\n function DashboardPage(\n {\n a,\n b,\n c,\n filters,\n fitToViewport,\n utilities,\n path,\n icon,\n title,\n actions,\n ...restProps\n }: PropsWithoutRef<DashboardPageProps>,\n ref: DashboardPageProps['ref']\n ) {\n const isMediumOrAbove = useBreakpoint('md');\n const [panel, setPanel] = useState('content');\n const pageTabsRef = useRef<HTMLElement>(null);\n const t = useI18n();\n\n const pageContent = (\n <DashboardPageLayout\n {...restProps}\n cols='1fr 1fr'\n filters={filters}\n fitToViewport={fitToViewport}\n regions={[a, b]}\n regionFullWidth={[c]}\n utilities={utilities}\n path={path}\n icon={icon}\n title={title}\n actions={actions}\n ref={ref}\n />\n );\n\n const pageTabs = [\n { name: t('content'), id: 'content', content: pageContent },\n {\n name: t('chat_with_ai'),\n id: 'chat_with_ai',\n content: utilities\n }\n ];\n\n const handleTabChange = (id: string) => {\n setPanel(id);\n };\n\n if (utilities) {\n if (isMediumOrAbove) {\n return (\n <Flex container={{ gap: 0.5 }}>\n <Flex item={{ grow: 1 }}>{pageContent}</Flex>\n <div>{utilities}</div>\n </Flex>\n );\n }\n\n return (\n <Flex container={{ direction: 'column' }}>\n <Flex container={{ direction: 'column', pad: [2, 2, undefined] }} as={StyledPageHeader}>\n {path && path.length > 0 && <Breadcrumbs path={path} />}\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n <Tabs\n tabs={pageTabs}\n onTabClick={handleTabChange}\n currentTabId={panel}\n ref={pageTabsRef}\n />\n </Flex>\n\n {pageTabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panel} tablistRef={pageTabsRef} key={tab.id}>\n <StylePageTabContent>{tab.content}</StylePageTabContent>\n </TabPanel>\n ))}\n </Flex>\n );\n }\n\n return pageContent;\n }\n);\n\nexport default DashboardPage;\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EditorBackground.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorBackground.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAIhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;~~AAsErD~~,UAAU,qBAAsB,SAAQ,cAAc;IACpD,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,WAAW,EAAE,OAAO,CAAC;CACtB;AAED;;;GAGG;AACH,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAyC/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1	+ {"version":3,"file":"EditorBackground.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorBackground.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAIhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAuErD,UAAU,qBAAsB,SAAQ,cAAc;IACpD,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,WAAW,EAAE,OAAO,CAAC;CACtB;AAED;;;GAGG;AACH,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAyC/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

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

@@ -21,6 +21,7 @@ const StyledGridCell = styled.div(({ theme, highlighted, rowHeight }) => {
       border: 1px solid ${borderColor};
       background: ${background};
       block-size: ${rowHeight}px;
+      border-radius: ${theme.components.card['border-radius']};
     `;
 });
 StyledGridCell.defaultProps = defaultThemeProp;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EditorBackground.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorBackground.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,mBAAmB,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAK9B,CAAC;AAEF,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAC/B,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,EAAE;IACpC,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IACV,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IAClE,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;IAEzE,OAAO,GAAG,CAAA;;0BAEY,WAAW;oBACjB,UAAU;oBACV,SAAS;~~KACxB~~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","sourcesContent":["import type { FC } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { Layout } from 'react-grid-layout';\nimport { rgba } from 'polished';\n\nimport Grid from '../../Grid';\nimport type { NoChildrenProp } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport { useI18n } from '../../../hooks';\n\nimport useGridLayoutConfig from './config';\nimport { getArrayFromRange } from './utils';\n\nconst StyledGrid = styled(Grid)`\n position: absolute;\n z-index: -1;\n pointer-events: none;\n inline-size: 100%;\n`;\n\nconst StyledGridCell = styled.div<{ rowHeight: number; highlighted: boolean }>(\n ({ theme, highlighted, rowHeight }) => {\n const {\n base: { palette }\n } = theme;\n const borderColor = palette[highlighted ? 'warn' : 'border-line'];\n const background = highlighted ? rgba(palette.warn, 0.1) : 'transparent';\n\n return css`\n /* stylelint-disable-next-line unit-allowed-list /\n border: 1px solid ${borderColor};\n background: ${background};\n block-size: ${rowHeight}px;\n `;\n }\n);\nStyledGridCell.defaultProps = defaultThemeProp;\n\ninterface PageBreakProps {\n rowsAbove: number;\n rowHeight: number;\n margin: [number, number];\n containerPadding: [number, number];\n prefix: string;\n}\n\nconst StyledPageBreak = styled.div<PageBreakProps>(\n ({ containerPadding, rowHeight, theme, margin, rowsAbove, prefix }) => {\n const {\n base: { palette }\n } = theme;\n return css`\n position: absolute;\n inset-inline-start: ${containerPadding[0]}px;\n inset-inline-end: ${containerPadding[0]}px;\n inset-block-start: ${containerPadding[1] + rowsAbove (rowHeight + margin[1])}px;\n /* stylelint-disable-next-line unit-allowed-list /\n margin-block-start: ${-margin[1] / 2 - 1}px;\n / stylelint-disable-next-line unit-allowed-list /\n border-block-start: 2px dashed ${palette['border-line']};\n\n &::before {\n content: '${prefix}';\n position: absolute;\n font-size: 0.75rem;\n line-height: 1;\n transform: translate(0, -50%);\n background-color: ${palette['app-background']};\n color: ${palette['border-line']};\n padding-inline-end: 0.25rem;\n }\n `;\n }\n);\nStyledPageBreak.defaultProps = defaultThemeProp;\n\ninterface EditorBackgroundProps extends NoChildrenProp {\n layout?: Layout[];\n numColumns: number;\n rowHeight: number;\n rowsPerPage: number \| null; // null when not applying auto-fit\n highlighted: boolean;\n}\n\n/\n Renders background grid-cells for GridEditor\n * @component\n /\nconst EditorBackground: FC<EditorBackgroundProps> = ({\n layout,\n numColumns,\n rowHeight,\n rowsPerPage,\n highlighted\n}) => {\n const t = useI18n();\n const { margin, containerPadding } = useGridLayoutConfig(true);\n\n const maxYInLayout = layout ? Math.max(...layout.map(item => item.y + item.h)) : 0;\n const maxY = Math.max(maxYInLayout, rowsPerPage \|\| 0);\n const numGridCells = (maxY + 1) numColumns;\n const cells = getArrayFromRange(0, numGridCells, false);\n\n // rowsPerPage will be null if auto-fit is disabled. Don't show pageBreaks in that case.\n const numPageBreaks = rowsPerPage ? Math.floor(maxY / rowsPerPage) : 0;\n const pageBreaks = getArrayFromRange(0, numPageBreaks, false);\n\n return (\n <StyledGrid container={{ cols: `repeat(${numColumns}, 1fr)`, gap: 2, pad: [0, 2, 2, 2] }}>\n {cells.map(n => (\n <StyledGridCell\n key={n}\n rowHeight={rowHeight}\n // Highlight all cells except the dummy row at the bottom\n highlighted={highlighted && n < numGridCells - numColumns}\n />\n ))}\n {pageBreaks.map(n => (\n <StyledPageBreak\n key={n}\n rowsAbove={(n + 1) * rowsPerPage!}\n rowHeight={rowHeight}\n margin={margin}\n containerPadding={containerPadding}\n prefix={t('page_number', [n + 1])}\n />\n ))}\n </StyledGrid>\n );\n};\n\nexport default EditorBackground;\n"]}
1	+ {"version":3,"file":"EditorBackground.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorBackground.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FC } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { Layout } from 'react-grid-layout';\nimport { rgba } from 'polished';\n\nimport Grid from '../../Grid';\nimport type { NoChildrenProp } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport { useI18n } from '../../../hooks';\n\nimport useGridLayoutConfig from './config';\nimport { getArrayFromRange } from './utils';\n\nconst StyledGrid = styled(Grid)`\n position: absolute;\n z-index: -1;\n pointer-events: none;\n inline-size: 100%;\n`;\n\nconst StyledGridCell = styled.div<{ rowHeight: number; highlighted: boolean }>(\n ({ theme, highlighted, rowHeight }) => {\n const {\n base: { palette }\n } = theme;\n const borderColor = palette[highlighted ? 'warn' : 'border-line'];\n const background = highlighted ? rgba(palette.warn, 0.1) : 'transparent';\n\n return css`\n /* stylelint-disable-next-line unit-allowed-list /\n border: 1px solid ${borderColor};\n background: ${background};\n block-size: ${rowHeight}px;\n border-radius: ${theme.components.card['border-radius']};\n `;\n }\n);\nStyledGridCell.defaultProps = defaultThemeProp;\n\ninterface PageBreakProps {\n rowsAbove: number;\n rowHeight: number;\n margin: [number, number];\n containerPadding: [number, number];\n prefix: string;\n}\n\nconst StyledPageBreak = styled.div<PageBreakProps>(\n ({ containerPadding, rowHeight, theme, margin, rowsAbove, prefix }) => {\n const {\n base: { palette }\n } = theme;\n return css`\n position: absolute;\n inset-inline-start: ${containerPadding[0]}px;\n inset-inline-end: ${containerPadding[0]}px;\n inset-block-start: ${containerPadding[1] + rowsAbove (rowHeight + margin[1])}px;\n /* stylelint-disable-next-line unit-allowed-list /\n margin-block-start: ${-margin[1] / 2 - 1}px;\n / stylelint-disable-next-line unit-allowed-list /\n border-block-start: 2px dashed ${palette['border-line']};\n\n &::before {\n content: '${prefix}';\n position: absolute;\n font-size: 0.75rem;\n line-height: 1;\n transform: translate(0, -50%);\n background-color: ${palette['app-background']};\n color: ${palette['border-line']};\n padding-inline-end: 0.25rem;\n }\n `;\n }\n);\nStyledPageBreak.defaultProps = defaultThemeProp;\n\ninterface EditorBackgroundProps extends NoChildrenProp {\n layout?: Layout[];\n numColumns: number;\n rowHeight: number;\n rowsPerPage: number \| null; // null when not applying auto-fit\n highlighted: boolean;\n}\n\n/\n Renders background grid-cells for GridEditor\n * @component\n /\nconst EditorBackground: FC<EditorBackgroundProps> = ({\n layout,\n numColumns,\n rowHeight,\n rowsPerPage,\n highlighted\n}) => {\n const t = useI18n();\n const { margin, containerPadding } = useGridLayoutConfig(true);\n\n const maxYInLayout = layout ? Math.max(...layout.map(item => item.y + item.h)) : 0;\n const maxY = Math.max(maxYInLayout, rowsPerPage \|\| 0);\n const numGridCells = (maxY + 1) numColumns;\n const cells = getArrayFromRange(0, numGridCells, false);\n\n // rowsPerPage will be null if auto-fit is disabled. Don't show pageBreaks in that case.\n const numPageBreaks = rowsPerPage ? Math.floor(maxY / rowsPerPage) : 0;\n const pageBreaks = getArrayFromRange(0, numPageBreaks, false);\n\n return (\n <StyledGrid container={{ cols: `repeat(${numColumns}, 1fr)`, gap: 2, pad: [0, 2, 2, 2] }}>\n {cells.map(n => (\n <StyledGridCell\n key={n}\n rowHeight={rowHeight}\n // Highlight all cells except the dummy row at the bottom\n highlighted={highlighted && n < numGridCells - numColumns}\n />\n ))}\n {pageBreaks.map(n => (\n <StyledPageBreak\n key={n}\n rowsAbove={(n + 1) * rowsPerPage!}\n rowHeight={rowHeight}\n margin={margin}\n containerPadding={containerPadding}\n prefix={t('page_number', [n + 1])}\n />\n ))}\n </StyledGrid>\n );\n};\n\nexport default EditorBackground;\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EditorGridItem.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,YAAY,EAAyB,MAAM,OAAO,CAAC;AAKjG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAMnD,mDAAmD;AACnD,eAAO,MAAM,qBAAqB,iCAAiC,CAAC;~~AA8IpE~~,gDAAgD;AAChD,eAAO,MAAM,YAAY,sGAKvB,CAAC;AAEH,UAAU,mBAAoB,SAAQ,YAAY;IAChD,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7E,qBAAqB,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3F;AAED;;;GAGG;AACH,QAAA,MAAM,cAAc,6HAqEnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"EditorGridItem.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,YAAY,EAAyB,MAAM,OAAO,CAAC;AAKjG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAMnD,mDAAmD;AACnD,eAAO,MAAM,qBAAqB,iCAAiC,CAAC;AAoJpE,gDAAgD;AAChD,eAAO,MAAM,YAAY,sGAKvB,CAAC;AAEH,UAAU,mBAAoB,SAAQ,YAAY;IAChD,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7E,qBAAqB,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3F;AAED;;;GAGG;AACH,QAAA,MAAM,cAAc,6HAqEnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

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

@@ -16,6 +16,7 @@ const StyledWrapper = styled(Flex)(({ theme }) => {
     /* To create a new stacking context */
     z-index: 0;
     background-color: ${base.palette['primary-background']};
+    border-radius: ${components.card['border-radius']};
     .${resizeHandleClassName} {
       opacity: 0;
@@ -31,6 +32,11 @@ const StyledWrapper = styled(Flex)(({ theme }) => {
     &:focus,
     &:hover {
+      @media (forced-colors: none) {
+        /* Suppress browser default focus ring only when forced colors are not active;
+            custom ::after border serves as the indicator */
+        outline: none;
+      }
       &::after {
         border: 0.125rem solid ${base.palette.interactive};

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EditorGridItem.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, type KeyboardEvent, type ReactElement, type Ref, useCallback } from 'react';\nimport type { CoreProps } from 'react-grid-layout';\nimport styled, { css, type FlattenSimpleInterpolation } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport type { ForwardProps } from '../../../types';\nimport { getFocusables } from '../../../utils';\nimport { defaultThemeProp } from '../../../theme';\n\nimport { hasNonNullProp } from './utils';\n\n/** CSS Class name for GridEditor resize-handles /\nexport const resizeHandleClassName = 'gridLayoutCustomResizeHandle';\n\n// To appear above the child contents at all times\nconst StyledWrapper = styled(Flex)(({ theme }) => {\n const { base, components } = theme;\n return css`\n position: relative;\n\n / To create a new stacking context /\n z-index: 0;\n background-color: ${base.palette['primary-background']};\n\n .${resizeHandleClassName} {\n opacity: 0;\n }\n\n / To mask the child content from getting clicked when dragging a grid item /\n &::after {\n content: '';\n position: absolute;\n z-index: ${base['z-index'].max - 1};\n inset: 0;\n }\n\n &:focus,\n &:hover {\n &::after {\n border: 0.125rem solid ${base.palette.interactive};\n\n / For widgets where the interactive border might not be visible /\n outline: 0.125rem solid ${components.card.background};\n outline-offset: -0.25rem;\n }\n .${resizeHandleClassName} {\n opacity: 1;\n }\n }\n `;\n});\nStyledWrapper.defaultProps = defaultThemeProp;\n\ntype ResizeAxis = NonNullable<CoreProps['resizeHandles']>[number];\n\nconst axisWiseStyles: Record<ResizeAxis, FlattenSimpleInterpolation> = {\n n: css`\n inset-block-start: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0.875rem;\n cursor: n-resize;\n `,\n s: css`\n inset-block-end: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0;\n cursor: s-resize;\n `,\n e: css`\n inset-inline-end: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.375rem;\n cursor: e-resize;\n `,\n w: css`\n inset-inline-start: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.375rem;\n cursor: w-resize;\n `,\n ne: css`\n inset-block-start: 0;\n inset-inline-end: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.875rem;\n cursor: ne-resize;\n `,\n nw: css`\n inset-block-start: 0;\n inset-inline-start: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.875rem;\n cursor: nw-resize;\n `,\n sw: css`\n inset-block-end: 0;\n inset-inline-start: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0;\n cursor: sw-resize;\n `,\n se: css`\n inset-block-end: 0;\n inset-inline-end: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0;\n cursor: se-resize;\n `\n};\n\nconst StyledHandle = styled.div<{ axis: ResizeAxis }>(({ theme, axis }) => {\n const { base } = theme;\n return css`\n position: absolute;\n z-index: ${base['z-index'].max};\n inline-size: 1.25rem;\n block-size: 1.25rem;\n border: solid transparent;\n\n / Using box-shadow instead of background coz the latter will be visible underneath the border as well. /\n / We still want the 20x20 clickable region, but an 8x8 visible region. /\n box-shadow:\n inset 0.25rem 0.25rem 0 ${base.palette.interactive},\n inset -0.25rem -0.25rem 0 ${base.palette.interactive};\n\n ${axisWiseStyles[axis]}\n `;\n});\nStyledHandle.defaultProps = defaultThemeProp;\n\n/* Custom resize-handle for GridLayoutEditor /\nexport const ResizeHandle = forwardRef((props: any, ref) => {\n const { handleAxis, ...restProps } = props;\n return (\n <StyledHandle ref={ref} axis={handleAxis} className={resizeHandleClassName} {...restProps} />\n );\n});\n\ninterface EditorGridItemProps extends ForwardProps {\n children: ReactElement;\n itemKey: ReactElement['key'];\n itemLabel: string;\n moveItem: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n addOrSubtractItemSize: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n}\n\n/\n Wrapper on top of GridItems to provide custom styling etc.\n * https://github.com/react-grid-layout/react-grid-layout#custom-child-components-and-draggable-handles\n */\nconst EditorGridItem = forwardRef(\n (\n {\n children,\n itemKey,\n itemLabel,\n moveItem,\n addOrSubtractItemSize,\n ...restProps\n }: EditorGridItemProps,\n ref: Ref<HTMLDivElement>\n ) => {\n const handleKeyUp = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n switch (e.key) {\n case 'ArrowUp':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, -1);\n else moveItem(itemKey, 0, -1);\n break;\n case 'ArrowDown':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, 1);\n else moveItem(itemKey, 0, 1);\n break;\n case 'ArrowLeft':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, -1, 0);\n else moveItem(itemKey, -1, 0);\n break;\n case 'ArrowRight':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 1, 0);\n else moveItem(itemKey, 1, 0);\n break;\n // Do nothing\n default:\n }\n },\n [addOrSubtractItemSize, itemKey, moveItem]\n );\n\n // To keep the experience smoother, disabling all interactions on the child content of grid items.\n // The CSS `::after` mask prevents interactions through mouse clicks.\n // This method prevents interactions through keyboard navigation.\n // Not doing this from a `useEffect` since some of the child content can render after server calls etc.\n const disableChildrenFocus = useCallback(() => {\n if (!ref) return;\n // In case RGL ever uses a RefCallback instead of a RefObject\n if (!hasNonNullProp(ref, 'current')) return;\n\n const focusables = getFocusables(ref);\n focusables.forEach(elem => {\n elem.tabIndex = -1;\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <StyledWrapper\n container={{ direction: 'column' }}\n ref={ref}\n {...restProps}\n role='listitem'\n tabIndex={0}\n aria-label={itemLabel}\n onKeyUp={handleKeyUp}\n onFocus={disableChildrenFocus}\n >\n {children}\n </StyledWrapper>\n );\n }\n);\n\nexport default EditorGridItem;\n"]}
1	+ {"version":3,"file":"EditorGridItem.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, type KeyboardEvent, type ReactElement, type Ref, useCallback } from 'react';\nimport type { CoreProps } from 'react-grid-layout';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport type { ForwardProps } from '../../../types';\nimport { getFocusables } from '../../../utils';\nimport { defaultThemeProp } from '../../../theme';\n\nimport { hasNonNullProp } from './utils';\n\n/** CSS Class name for GridEditor resize-handles /\nexport const resizeHandleClassName = 'gridLayoutCustomResizeHandle';\n\n// To appear above the child contents at all times\nconst StyledWrapper = styled(Flex)(({ theme }) => {\n const { base, components } = theme;\n return css`\n position: relative;\n\n / To create a new stacking context /\n z-index: 0;\n background-color: ${base.palette['primary-background']};\n border-radius: ${components.card['border-radius']};\n\n .${resizeHandleClassName} {\n opacity: 0;\n }\n\n / To mask the child content from getting clicked when dragging a grid item /\n &::after {\n content: '';\n position: absolute;\n z-index: ${base['z-index'].max - 1};\n inset: 0;\n }\n\n &:focus,\n &:hover {\n @media (forced-colors: none) {\n / Suppress browser default focus ring only when forced colors are not active;\n custom ::after border serves as the indicator /\n outline: none;\n }\n &::after {\n border: 0.125rem solid ${base.palette.interactive};\n\n / For widgets where the interactive border might not be visible /\n outline: 0.125rem solid ${components.card.background};\n outline-offset: -0.25rem;\n }\n .${resizeHandleClassName} {\n opacity: 1;\n }\n }\n `;\n});\nStyledWrapper.defaultProps = defaultThemeProp;\n\ntype ResizeAxis = NonNullable<CoreProps['resizeHandles']>[number];\n\nconst axisWiseStyles: Record<ResizeAxis, ReturnType<typeof css>> = {\n n: css`\n inset-block-start: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0.875rem;\n cursor: n-resize;\n `,\n s: css`\n inset-block-end: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0;\n cursor: s-resize;\n `,\n e: css`\n inset-inline-end: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.375rem;\n cursor: e-resize;\n `,\n w: css`\n inset-inline-start: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.375rem;\n cursor: w-resize;\n `,\n ne: css`\n inset-block-start: 0;\n inset-inline-end: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.875rem;\n cursor: ne-resize;\n `,\n nw: css`\n inset-block-start: 0;\n inset-inline-start: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.875rem;\n cursor: nw-resize;\n `,\n sw: css`\n inset-block-end: 0;\n inset-inline-start: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0;\n cursor: sw-resize;\n `,\n se: css`\n inset-block-end: 0;\n inset-inline-end: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0;\n cursor: se-resize;\n `\n};\n\nconst StyledHandle = styled.div<{ axis: ResizeAxis }>(({ theme, axis }) => {\n const { base } = theme;\n return css`\n position: absolute;\n z-index: ${base['z-index'].max};\n inline-size: 1.25rem;\n block-size: 1.25rem;\n border: solid transparent;\n\n / Using box-shadow instead of background coz the latter will be visible underneath the border as well. /\n / We still want the 20x20 clickable region, but an 8x8 visible region. /\n box-shadow:\n inset 0.25rem 0.25rem 0 ${base.palette.interactive},\n inset -0.25rem -0.25rem 0 ${base.palette.interactive};\n\n ${axisWiseStyles[axis]}\n `;\n});\nStyledHandle.defaultProps = defaultThemeProp;\n\n/* Custom resize-handle for GridLayoutEditor /\nexport const ResizeHandle = forwardRef((props: any, ref) => {\n const { handleAxis, ...restProps } = props;\n return (\n <StyledHandle ref={ref} axis={handleAxis} className={resizeHandleClassName} {...restProps} />\n );\n});\n\ninterface EditorGridItemProps extends ForwardProps {\n children: ReactElement;\n itemKey: ReactElement['key'];\n itemLabel: string;\n moveItem: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n addOrSubtractItemSize: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n}\n\n/\n Wrapper on top of GridItems to provide custom styling etc.\n * https://github.com/react-grid-layout/react-grid-layout#custom-child-components-and-draggable-handles\n */\nconst EditorGridItem = forwardRef(\n (\n {\n children,\n itemKey,\n itemLabel,\n moveItem,\n addOrSubtractItemSize,\n ...restProps\n }: EditorGridItemProps,\n ref: Ref<HTMLDivElement>\n ) => {\n const handleKeyUp = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n switch (e.key) {\n case 'ArrowUp':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, -1);\n else moveItem(itemKey, 0, -1);\n break;\n case 'ArrowDown':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, 1);\n else moveItem(itemKey, 0, 1);\n break;\n case 'ArrowLeft':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, -1, 0);\n else moveItem(itemKey, -1, 0);\n break;\n case 'ArrowRight':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 1, 0);\n else moveItem(itemKey, 1, 0);\n break;\n // Do nothing\n default:\n }\n },\n [addOrSubtractItemSize, itemKey, moveItem]\n );\n\n // To keep the experience smoother, disabling all interactions on the child content of grid items.\n // The CSS `::after` mask prevents interactions through mouse clicks.\n // This method prevents interactions through keyboard navigation.\n // Not doing this from a `useEffect` since some of the child content can render after server calls etc.\n const disableChildrenFocus = useCallback(() => {\n if (!ref) return;\n // In case RGL ever uses a RefCallback instead of a RefObject\n if (!hasNonNullProp(ref, 'current')) return;\n\n const focusables = getFocusables(ref);\n focusables.forEach(elem => {\n elem.tabIndex = -1;\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <StyledWrapper\n container={{ direction: 'column' }}\n ref={ref}\n {...restProps}\n role='listitem'\n tabIndex={0}\n aria-label={itemLabel}\n onKeyUp={handleKeyUp}\n onFocus={disableChildrenFocus}\n >\n {children}\n </StyledWrapper>\n );\n }\n);\n\nexport default EditorGridItem;\n"]}

package/lib/components/PageTemplates/GridLayout/GridLayoutEditor.d.ts CHANGED Viewed

@@ -60,6 +60,12 @@ export interface GridLayoutEditorProps {
     children?: ReactElement[];
     /** Item label mapped with item id for a11y */
     itemLabelMap: Record<string, string>;
+    /**
+     * Optional minimum row height (px) to override the built-in defaults.
+     * Useful when grid items contain content that requires more vertical space
+     * than the default minimum (e.g. compact SimpleValue insights).
+     */
+    minRowHeight?: number;
 }
 /**
  * Editor component to create Grid Layouts

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GridLayoutEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/GridLayoutEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,EAAE,EACP,KAAK,YAAY,EACjB,KAAK,GAAG,EAMT,MAAM,OAAO,CAAC;AACf,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,mBAAmB,CAAC;AAO3B,OAA4B,EAAE,KAAK,wBAAwB,EAAE,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AAGpG,OAAO,EAML,KAAK,kBAAkB,EACxB,MAAM,SAAS,CAAC;AA6BjB,MAAM,WAAW,qBAAqB;IACpC,0IAA0I;IAC1I,cAAc,EAAE,MAAM,eAAe,GAAG,SAAS,CAAC;IAElD;;;OAGG;IACH,YAAY,EAAE,MAAM,OAAO,CAAC;CAC7B;AAED,2CAA2C;AAC3C,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,aAAa,EAAE,CAAC,QAAQ,EAAE,eAAe,GAAG,SAAS,KAAK,IAAI,CAAC;IAE/D;;;;;OAKG;IACH,WAAW,EAAE,eAAe,GAAG,SAAS,CAAC;IAEzC;;;OAGG;IACH,WAAW,EAAE,wBAAwB,CAAC;IAEtC;;;OAGG;IACH,IAAI,EAAE,kBAAkB,CAAC;IAEzB;;;OAGG;IACH,IAAI,EAAE,wBAAwB,CAAC;IAE/B;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAE7C,+FAA+F;IAC/F,MAAM,CAAC,EAAE,GAAG,CAAC,qBAAqB,CAAC,CAAC;IAEpC;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAE1B,8CAA8C;IAC9C,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;~~CACtC~~;AAED;;;GAGG;AACH,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,~~CAkL~~/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1	+ {"version":3,"file":"GridLayoutEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/GridLayoutEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,EAAE,EACP,KAAK,YAAY,EACjB,KAAK,GAAG,EAMT,MAAM,OAAO,CAAC;AACf,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,mBAAmB,CAAC;AAO3B,OAA4B,EAAE,KAAK,wBAAwB,EAAE,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AAGpG,OAAO,EAML,KAAK,kBAAkB,EACxB,MAAM,SAAS,CAAC;AA6BjB,MAAM,WAAW,qBAAqB;IACpC,0IAA0I;IAC1I,cAAc,EAAE,MAAM,eAAe,GAAG,SAAS,CAAC;IAElD;;;OAGG;IACH,YAAY,EAAE,MAAM,OAAO,CAAC;CAC7B;AAED,2CAA2C;AAC3C,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,aAAa,EAAE,CAAC,QAAQ,EAAE,eAAe,GAAG,SAAS,KAAK,IAAI,CAAC;IAE/D;;;;;OAKG;IACH,WAAW,EAAE,eAAe,GAAG,SAAS,CAAC;IAEzC;;;OAGG;IACH,WAAW,EAAE,wBAAwB,CAAC;IAEtC;;;OAGG;IACH,IAAI,EAAE,kBAAkB,CAAC;IAEzB;;;OAGG;IACH,IAAI,EAAE,wBAAwB,CAAC;IAE/B;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAE7C,+FAA+F;IAC/F,MAAM,CAAC,EAAE,GAAG,CAAC,qBAAqB,CAAC,CAAC;IAEpC;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAE1B,8CAA8C;IAC9C,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAErC;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;GAGG;AACH,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA2L/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

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

@@ -35,7 +35,7 @@ StyledEditor.defaultProps = defaultThemeProp;
  * Editor component to create Grid Layouts
  * @component
  */
-const GridLayoutEditor = ({ handle, children, layoutModel, rows, onModelChange, itemLabelMap, ...restProps }) => {
+const GridLayoutEditor = ({ handle, children, layoutModel, rows, onModelChange, itemLabelMap, minRowHeight: minRowHeightProp, ...restProps }) => {
     // Track width changes: https://github.com/react-grid-layout/react-grid-layout#providing-grid-width
     const [wrapperEl, setWrapperEl] = useElement();
     const size = useMonitoredSize(wrapperEl);
@@ -44,7 +44,7 @@ const GridLayoutEditor = ({ handle, children, layoutModel, rows, onModelChange,
     const commonGridConfig = useGridLayoutConfig(true);
     const t = useI18n();
     const { breakpoint, numColumns } = useMemo(() => getBreakpointAndCols(width || 0, restProps.breakpoints, restProps.cols), [width, restProps.breakpoints, restProps.cols]);
-    const { rowHeight, numRowsPerPage } = useMemo(() => getRowHeight(breakpoint, height || 0, commonGridConfig.margin[0], rows, layoutModel), [breakpoint, commonGridConfig.margin, height, rows, layoutModel]);
+    const { rowHeight, numRowsPerPage } = useMemo(() => getRowHeight(breakpoint, height || 0, commonGridConfig.margin[0], rows, layoutModel, minRowHeightProp), [breakpoint, commonGridConfig.margin, height, rows, layoutModel, minRowHeightProp]);
     const currentLayout = useMemo(() => layoutModel?.[breakpoint], [breakpoint, layoutModel]);
     const onLayoutChange = useCallback((curLayout, allLayouts) => {
         onModelChange(!children || children.length === 0 ? undefined : allLayouts);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GridLayoutEditor.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/GridLayoutEditor.tsx"],"names":[],"mappings":";AAAA,OAAO,EAIL,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,OAAO,EACP,QAAQ,EACT,MAAM,OAAO,CAAC;AACf,OAAO,EACL,UAAU,IAAI,oBAAoB,EAInC,MAAM,mBAAmB,CAAC;AAC3B,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,mBAAmB,EAAE,EAAuD,MAAM,UAAU,CAAC;AACpG,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAClD,OAAO,cAAc,EAAE,EAAE,YAAY,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AACvF,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAEjB,MAAM,SAAS,CAAC;AACjB,OAAO,oBAAoB,MAAM,wBAAwB,CAAC;AAC1D,OAAO,qBAAqB,MAAM,yBAAyB,CAAC;AAE5D,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9C,MAAM,EACJ,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,WAAW,EAAE,EACzB,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;;;;;;;;;;;oBAYQ,WAAW;;;GAG5B,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAwE7C;;;GAGG;AACH,MAAM,gBAAgB,GAA8B,CAAC,EACnD,MAAM,EACN,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,aAAa,EACb,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,EAAE;IACH,mGAAmG;IACnG,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAe,CAAC;IAC5D,MAAM,IAAI,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAC;IACzC,MAAM,KAAK,GAAG,IAAI,EAAE,KAAK,CAAC;IAC1B,MAAM,MAAM,GAAG,IAAI,EAAE,MAAM,CAAC;IAC5B,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,IAAI,CAAC,CAAC;IACnD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,OAAO,CACxC,GAAG,EAAE,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC,EAAE,SAAS,CAAC,WAAW,EAAE,SAAS,CAAC,IAAI,CAAC,EAC7E,CAAC,KAAK,EAAE,SAAS,CAAC,WAAW,EAAE,SAAS,CAAC,IAAI,CAAC,CAC/C,CAAC;IACF,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,GAAG,OAAO,CAC3C,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,MAAM,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,WAAW,CAAC,EAC1F,CAAC,UAAU,EAAE,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,CAAC,CACjE,CAAC;IACF,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE1F,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,SAAmB,EAAE,UAAmB,EAAE,EAAE;QAC3C,aAAa,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;IAC7E,CAAC,EACD,CAAC,QAAQ,EAAE,aAAa,CAAC,CAC1B,CAAC;IAEF,wEAAwE;IACxE,MAAM,cAAc,GAAG,iBAAiB,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;IAEpE,gCAAgC;IAChC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,UAAU,EAAe,CAAC;IACtD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,EAAE,CAAC;YACX,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;YACpC,MAAM,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;YACrC,MAAM,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,kCAAkC,CAAC,CAAC,CAAC;QAC3E,CAAC;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;IAEhB,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,OAA4B,EAAE,MAAc,EAAE,MAAc,EAAE,EAAE;QAC/D,sCAAsC;QACtC,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,MAAM,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC;QACtE,wDAAwD;QACxD,IAAI,SAAS,KAAK,CAAC,CAAC;YAAE,OAAO;QAE7B,MAAM,OAAO,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;QACzC,MAAM,OAAO,GAAW;YACtB,GAAG,OAAO;YACV,4EAA4E;YAC5E,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC;YAClC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC;SACnC,CAAC;QACF,MAAM,SAAS,GAAG;YAChB,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC;YACpC,OAAO;YACP,GAAG,aAAa,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC;SACtC,CAAC;QACF,MAAM,QAAQ,GAAG,EAAE,GAAG,WAAW,EAAE,CAAC,UAAU,CAAC,EAAE,SAAS,EAAE,CAAC;QAC7D,aAAa,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC3E,CAAC,EACD,CAAC,UAAU,EAAE,QAAQ,EAAE,aAAa,EAAE,WAAW,EAAE,aAAa,CAAC,CAClE,CAAC;IAEF,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,OAA4B,EAAE,MAAc,EAAE,MAAc,EAAE,EAAE;QAC/D,sCAAsC;QACtC,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,MAAM,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC;QACtE,wDAAwD;QACxD,IAAI,SAAS,KAAK,CAAC,CAAC;YAAE,OAAO;QAE7B,MAAM,OAAO,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;QACzC,MAAM,OAAO,GAAW;YACtB,GAAG,OAAO;YACV,4EAA4E;YAC5E,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC;YAClD,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC;SACnD,CAAC;QACF,MAAM,SAAS,GAAG;YAChB,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC;YACpC,OAAO;YACP,GAAG,aAAa,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC;SACtC,CAAC;QACF,MAAM,QAAQ,GAAG,EAAE,GAAG,WAAW,EAAE,CAAC,UAAU,CAAC,EAAE,SAAS,EAAE,CAAC;QAC7D,aAAa,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC3E,CAAC,EACD,CAAC,UAAU,EAAE,QAAQ,EAAE,aAAa,EAAE,WAAW,EAAE,aAAa,CAAC,CAClE,CAAC;IAEF,uEAAuE;IACvE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1D,mBAAmB,CACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,cAAc,EAAE,GAAG,EAAE;YACnB,wFAAwF;YACxF,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC;gBAAE,OAAO,SAAS,CAAC;YACzD,OAAO,WAAW,CAAC;QACrB,CAAC;QAED,YAAY,EAAE,GAAG,EAAE;YACjB,mCAAmC;YACnC,IAAI,CAAC,aAAa;gBAAE,OAAO,IAAI,CAAC;YAChC,MAAM,OAAO,GAAG,kBAAkB,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;YAC9D,gBAAgB,CAAC,OAAO,CAAC,CAAC;YAC1B,OAAO,OAAO,CAAC;QACjB,CAAC;KACF,CAAC,EACF,CAAC,QAAQ,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,CAAC,CACnD,CAAC;IAEF,OAAO;IACL,mFAAmF;IACnF,MAAC,YAAY,IAAC,GAAG,EAAE,YAAY,EAAE,GAAG,EAAC,KAAK,aACxC,KAAC,oBAAoB,KAAG,EACxB,KAAC,qBAAqB,KAAG,EAExB,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,MAAM,IAAI,CACtB,8BACE,KAAC,gBAAgB,mBACH,QAAQ,EACpB,MAAM,EAAE,aAAa,EACrB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,cAAc,EAC3B,WAAW,EAAE,aAAa,GAC1B,EAEF,MAAC,oBAAoB,OACf,gBAAgB,EACpB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,EAC3D,YAAY,EAAE,KAAC,YAAY,KAAG;wBAC9B,8CAA8C;wBAC9C,eAAe,EAAE,IAAI,qBAAqB,EAAE,EAC5C,QAAQ,EAAE,SAAS,EACnB,OAAO,EAAE,WAAW,KAChB,SAAS,aAEZ,QAAQ,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gCAC1C,MAAM,eAAe,GAAG,WAAW,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,CACvD,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,CAAC,GAAG,CACjC,CAAC;gCACF,OAAO,CACL,KAAC,cAAc,IAEb,OAAO,EAAE,KAAK,CAAC,GAAG,eACP,eAAe,IAAI,eAAe,CAAC,CAAC,CAAC,EAChD,SAAS,EAAE,YAAY,CAAC,KAAK,CAAC,GAAI,CAAC,IAAI,EAAE,EACzC,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,YAE3C,KAAK,IAPD,KAAK,CAAC,GAAG,CAQC,CAClB,CAAC;4BACJ,CAAC,CAAC,EAED,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC,IAAI;4BACvC,4DAA4D;4BAC5D,oEAAoE;4BACpE,2BAAyB,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,IAA7D,IAAI,CAA6D,CAC3E,IACoB,IACtB,CACJ,IACY,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import {\n type FC,\n type ReactElement,\n type Ref,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useState\n} from 'react';\nimport {\n Responsive as ResponsiveGridLayout,\n type Layout,\n type Layouts,\n type CoreProps\n} from 'react-grid-layout';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport { useElement, useI18n } from '../../../hooks';\nimport { defaultThemeProp } from '../../../theme';\n\nimport useGridLayoutConfig, { type GridBreakPointWiseValues, type GridLayoutModel } from './config';\nimport EditorBackground from './EditorBackground';\nimport EditorGridItem, { ResizeHandle, resizeHandleClassName } from './EditorGridItem';\nimport {\n checkLayoutForGaps,\n getBreakpointAndCols,\n getRowHeight,\n useGridItemSorter,\n useMonitoredSize,\n type GridLayoutRowsProp\n} from './utils';\nimport ReactResizableStyles from './ReactResizableStyles';\nimport ReactGridLayoutStyles from './ReactGridLayoutStyles';\n\nconst StyledEditor = styled(Flex)(({ theme }) => {\n const {\n base: {\n palette: { interactive }\n }\n } = theme;\n return css`\n position: relative;\n\n /* Needed for the background grid to be visible /\n z-index: 0;\n block-size: 100%;\n overflow-y: auto;\n\n / To minimize height triggers during dragging due to horizontal scrollbar showing up /\n overflow-x: hidden;\n\n .react-grid-item.react-grid-placeholder {\n background: ${interactive};\n opacity: 0.3;\n }\n `;\n});\nStyledEditor.defaultProps = defaultThemeProp;\n\nexport interface GridLayoutHandleValue {\n /* Used to get layout model with imperative handle. Returns the layout model from all breakpoints. Returns undefined when no children. /\n getLayoutModel: () => GridLayoutModel \| undefined;\n\n /\n Returns a flag indicating whether there are any gaps in the current layout.\n * Highlights all background cells to indicate the same.\n /\n checkForGaps: () => boolean;\n}\n\n/* Props for GridLayoutEditor component /\nexport interface GridLayoutEditorProps {\n /\n Called whenever there's a change in the layoutModel.\n * Change-handler of the CONTROLLED COMPONENT\n /\n onModelChange: (newModel: GridLayoutModel \| undefined) => void;\n\n /\n Value of the CONTROLLED component\n * Passed when editing a previously saved layout.\n * Can be `undefined` when no children.\n * It should be the same as the one emitted by `getLayoutModel` or `handle`\n /\n layoutModel: GridLayoutModel \| undefined;\n\n /\n Breakpoints set on the Grid.\n * Needs to be aligned with `rows` and `cols`\n /\n breakpoints: GridBreakPointWiseValues;\n\n /\n # of rows to fit into the container height at each breakpoint (unless a fixed rowHeight is preferred)\n * rows should be aligned with `breakpoints` prop\n /\n rows: GridLayoutRowsProp;\n\n /\n Breakpoint-wise numColumns on the Grid.\n * cols should be aligned with `breakpoints` prop\n /\n cols: GridBreakPointWiseValues;\n\n /\n If parent DOM node of ResponsiveReactGridLayout or ReactGridLayout has \"transform: scale(n)\" css property,\n * we should set scale coefficient to avoid render artifacts while dragging.\n /\n transformScale?: CoreProps['transformScale'];\n\n /* Ref to access the editor state. Used to get the current layout-model when persisting it. /\n handle?: Ref<GridLayoutHandleValue>;\n\n /\n Child elements to be rendered as Grid items.\n * Each element should have a unique `key`\n * Memoize children for a better performance: https://github.com/react-grid-layout/react-grid-layout#performance\n * Set up an `itemLabel` prop with the text to call out when the item is focused.\n * If a child needs to be initialized with a specific x/y/w/h,\n * or if you want to specify any special properties like minW, minH, etc.,\n * set up a `data-grid` in layoutModel prop with any subset of properties\n * The prop can be undefined on init when no elements.\n /\n children?: ReactElement[];\n\n /* Item label mapped with item id for a11y /\n itemLabelMap: Record<string, string>;\n}\n\n/\n Editor component to create Grid Layouts\n * @component\n */\nconst GridLayoutEditor: FC<GridLayoutEditorProps> = ({\n handle,\n children,\n layoutModel,\n rows,\n onModelChange,\n itemLabelMap,\n ...restProps\n}) => {\n // Track width changes: https://github.com/react-grid-layout/react-grid-layout#providing-grid-width\n const [wrapperEl, setWrapperEl] = useElement<HTMLElement>();\n const size = useMonitoredSize(wrapperEl);\n const width = size?.width;\n const height = size?.height;\n const commonGridConfig = useGridLayoutConfig(true);\n const t = useI18n();\n const { breakpoint, numColumns } = useMemo(\n () => getBreakpointAndCols(width \|\| 0, restProps.breakpoints, restProps.cols),\n [width, restProps.breakpoints, restProps.cols]\n );\n const { rowHeight, numRowsPerPage } = useMemo(\n () => getRowHeight(breakpoint, height \|\| 0, commonGridConfig.margin[0], rows, layoutModel),\n [breakpoint, commonGridConfig.margin, height, rows, layoutModel]\n );\n const currentLayout = useMemo(() => layoutModel?.[breakpoint], [breakpoint, layoutModel]);\n\n const onLayoutChange = useCallback(\n (curLayout: Layout[], allLayouts: Layouts) => {\n onModelChange(!children \|\| children.length === 0 ? undefined : allLayouts);\n },\n [children, onModelChange]\n );\n\n // Callback to sort child DOM nodes to ensure an intuitive tabbing order\n const gridItemSorter = useGridItemSorter(currentLayout, numColumns);\n\n // Set up keyboard accessibility\n const [listEl, setListEl] = useElement<HTMLElement>();\n useEffect(() => {\n if (listEl) {\n listEl.setAttribute('role', 'list');\n listEl.setAttribute('tabindex', '0');\n listEl.setAttribute('aria-label', t('configurable_layout_instructions'));\n }\n }, [listEl, t]);\n\n const moveItem = useCallback(\n (itemKey: ReactElement['key'], deltaX: number, deltaY: number) => {\n // Should be initialized by this point\n if (!currentLayout) return;\n const itemIndex = currentLayout.findIndex(item => item.i === itemKey);\n // Should be present on the currentLayout by this point.\n if (itemIndex === -1) return;\n\n const oldItem = currentLayout[itemIndex];\n const newItem: Layout = {\n ...oldItem,\n // `Math.max` needed to avoid a glitch when moving left beyond the left edge\n x: Math.max(0, oldItem.x + deltaX),\n y: Math.max(0, oldItem.y + deltaY)\n };\n const newLayout = [\n ...currentLayout.slice(0, itemIndex),\n newItem,\n ...currentLayout.slice(itemIndex + 1)\n ];\n const newModel = { ...layoutModel, [breakpoint]: newLayout };\n onModelChange(!children \|\| children.length === 0 ? undefined : newModel);\n },\n [breakpoint, children, currentLayout, layoutModel, onModelChange]\n );\n\n const addOrSubtractItemSize = useCallback(\n (itemKey: ReactElement['key'], deltaW: number, deltaH: number) => {\n // Should be initialized by this point\n if (!currentLayout) return;\n const itemIndex = currentLayout.findIndex(item => item.i === itemKey);\n // Should be present on the currentLayout by this point.\n if (itemIndex === -1) return;\n\n const oldItem = currentLayout[itemIndex];\n const newItem: Layout = {\n ...oldItem,\n // `Math.max` needed to avoid a glitch when moving left beyond the left edge\n w: Math.max(oldItem.minW \|\| 2, oldItem.w + deltaW),\n h: Math.max(oldItem.minH \|\| 2, oldItem.h + deltaH)\n };\n const newLayout = [\n ...currentLayout.slice(0, itemIndex),\n newItem,\n ...currentLayout.slice(itemIndex + 1)\n ];\n const newModel = { ...layoutModel, [breakpoint]: newLayout };\n onModelChange(!children \|\| children.length === 0 ? undefined : newModel);\n },\n [breakpoint, children, currentLayout, layoutModel, onModelChange]\n );\n\n // Provide a way for the parent component to get layout-model on demand\n const [highlightedBG, setHighlightedBG] = useState(false);\n useImperativeHandle(\n handle,\n () => ({\n getLayoutModel: () => {\n // Without this check, we'll end up with the dummy model set up down below for this case\n if (!children \|\| children.length === 0) return undefined;\n return layoutModel;\n },\n\n checkForGaps: () => {\n // On load when no items are added.\n if (!currentLayout) return true;\n const hasGaps = checkLayoutForGaps(currentLayout, numColumns);\n setHighlightedBG(hasGaps);\n return hasGaps;\n }\n }),\n [children, layoutModel, currentLayout, numColumns]\n );\n\n return (\n // Editor is always in LTR. At runtime, the layout is mirrored depending on locale.\n <StyledEditor ref={setWrapperEl} dir='ltr'>\n <ReactResizableStyles />\n <ReactGridLayoutStyles />\n\n {!!width && !!height && (\n <>\n <EditorBackground\n data-testid='editor'\n layout={currentLayout}\n numColumns={numColumns}\n rowHeight={rowHeight}\n rowsPerPage={numRowsPerPage}\n highlighted={highlightedBG}\n />\n\n <ResponsiveGridLayout\n {...commonGridConfig}\n width={width}\n rowHeight={rowHeight}\n onLayoutChange={onLayoutChange}\n resizeHandles={['s', 'e', 'n', 'w', 'sw', 'nw', 'se', 'ne']}\n resizeHandle={<ResizeHandle />}\n // To prevent drag event on the resize handles\n draggableCancel={`.${resizeHandleClassName}`}\n innerRef={setListEl}\n layouts={layoutModel}\n {...restProps}\n >\n {children?.sort(gridItemSorter).map(child => {\n const gridLayoutModel = layoutModel?.[breakpoint]?.filter(\n layout => layout.i === child.key\n );\n return (\n <EditorGridItem\n key={child.key}\n itemKey={child.key}\n data-grid={gridLayoutModel && gridLayoutModel[0]}\n itemLabel={itemLabelMap[child.key!] \|\| ''}\n moveItem={moveItem}\n addOrSubtractItemSize={addOrSubtractItemSize}\n >\n {child}\n </EditorGridItem>\n );\n })}\n\n {(!children \|\| children.length === 0) && (\n // Placeholder when no children. Needed to avoid exceptions:\n // https://github.com/react-grid-layout/react-grid-layout/issues/216\n <div key='--' data-grid={{ x: 0, y: 0, w: 1, h: 1, resizeHandles: [] }} />\n )}\n </ResponsiveGridLayout>\n </>\n )}\n </StyledEditor>\n );\n};\n\nexport default GridLayoutEditor;\n"]}
1	+ {"version":3,"file":"GridLayoutEditor.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/GridLayoutEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n type FC,\n type ReactElement,\n type Ref,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useState\n} from 'react';\nimport {\n Responsive as ResponsiveGridLayout,\n type Layout,\n type Layouts,\n type CoreProps\n} from 'react-grid-layout';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport { useElement, useI18n } from '../../../hooks';\nimport { defaultThemeProp } from '../../../theme';\n\nimport useGridLayoutConfig, { type GridBreakPointWiseValues, type GridLayoutModel } from './config';\nimport EditorBackground from './EditorBackground';\nimport EditorGridItem, { ResizeHandle, resizeHandleClassName } from './EditorGridItem';\nimport {\n checkLayoutForGaps,\n getBreakpointAndCols,\n getRowHeight,\n useGridItemSorter,\n useMonitoredSize,\n type GridLayoutRowsProp\n} from './utils';\nimport ReactResizableStyles from './ReactResizableStyles';\nimport ReactGridLayoutStyles from './ReactGridLayoutStyles';\n\nconst StyledEditor = styled(Flex)(({ theme }) => {\n const {\n base: {\n palette: { interactive }\n }\n } = theme;\n return css`\n position: relative;\n\n /* Needed for the background grid to be visible /\n z-index: 0;\n block-size: 100%;\n overflow-y: auto;\n\n / To minimize height triggers during dragging due to horizontal scrollbar showing up /\n overflow-x: hidden;\n\n .react-grid-item.react-grid-placeholder {\n background: ${interactive};\n opacity: 0.3;\n }\n `;\n});\nStyledEditor.defaultProps = defaultThemeProp;\n\nexport interface GridLayoutHandleValue {\n /* Used to get layout model with imperative handle. Returns the layout model from all breakpoints. Returns undefined when no children. /\n getLayoutModel: () => GridLayoutModel \| undefined;\n\n /\n Returns a flag indicating whether there are any gaps in the current layout.\n * Highlights all background cells to indicate the same.\n /\n checkForGaps: () => boolean;\n}\n\n/* Props for GridLayoutEditor component /\nexport interface GridLayoutEditorProps {\n /\n Called whenever there's a change in the layoutModel.\n * Change-handler of the CONTROLLED COMPONENT\n /\n onModelChange: (newModel: GridLayoutModel \| undefined) => void;\n\n /\n Value of the CONTROLLED component\n * Passed when editing a previously saved layout.\n * Can be `undefined` when no children.\n * It should be the same as the one emitted by `getLayoutModel` or `handle`\n /\n layoutModel: GridLayoutModel \| undefined;\n\n /\n Breakpoints set on the Grid.\n * Needs to be aligned with `rows` and `cols`\n /\n breakpoints: GridBreakPointWiseValues;\n\n /\n # of rows to fit into the container height at each breakpoint (unless a fixed rowHeight is preferred)\n * rows should be aligned with `breakpoints` prop\n /\n rows: GridLayoutRowsProp;\n\n /\n Breakpoint-wise numColumns on the Grid.\n * cols should be aligned with `breakpoints` prop\n /\n cols: GridBreakPointWiseValues;\n\n /\n If parent DOM node of ResponsiveReactGridLayout or ReactGridLayout has \"transform: scale(n)\" css property,\n * we should set scale coefficient to avoid render artifacts while dragging.\n /\n transformScale?: CoreProps['transformScale'];\n\n /* Ref to access the editor state. Used to get the current layout-model when persisting it. /\n handle?: Ref<GridLayoutHandleValue>;\n\n /\n Child elements to be rendered as Grid items.\n * Each element should have a unique `key`\n * Memoize children for a better performance: https://github.com/react-grid-layout/react-grid-layout#performance\n * Set up an `itemLabel` prop with the text to call out when the item is focused.\n * If a child needs to be initialized with a specific x/y/w/h,\n * or if you want to specify any special properties like minW, minH, etc.,\n * set up a `data-grid` in layoutModel prop with any subset of properties\n * The prop can be undefined on init when no elements.\n /\n children?: ReactElement[];\n\n /* Item label mapped with item id for a11y /\n itemLabelMap: Record<string, string>;\n\n /\n Optional minimum row height (px) to override the built-in defaults.\n * Useful when grid items contain content that requires more vertical space\n * than the default minimum (e.g. compact SimpleValue insights).\n /\n minRowHeight?: number;\n}\n\n/\n Editor component to create Grid Layouts\n * @component\n */\nconst GridLayoutEditor: FC<GridLayoutEditorProps> = ({\n handle,\n children,\n layoutModel,\n rows,\n onModelChange,\n itemLabelMap,\n minRowHeight: minRowHeightProp,\n ...restProps\n}) => {\n // Track width changes: https://github.com/react-grid-layout/react-grid-layout#providing-grid-width\n const [wrapperEl, setWrapperEl] = useElement<HTMLElement>();\n const size = useMonitoredSize(wrapperEl);\n const width = size?.width;\n const height = size?.height;\n const commonGridConfig = useGridLayoutConfig(true);\n const t = useI18n();\n const { breakpoint, numColumns } = useMemo(\n () => getBreakpointAndCols(width \|\| 0, restProps.breakpoints, restProps.cols),\n [width, restProps.breakpoints, restProps.cols]\n );\n const { rowHeight, numRowsPerPage } = useMemo(\n () =>\n getRowHeight(\n breakpoint,\n height \|\| 0,\n commonGridConfig.margin[0],\n rows,\n layoutModel,\n minRowHeightProp\n ),\n [breakpoint, commonGridConfig.margin, height, rows, layoutModel, minRowHeightProp]\n );\n const currentLayout = useMemo(() => layoutModel?.[breakpoint], [breakpoint, layoutModel]);\n\n const onLayoutChange = useCallback(\n (curLayout: Layout[], allLayouts: Layouts) => {\n onModelChange(!children \|\| children.length === 0 ? undefined : allLayouts);\n },\n [children, onModelChange]\n );\n\n // Callback to sort child DOM nodes to ensure an intuitive tabbing order\n const gridItemSorter = useGridItemSorter(currentLayout, numColumns);\n\n // Set up keyboard accessibility\n const [listEl, setListEl] = useElement<HTMLElement>();\n useEffect(() => {\n if (listEl) {\n listEl.setAttribute('role', 'list');\n listEl.setAttribute('tabindex', '0');\n listEl.setAttribute('aria-label', t('configurable_layout_instructions'));\n }\n }, [listEl, t]);\n\n const moveItem = useCallback(\n (itemKey: ReactElement['key'], deltaX: number, deltaY: number) => {\n // Should be initialized by this point\n if (!currentLayout) return;\n const itemIndex = currentLayout.findIndex(item => item.i === itemKey);\n // Should be present on the currentLayout by this point.\n if (itemIndex === -1) return;\n\n const oldItem = currentLayout[itemIndex];\n const newItem: Layout = {\n ...oldItem,\n // `Math.max` needed to avoid a glitch when moving left beyond the left edge\n x: Math.max(0, oldItem.x + deltaX),\n y: Math.max(0, oldItem.y + deltaY)\n };\n const newLayout = [\n ...currentLayout.slice(0, itemIndex),\n newItem,\n ...currentLayout.slice(itemIndex + 1)\n ];\n const newModel = { ...layoutModel, [breakpoint]: newLayout };\n onModelChange(!children \|\| children.length === 0 ? undefined : newModel);\n },\n [breakpoint, children, currentLayout, layoutModel, onModelChange]\n );\n\n const addOrSubtractItemSize = useCallback(\n (itemKey: ReactElement['key'], deltaW: number, deltaH: number) => {\n // Should be initialized by this point\n if (!currentLayout) return;\n const itemIndex = currentLayout.findIndex(item => item.i === itemKey);\n // Should be present on the currentLayout by this point.\n if (itemIndex === -1) return;\n\n const oldItem = currentLayout[itemIndex];\n const newItem: Layout = {\n ...oldItem,\n // `Math.max` needed to avoid a glitch when moving left beyond the left edge\n w: Math.max(oldItem.minW \|\| 2, oldItem.w + deltaW),\n h: Math.max(oldItem.minH \|\| 2, oldItem.h + deltaH)\n };\n const newLayout = [\n ...currentLayout.slice(0, itemIndex),\n newItem,\n ...currentLayout.slice(itemIndex + 1)\n ];\n const newModel = { ...layoutModel, [breakpoint]: newLayout };\n onModelChange(!children \|\| children.length === 0 ? undefined : newModel);\n },\n [breakpoint, children, currentLayout, layoutModel, onModelChange]\n );\n\n // Provide a way for the parent component to get layout-model on demand\n const [highlightedBG, setHighlightedBG] = useState(false);\n useImperativeHandle(\n handle,\n () => ({\n getLayoutModel: () => {\n // Without this check, we'll end up with the dummy model set up down below for this case\n if (!children \|\| children.length === 0) return undefined;\n return layoutModel;\n },\n\n checkForGaps: () => {\n // On load when no items are added.\n if (!currentLayout) return true;\n const hasGaps = checkLayoutForGaps(currentLayout, numColumns);\n setHighlightedBG(hasGaps);\n return hasGaps;\n }\n }),\n [children, layoutModel, currentLayout, numColumns]\n );\n\n return (\n // Editor is always in LTR. At runtime, the layout is mirrored depending on locale.\n <StyledEditor ref={setWrapperEl} dir='ltr'>\n <ReactResizableStyles />\n <ReactGridLayoutStyles />\n\n {!!width && !!height && (\n <>\n <EditorBackground\n data-testid='editor'\n layout={currentLayout}\n numColumns={numColumns}\n rowHeight={rowHeight}\n rowsPerPage={numRowsPerPage}\n highlighted={highlightedBG}\n />\n\n <ResponsiveGridLayout\n {...commonGridConfig}\n width={width}\n rowHeight={rowHeight}\n onLayoutChange={onLayoutChange}\n resizeHandles={['s', 'e', 'n', 'w', 'sw', 'nw', 'se', 'ne']}\n resizeHandle={<ResizeHandle />}\n // To prevent drag event on the resize handles\n draggableCancel={`.${resizeHandleClassName}`}\n innerRef={setListEl}\n layouts={layoutModel}\n {...restProps}\n >\n {children?.sort(gridItemSorter).map(child => {\n const gridLayoutModel = layoutModel?.[breakpoint]?.filter(\n layout => layout.i === child.key\n );\n return (\n <EditorGridItem\n key={child.key}\n itemKey={child.key}\n data-grid={gridLayoutModel && gridLayoutModel[0]}\n itemLabel={itemLabelMap[child.key!] \|\| ''}\n moveItem={moveItem}\n addOrSubtractItemSize={addOrSubtractItemSize}\n >\n {child}\n </EditorGridItem>\n );\n })}\n\n {(!children \|\| children.length === 0) && (\n // Placeholder when no children. Needed to avoid exceptions:\n // https://github.com/react-grid-layout/react-grid-layout/issues/216\n <div key='--' data-grid={{ x: 0, y: 0, w: 1, h: 1, resizeHandles: [] }} />\n )}\n </ResponsiveGridLayout>\n </>\n )}\n </StyledEditor>\n );\n};\n\nexport default GridLayoutEditor;\n"]}

package/lib/components/PageTemplates/GridLayout/GridLayoutViewer.d.ts CHANGED Viewed

@@ -38,6 +38,12 @@ export interface GridLayoutViewerProps {
      * @default true
      */
     padContent?: boolean;
+    /**
+     * Optional minimum row height (px) to override the built-in defaults.
+     * Useful when grid items contain content that requires more vertical space
+     * than the default minimum (e.g. compact SimpleValue insights).
+     */
+    minRowHeight?: number;
 }
 /**
  * Viewer component for a Grid created using GridLayoutEditor

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GridLayoutViewer.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/GridLayoutViewer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAc,KAAK,YAAY,EAAqB,MAAM,OAAO,CAAC;AAOlF,OAAO,KAAK,EAAE,wBAAwB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAE1E,OAAO,EAOL,KAAK,kBAAkB,EACxB,MAAM,SAAS,CAAC;AAwCjB,+CAA+C;AAC/C,MAAM,WAAW,qBAAqB;IACpC;;;;;OAKG;IACH,WAAW,EAAE,eAAe,GAAG,SAAS,CAAC;IAEzC;;;OAGG;IACH,WAAW,EAAE,wBAAwB,CAAC;IAEtC;;;OAGG;IACH,IAAI,EAAE,kBAAkB,CAAC;IAEzB;;;OAGG;IACH,IAAI,EAAE,wBAAwB,CAAC;IAE/B,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAE3B;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;~~CACtB~~;AAED;;;GAGG;AACH,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,~~CAkF~~/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1	+ {"version":3,"file":"GridLayoutViewer.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/GridLayoutViewer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAc,KAAK,YAAY,EAAqB,MAAM,OAAO,CAAC;AAOlF,OAAO,KAAK,EAAE,wBAAwB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAE1E,OAAO,EAOL,KAAK,kBAAkB,EACxB,MAAM,SAAS,CAAC;AAwCjB,+CAA+C;AAC/C,MAAM,WAAW,qBAAqB;IACpC;;;;;OAKG;IACH,WAAW,EAAE,eAAe,GAAG,SAAS,CAAC;IAEzC;;;OAGG;IACH,WAAW,EAAE,wBAAwB,CAAC;IAEtC;;;OAGG;IACH,IAAI,EAAE,kBAAkB,CAAC;IAEzB;;;OAGG;IACH,IAAI,EAAE,wBAAwB,CAAC;IAE/B,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAE3B;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;GAGG;AACH,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA2F/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

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

@@ -33,7 +33,7 @@ const ViewerGridItem = forwardRef(({ children, autoSize, direction, ...restProps
  * Viewer component for a Grid created using GridLayoutEditor
  * @component
  */
-const GridLayoutViewer = ({ children, layoutModel: layoutModelProp, rows, cols, autoSizeItemIDs = [], breakpoints, padContent = true }) => {
+const GridLayoutViewer = ({ children, layoutModel: layoutModelProp, rows, cols, autoSizeItemIDs = [], breakpoints, padContent = true, minRowHeight: minRowHeightProp }) => {
     // Track width changes: https://github.com/react-grid-layout/react-grid-layout#providing-grid-width
     const [wrapperEl, setWrapperEl] = useElement();
     const size = useMonitoredSize(wrapperEl);
@@ -41,7 +41,7 @@ const GridLayoutViewer = ({ children, layoutModel: layoutModelProp, rows, cols,
     const height = size?.height;
     const commonGridConfig = useGridLayoutConfig(padContent);
     const { breakpoint, numColumns } = useMemo(() => getBreakpointAndCols(width || 0, breakpoints, cols), [width, breakpoints, cols]);
-    const { rowHeight } = useMemo(() => getRowHeight(breakpoint, height || 0, commonGridConfig.margin[0], rows, layoutModelProp), [breakpoint, commonGridConfig.margin, height, rows, layoutModelProp]);
+    const { rowHeight } = useMemo(() => getRowHeight(breakpoint, height || 0, commonGridConfig.margin[0], rows, layoutModelProp, minRowHeightProp), [breakpoint, commonGridConfig.margin, height, rows, layoutModelProp, minRowHeightProp]);
     // On load, setting layoutModel based on the direction
     const { rtl } = useDirection();
     const layoutModel = useMemo(() => {