@pega/cosmos-react-core 10.0.0-build.2.12 → 10.0.0-build.2.14

package/lib/components/ClassificationMarking/ClassificationMarking.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ClassificationMarking.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,gCAAgC;YACnC,MAAM;EAKf,CAAC;AAEF,eAAO,MAAM,aAAa;gBACZ,MAAM;WACX,MAAM;YACL,MAAM;eACH,MAAM;iBACJ,MAAM;eACR,KAAK,GAAG,QAAQ;YAkB3B,CAAC;AAIH,eAAO,MAAM,uBAAuB;YAC1B,MAAM;YAKd,CAAC"}
+{"version":3,"file":"ClassificationMarking.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,gCAAgC;YACnC,MAAM;EAKf,CAAC;AAEF,eAAO,MAAM,aAAa;gBACZ,MAAM;WACX,MAAM;YACL,MAAM;eACH,MAAM;iBACJ,MAAM;eACR,KAAK,GAAG,QAAQ;YAoB3B,CAAC;AAIH,eAAO,MAAM,uBAAuB;YAC1B,MAAM;YAKd,CAAC"}

package/lib/components/ClassificationMarking/ClassificationMarking.styles.js

@@ -14,9 +14,11 @@ export const StyledMarking = styled.div(({ background, color, height, fontSize,
     position: fixed;
     ${placement}: 0;
     inset-inline: 0;
-    height: ${placement === 'bottom'
-        ? `calc(${height} + var(--safe-area-inset-block-end, 0))`
-        : height};
+    box-sizing: content-box;
+    height: ${height};
+    ${placement === 'bottom'
+        ? 'padding-block-end: var(--safe-area-inset-block-end, 0);'
+        : 'padding-block-start: var(--safe-area-inset-block-start, 0);'}
     line-height: ${height};
     text-align: center;
     font-weight: ${theme.base['font-weight'].bold};

package/lib/components/ClassificationMarking/ClassificationMarking.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ClassificationMarking.styles.js","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C;;;GAGG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,iBAAiB,CAE/D;;wBAEsB,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;;CAE7C,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAOpC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,OAAO,GAAG,CAAA;;MAEN,SAAS;;cAED,SAAS,KAAK,QAAQ;QAC9B,CAAC,CAAC,QAAQ,MAAM,yCAAyC;QACzD,CAAC,CAAC,MAAM;mBACK,MAAM;;mBAEN,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,IAAI;MAC3C,UAAU,CAAC,CAAC,CAAC,gBAAgB,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE;MAC/C,QAAQ,CAAC,CAAC,CAAC,cAAc,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE;eAChC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG;kBACtB,UAAU;aACf,KAAK;GACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAE9C,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAChB,OAAO,GAAG,CAAA;wBACY,MAAM;GAC3B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css, createGlobalStyle } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\n\n/**\n * Promotes --marking-height to :root so portaled elements\n * (Fullscreen, Lightbox) can read it outside the StyledClassifiedContent tree.\n */\nexport const ClassificationMarkingGlobalStyle = createGlobalStyle<{\n  height: string;\n}>`\n  :root {\n    --marking-height: ${({ height }) => height};\n  }\n`;\n\nexport const StyledMarking = styled.div<{\n  background: string;\n  color: string;\n  height: string;\n  fontSize?: string;\n  fontFamily?: string;\n  placement: 'top' | 'bottom';\n}>(({ background, color, height, fontSize, fontFamily, placement, theme }) => {\n  return css`\n    position: fixed;\n    ${placement}: 0;\n    inset-inline: 0;\n    height: ${placement === 'bottom'\n      ? `calc(${height} + var(--safe-area-inset-block-end, 0))`\n      : height};\n    line-height: ${height};\n    text-align: center;\n    font-weight: ${theme.base['font-weight'].bold};\n    ${fontFamily ? `font-family: ${fontFamily};` : ''}\n    ${fontSize ? `font-size: ${fontSize};` : ''}\n    z-index: ${theme.base['z-index'].max};\n    background: ${background};\n    color: ${color};\n  `;\n});\n\nStyledMarking.defaultProps = defaultThemeProp;\n\nexport const StyledClassifiedContent = styled.div<{\n  height: string;\n}>(({ height }) => {\n  return css`\n    --marking-height: ${height};\n  `;\n});\n\nStyledClassifiedContent.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"ClassificationMarking.styles.js","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C;;;GAGG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,iBAAiB,CAE/D;;wBAEsB,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;;CAE7C,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAOpC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,OAAO,GAAG,CAAA;;MAEN,SAAS;;;cAGD,MAAM;MACd,SAAS,KAAK,QAAQ;QACtB,CAAC,CAAC,yDAAyD;QAC3D,CAAC,CAAC,6DAA6D;mBAClD,MAAM;;mBAEN,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,IAAI;MAC3C,UAAU,CAAC,CAAC,CAAC,gBAAgB,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE;MAC/C,QAAQ,CAAC,CAAC,CAAC,cAAc,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE;eAChC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG;kBACtB,UAAU;aACf,KAAK;GACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAE9C,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAChB,OAAO,GAAG,CAAA;wBACY,MAAM;GAC3B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css, createGlobalStyle } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\n\n/**\n * Promotes --marking-height to :root so portaled elements\n * (Fullscreen, Lightbox) can read it outside the StyledClassifiedContent tree.\n */\nexport const ClassificationMarkingGlobalStyle = createGlobalStyle<{\n  height: string;\n}>`\n  :root {\n    --marking-height: ${({ height }) => height};\n  }\n`;\n\nexport const StyledMarking = styled.div<{\n  background: string;\n  color: string;\n  height: string;\n  fontSize?: string;\n  fontFamily?: string;\n  placement: 'top' | 'bottom';\n}>(({ background, color, height, fontSize, fontFamily, placement, theme }) => {\n  return css`\n    position: fixed;\n    ${placement}: 0;\n    inset-inline: 0;\n    box-sizing: content-box;\n    height: ${height};\n    ${placement === 'bottom'\n      ? 'padding-block-end: var(--safe-area-inset-block-end, 0);'\n      : 'padding-block-start: var(--safe-area-inset-block-start, 0);'}\n    line-height: ${height};\n    text-align: center;\n    font-weight: ${theme.base['font-weight'].bold};\n    ${fontFamily ? `font-family: ${fontFamily};` : ''}\n    ${fontSize ? `font-size: ${fontSize};` : ''}\n    z-index: ${theme.base['z-index'].max};\n    background: ${background};\n    color: ${color};\n  `;\n});\n\nStyledMarking.defaultProps = defaultThemeProp;\n\nexport const StyledClassifiedContent = styled.div<{\n  height: string;\n}>(({ height }) => {\n  return css`\n    --marking-height: ${height};\n  `;\n});\n\nStyledClassifiedContent.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Lightbox/Lightbox.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Lightbox.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.styles.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,YAAY;YAA2B,OAAO;YAuBzD,CAAC;AAIH,eAAO,MAAM,kBAAkB,6NAY7B,CAAC;AAIH,eAAO,MAAM,UAAU,6NAWrB,CAAC;AAIH,eAAO,MAAM,eAAe;;0KAgE1B,CAAC;AAIH,eAAO,MAAM,eAAe,6NAW1B,CAAC;AAIH,eAAO,MAAM,oBAAoB;YAAwB,OAAO;YAuC9D,CAAC;AAEH,eAAO,MAAM,YAAY,yOAKxB,CAAC;AAIF,eAAO,MAAM,mBAAmB,6NAG/B,CAAC;AAEF,eAAO,MAAM,gBAAgB,6NAE5B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;uJAG/B,CAAC;AAEF,eAAO,MAAM,cAAc;;;YAA8B,OAAO;;;iDAW9D,CAAC"}
+{"version":3,"file":"Lightbox.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.styles.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,YAAY;YAA2B,OAAO;YAuBzD,CAAC;AAIH,eAAO,MAAM,kBAAkB,6NAY7B,CAAC;AAIH,eAAO,MAAM,UAAU,6NAWrB,CAAC;AAIH,eAAO,MAAM,eAAe;;0KAgE1B,CAAC;AAIH,eAAO,MAAM,eAAe,6NAW1B,CAAC;AAIH,eAAO,MAAM,oBAAoB;YAAwB,OAAO;YAwC9D,CAAC;AAEH,eAAO,MAAM,YAAY,yOAKxB,CAAC;AAIF,eAAO,MAAM,mBAAmB,6NAG/B,CAAC;AAEF,eAAO,MAAM,gBAAgB,6NAE5B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;uJAG/B,CAAC;AAEF,eAAO,MAAM,cAAc;;;YAA8B,OAAO;;;iDAW9D,CAAC"}

package/lib/components/Lightbox/Lightbox.styles.js

@@ -145,6 +145,7 @@ export const StyledMediaContainer = styled.div(({ theme, global }) => {
     ${!global &&
         css `
       background-color: ${theme.base.colors.gray['extra-dark']};
+      overflow-y: auto;
     `}
 
     & > div {

package/lib/components/Lightbox/Lightbox.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Lightbox.styles.js","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { hideVisually, rgba } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport BareButton from '../Button/BareButton';\nimport { StyledIcon } from '../Icon';\nimport { StyledMetaList } from '../MetaList/MetaList';\nimport { StyledErrorState } from '../ErrorState';\nimport Text, { StyledText } from '../Text';\nimport { useDirection } from '../../hooks';\nimport Backdrop from '../Backdrop';\nimport { StyledLink } from '../Link/Link';\nimport { ellipsisOverflow } from '../../styles/mixins';\n\nexport const StyledHeader = styled.header<{ global: boolean }>(({ theme, global }) => {\n  const color: string | undefined = tryCatch(() =>\n    rgba(theme.base.palette.light, theme.base.transparency['transparent-2'])\n  );\n\n  return css`\n    position: relative;\n    width: 100%;\n    padding: ${theme.base.spacing};\n    color: ${color};\n    ${!global &&\n    css`\n      background-color: ${theme.base.colors.gray['extra-dark']};\n      border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n    `}\n\n    ${StyledMetaList} {\n      justify-content: center;\n      li {\n        color: ${color};\n      }\n    }\n  `;\n});\n\nStyledHeader.defaultProps = defaultThemeProp;\n\nexport const StyledCountTracker = styled.div(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    font-size: ${fontSize.xs};\n    text-align: center;\n    min-width: calc(2 * ${theme.base['hit-area']['mouse-min']});\n\n    @media (pointer: coarse) {\n      min-width: calc(2 * ${theme.base['hit-area']['finger-min']});\n    }\n  `;\n});\n\nStyledCountTracker.defaultProps = defaultThemeProp;\n\nexport const StyledInfo = styled.div(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.light};\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n    min-width: 0;\n\n    ${StyledLink} {\n      color: inherit;\n      text-decoration: underline;\n    }\n  `;\n});\n\nStyledInfo.defaultProps = defaultThemeProp;\n\nexport const StyledNavButton = styled(BareButton)(({ theme }) => {\n  const bg = tryCatch(() => rgba(theme.base.colors.gray.medium, 0.5));\n  const hoverBg = tryCatch(() => rgba(theme.base.colors.gray.medium, 0.7));\n  const { rtl } = useDirection();\n\n  return css`\n    position: absolute;\n    z-index: 1;\n    inset-block: 0;\n    min-width: ${theme.base['hit-area']['mouse-min']};\n    color: ${theme.base.palette['foreground-color']};\n    box-shadow: none;\n    border-radius: 0;\n\n    @media (pointer: coarse) {\n      min-width: ${theme.base['hit-area']['finger-min']};\n    }\n\n    &[hidden] {\n      display: none;\n    }\n\n    & > span {\n      display: inline-block;\n      background-color: ${bg};\n\n      ${StyledIcon} {\n        color: ${theme.base.palette.light};\n        width: 2rem;\n        height: 3rem;\n\n        ${rtl &&\n        css`\n          transform: rotateZ(180deg);\n        `}\n      }\n    }\n\n    &:nth-of-type(1) {\n      inset-inline-start: 0;\n      text-align: start;\n      & > span {\n        border-start-end-radius: calc(${theme.base['border-radius']} / 2);\n        border-end-end-radius: calc(${theme.base['border-radius']} / 2);\n      }\n    }\n\n    &:nth-of-type(2) {\n      inset-inline-end: 0;\n      text-align: end;\n      & > span {\n        border-start-start-radius: calc(${theme.base['border-radius']} / 2);\n        border-end-start-radius: calc(${theme.base['border-radius']} / 2);\n      }\n    }\n\n    &:hover > span {\n      background-color: ${hoverBg};\n    }\n\n    &:focus > span {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledNavButton.defaultProps = defaultThemeProp;\n\nexport const StyledContainer = styled.div(({ theme }) => {\n  return css`\n    button {\n      padding: ${theme.base.spacing};\n      color: ${theme.base.palette.light};\n\n      &:focus:enabled {\n        box-shadow: ${theme.base.shadow.focus};\n      }\n    }\n  `;\n});\n\nStyledContainer.defaultProps = defaultThemeProp;\n\nexport const StyledMediaContainer = styled.div<{ global: boolean }>(({ theme, global }) => {\n  return css`\n    position: relative;\n\n    ${!global &&\n    css`\n      background-color: ${theme.base.colors.gray['extra-dark']};\n    `}\n\n    & > div {\n      position: absolute;\n      inset: 0;\n    }\n\n    ${StyledErrorState} {\n      margin: auto;\n      & > ${StyledText} {\n        color: ${theme.base.palette.light};\n      }\n    }\n\n    img,\n    video,\n    audio {\n      display: block;\n      max-width: calc(100% - 5rem);\n      max-height: 100%;\n      margin: auto;\n    }\n\n    img,\n    video {\n      ${!global &&\n      css`\n        margin-block-start: calc(${theme.base.spacing} * 4);\n        max-width: calc(100% - calc(${theme.base.spacing} * 4));\n      `}\n    }\n  `;\n});\n\nexport const StyledObject = styled.object`\n  display: block;\n  margin: auto;\n  width: calc(100% - 5rem);\n  height: 100%;\n`;\n\nStyledMediaContainer.defaultProps = defaultThemeProp;\n\nexport const StyledPreviewRegion = styled.div`\n  position: relative;\n  width: 100%;\n`;\n\nexport const StyledLiveRegion = styled.div`\n  ${hideVisually}\n`;\n\nexport const StyledLightboxTitle = styled(Text)`\n  max-width: 100%;\n  ${ellipsisOverflow};\n`;\n\nexport const StyledLightbox = styled(Backdrop)<{ global: boolean }>(({ global, theme }) => {\n  return css`\n    ${global &&\n    css`\n      z-index: ${theme.base['z-index'].max};\n    `}\n\n    &:focus {\n      outline: none;\n    }\n  `;\n});\n\nStyledLightbox.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"Lightbox.styles.js","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { hideVisually, rgba } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport BareButton from '../Button/BareButton';\nimport { StyledIcon } from '../Icon';\nimport { StyledMetaList } from '../MetaList/MetaList';\nimport { StyledErrorState } from '../ErrorState';\nimport Text, { StyledText } from '../Text';\nimport { useDirection } from '../../hooks';\nimport Backdrop from '../Backdrop';\nimport { StyledLink } from '../Link/Link';\nimport { ellipsisOverflow } from '../../styles/mixins';\n\nexport const StyledHeader = styled.header<{ global: boolean }>(({ theme, global }) => {\n  const color: string | undefined = tryCatch(() =>\n    rgba(theme.base.palette.light, theme.base.transparency['transparent-2'])\n  );\n\n  return css`\n    position: relative;\n    width: 100%;\n    padding: ${theme.base.spacing};\n    color: ${color};\n    ${!global &&\n    css`\n      background-color: ${theme.base.colors.gray['extra-dark']};\n      border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n    `}\n\n    ${StyledMetaList} {\n      justify-content: center;\n      li {\n        color: ${color};\n      }\n    }\n  `;\n});\n\nStyledHeader.defaultProps = defaultThemeProp;\n\nexport const StyledCountTracker = styled.div(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    font-size: ${fontSize.xs};\n    text-align: center;\n    min-width: calc(2 * ${theme.base['hit-area']['mouse-min']});\n\n    @media (pointer: coarse) {\n      min-width: calc(2 * ${theme.base['hit-area']['finger-min']});\n    }\n  `;\n});\n\nStyledCountTracker.defaultProps = defaultThemeProp;\n\nexport const StyledInfo = styled.div(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.light};\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n    min-width: 0;\n\n    ${StyledLink} {\n      color: inherit;\n      text-decoration: underline;\n    }\n  `;\n});\n\nStyledInfo.defaultProps = defaultThemeProp;\n\nexport const StyledNavButton = styled(BareButton)(({ theme }) => {\n  const bg = tryCatch(() => rgba(theme.base.colors.gray.medium, 0.5));\n  const hoverBg = tryCatch(() => rgba(theme.base.colors.gray.medium, 0.7));\n  const { rtl } = useDirection();\n\n  return css`\n    position: absolute;\n    z-index: 1;\n    inset-block: 0;\n    min-width: ${theme.base['hit-area']['mouse-min']};\n    color: ${theme.base.palette['foreground-color']};\n    box-shadow: none;\n    border-radius: 0;\n\n    @media (pointer: coarse) {\n      min-width: ${theme.base['hit-area']['finger-min']};\n    }\n\n    &[hidden] {\n      display: none;\n    }\n\n    & > span {\n      display: inline-block;\n      background-color: ${bg};\n\n      ${StyledIcon} {\n        color: ${theme.base.palette.light};\n        width: 2rem;\n        height: 3rem;\n\n        ${rtl &&\n        css`\n          transform: rotateZ(180deg);\n        `}\n      }\n    }\n\n    &:nth-of-type(1) {\n      inset-inline-start: 0;\n      text-align: start;\n      & > span {\n        border-start-end-radius: calc(${theme.base['border-radius']} / 2);\n        border-end-end-radius: calc(${theme.base['border-radius']} / 2);\n      }\n    }\n\n    &:nth-of-type(2) {\n      inset-inline-end: 0;\n      text-align: end;\n      & > span {\n        border-start-start-radius: calc(${theme.base['border-radius']} / 2);\n        border-end-start-radius: calc(${theme.base['border-radius']} / 2);\n      }\n    }\n\n    &:hover > span {\n      background-color: ${hoverBg};\n    }\n\n    &:focus > span {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledNavButton.defaultProps = defaultThemeProp;\n\nexport const StyledContainer = styled.div(({ theme }) => {\n  return css`\n    button {\n      padding: ${theme.base.spacing};\n      color: ${theme.base.palette.light};\n\n      &:focus:enabled {\n        box-shadow: ${theme.base.shadow.focus};\n      }\n    }\n  `;\n});\n\nStyledContainer.defaultProps = defaultThemeProp;\n\nexport const StyledMediaContainer = styled.div<{ global: boolean }>(({ theme, global }) => {\n  return css`\n    position: relative;\n\n    ${!global &&\n    css`\n      background-color: ${theme.base.colors.gray['extra-dark']};\n      overflow-y: auto;\n    `}\n\n    & > div {\n      position: absolute;\n      inset: 0;\n    }\n\n    ${StyledErrorState} {\n      margin: auto;\n      & > ${StyledText} {\n        color: ${theme.base.palette.light};\n      }\n    }\n\n    img,\n    video,\n    audio {\n      display: block;\n      max-width: calc(100% - 5rem);\n      max-height: 100%;\n      margin: auto;\n    }\n\n    img,\n    video {\n      ${!global &&\n      css`\n        margin-block-start: calc(${theme.base.spacing} * 4);\n        max-width: calc(100% - calc(${theme.base.spacing} * 4));\n      `}\n    }\n  `;\n});\n\nexport const StyledObject = styled.object`\n  display: block;\n  margin: auto;\n  width: calc(100% - 5rem);\n  height: 100%;\n`;\n\nStyledMediaContainer.defaultProps = defaultThemeProp;\n\nexport const StyledPreviewRegion = styled.div`\n  position: relative;\n  width: 100%;\n`;\n\nexport const StyledLiveRegion = styled.div`\n  ${hideVisually}\n`;\n\nexport const StyledLightboxTitle = styled(Text)`\n  max-width: 100%;\n  ${ellipsisOverflow};\n`;\n\nexport const StyledLightbox = styled(Backdrop)<{ global: boolean }>(({ global, theme }) => {\n  return css`\n    ${global &&\n    css`\n      z-index: ${theme.base['z-index'].max};\n    `}\n\n    &:focus {\n      outline: none;\n    }\n  `;\n});\n\nStyledLightbox.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Preview/PreviewManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewManager.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/PreviewManager.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA2B,OAAO,EAAoC,MAAM,OAAO,CAAC;AAIhG,OAAO,YAAY,CAAC;AAKpB,OAAO,KAAK,EAEV,0BAA0B,EAG1B,mBAAmB,EACpB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAC,0BAA0B,CAAC,CAAC;KAC7D;CACF;AA0GD,QAAA,MAAM,cAAc,GAAI,cAAc,mBAAmB,4CAkFxD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"PreviewManager.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/PreviewManager.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA2B,OAAO,EAAoC,MAAM,OAAO,CAAC;AAIhG,OAAO,YAAY,CAAC;AAKpB,OAAO,KAAK,EAEV,0BAA0B,EAG1B,mBAAmB,EACpB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAC,0BAA0B,CAAC,CAAC;KAC7D;CACF;AA8GD,QAAA,MAAM,cAAc,GAAI,cAAc,mBAAmB,4CA0FxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/Preview/PreviewManager.js

@@ -4,7 +4,7 @@ import { useReducer, useState, useMemo, useContext, useRef, useEffect, memo } fr
 import { createPortal } from 'react-dom';
 import { createUID, windowIsAvailable } from '../../utils';
 import '../../init';
-import { useConfiguration } from '../../hooks';
+import { useBreakpoint, useConfiguration } from '../../hooks';
 import PreviewPanel from './PreviewPanel';
 import { PreviewContext, PreviewManagerContext } from './Contexts';
 const reducer = (previews, payload) => {
@@ -30,6 +30,8 @@ const reducer = (previews, payload) => {
                 : preview);
         case 'unmount':
             return previews.filter(preview => preview.id !== payload.id);
+        case 'clear':
+            return [];
         default:
             return previews;
     }
@@ -76,6 +78,13 @@ const PreviewManager = ({ children }) => {
     const [previewActive, setPreviewActive] = useState(false);
     const previewTriggerRef = useRef(null);
     const { portalTarget } = useConfiguration();
+    const isSmallOrAbove = useBreakpoint('sm');
+    // Dismiss all previews when screen size reflows below sm breakpoint
+    useEffect(() => {
+        if (!isSmallOrAbove && previews.length > 0) {
+            dispatch({ type: 'clear' });
+        }
+    }, [isSmallOrAbove, previews.length]);
     const providerValue = useMemo(() => ({
         previewActive,
         setPreviewActive,

package/lib/components/Preview/PreviewManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewManager.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useReducer, useState, useMemo, useContext, useRef, useEffect, memo } from 'react';\nimport type { ComponentType, Dispatch, Context, MutableRefObject, SetStateAction } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, windowIsAvailable } from '../../utils';\nimport '../../init';\nimport { useConfiguration } from '../../hooks';\nimport type { DeferInfer } from '../../types';\n\nimport PreviewPanel from './PreviewPanel';\nimport type {\n  PreviewOptions,\n  PreviewManagerContextValue,\n  PreviewMethods,\n  PreviewObject,\n  PreviewManagerProps\n} from './Preview.types';\nimport { PreviewContext, PreviewManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n  export interface CosmosGlobals {\n    previewManagerContext?: Context<PreviewManagerContextValue>;\n  }\n}\n\ntype PreviewReducerPayload<P extends object> =\n  | { type: 'create'; preview: PreviewObject<P> }\n  | { type: 'update'; id: string; props: Partial<P>; options?: Partial<PreviewOptions> }\n  | { type: 'unmount'; id: string };\n\nconst reducer = <P extends object>(\n  previews: PreviewObject[] | [],\n  payload: PreviewReducerPayload<P>\n): PreviewObject<object>[] => {\n  switch (payload.type) {\n    case 'create':\n      // Stub for multiple preview support\n      // return [...previews, payload.preview as unknown as PreviewObject<object>];\n      return [payload.preview as unknown as PreviewObject<object>];\n\n    case 'update':\n      return previews.map(preview =>\n        preview.id === payload.id\n          ? {\n              ...preview,\n              props: { ...preview.props, ...payload.props },\n              options: {\n                ...preview.options,\n                ...payload.options,\n                previewProps: {\n                  ...preview.options?.previewProps,\n                  ...payload.options?.previewProps\n                }\n              }\n            }\n          : preview\n      );\n\n    case 'unmount':\n      return previews.filter(preview => preview.id !== payload.id);\n\n    default:\n      return previews;\n  }\n};\n\nconst WrappedPreview = memo(\n  ({\n    Component,\n    props,\n    options,\n    previewStateSetter,\n    previewTriggerRef,\n    methods\n  }: PreviewObject & {\n    previewStateSetter: Dispatch<SetStateAction<boolean>>;\n    previewTriggerRef: MutableRefObject<HTMLElement | null>;\n  }) => {\n    const optionsRef = useRef(options);\n    optionsRef.current = options;\n\n    // This state change is required to transition the case preview in.\n    const [open, setOpen] = useState(false);\n    const openRef = useRef(false);\n\n    const cleanupPreview = () => {\n      setOpen(false);\n      openRef.current = false;\n      previewStateSetter(false);\n      optionsRef.current?.previewProps.onAfterClose?.();\n      methods.unmountPreview();\n    };\n\n    useEffect(() => {\n      setOpen(true);\n      openRef.current = true;\n      previewStateSetter(true);\n      return () => {\n        // Guard with openRef so we don't double-fire if already closed via the close button.\n        if (openRef.current) {\n          optionsRef.current?.previewProps.onBeforeClose?.();\n          cleanupPreview();\n        }\n      };\n    }, []);\n\n    return (\n      <PreviewContext.Provider\n        // eslint-disable-next-line react/jsx-no-constructed-context-values\n        value={{\n          initialized: true,\n          previewTriggerRef,\n          ...methods\n        }}\n      >\n        <PreviewPanel\n          open={open}\n          {...options?.previewProps}\n          onAfterClose={() => {\n            cleanupPreview();\n          }}\n        >\n          <Component {...(props as Record<string, unknown>)} />\n        </PreviewPanel>\n      </PreviewContext.Provider>\n    );\n  }\n);\n\nconst PreviewManager = ({ children }: PreviewManagerProps) => {\n  const [previews, dispatch] = useReducer(reducer, []);\n  const [previewActive, setPreviewActive] = useState(false);\n  const previewTriggerRef = useRef<HTMLElement | null>(null);\n  const { portalTarget } = useConfiguration();\n\n  const providerValue = useMemo(\n    () => ({\n      previewActive,\n      setPreviewActive,\n      createPreview: <P extends object>(\n        Component: ComponentType<P>,\n        props?: DeferInfer<P>,\n        options?: PreviewOptions\n      ): PreviewMethods<P> => {\n        const id = createUID();\n\n        const methods = {\n          updatePreview: (updatedProps: Partial<P>, updatedOptions?: Partial<PreviewOptions>) => {\n            (dispatch as Dispatch<PreviewReducerPayload<P>>)({\n              type: 'update',\n              id,\n              props: updatedProps,\n              options: updatedOptions\n            });\n          },\n          unmountPreview: () => {\n            dispatch({ type: 'unmount', id });\n          }\n        };\n\n        (dispatch as Dispatch<PreviewReducerPayload<P>>)({\n          type: 'create',\n          preview: {\n            id,\n            Component,\n            methods,\n            props: (props ?? {}) as P,\n            options\n          }\n        });\n\n        return methods;\n      },\n      PreviewContext,\n      initialized: true\n    }),\n    [previewActive]\n  );\n\n  const context = windowIsAvailable\n    ? window.cosmos.previewManagerContext ?? PreviewManagerContext\n    : PreviewManagerContext;\n  const priorCtx = useContext(context);\n\n  // Don't create additional Preview managers.\n  if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n  const previewPortal =\n    portalTarget && previews.length > 0\n      ? createPortal(\n          previews.map(preview => (\n            <WrappedPreview\n              {...preview}\n              key={preview.id}\n              previewStateSetter={setPreviewActive}\n              previewTriggerRef={previewTriggerRef}\n            />\n          )),\n          portalTarget\n        )\n      : null;\n\n  return (\n    <context.Provider value={providerValue}>\n      {/* eslint-disable-next-line react/jsx-no-constructed-context-values */}\n      <PreviewContext.Provider value={{ initialized: false, previewTriggerRef }}>\n        {children}\n        {previewPortal}\n      </PreviewContext.Provider>\n    </context.Provider>\n  );\n};\n\nexport default PreviewManager;\n"]}
+{"version":3,"file":"PreviewManager.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useReducer, useState, useMemo, useContext, useRef, useEffect, memo } from 'react';\nimport type { ComponentType, Dispatch, Context, MutableRefObject, SetStateAction } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, windowIsAvailable } from '../../utils';\nimport '../../init';\nimport { useBreakpoint, useConfiguration } from '../../hooks';\nimport type { DeferInfer } from '../../types';\n\nimport PreviewPanel from './PreviewPanel';\nimport type {\n  PreviewOptions,\n  PreviewManagerContextValue,\n  PreviewMethods,\n  PreviewObject,\n  PreviewManagerProps\n} from './Preview.types';\nimport { PreviewContext, PreviewManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n  export interface CosmosGlobals {\n    previewManagerContext?: Context<PreviewManagerContextValue>;\n  }\n}\n\ntype PreviewReducerPayload<P extends object> =\n  | { type: 'create'; preview: PreviewObject<P> }\n  | { type: 'update'; id: string; props: Partial<P>; options?: Partial<PreviewOptions> }\n  | { type: 'unmount'; id: string }\n  | { type: 'clear' };\n\nconst reducer = <P extends object>(\n  previews: PreviewObject[] | [],\n  payload: PreviewReducerPayload<P>\n): PreviewObject<object>[] => {\n  switch (payload.type) {\n    case 'create':\n      // Stub for multiple preview support\n      // return [...previews, payload.preview as unknown as PreviewObject<object>];\n      return [payload.preview as unknown as PreviewObject<object>];\n\n    case 'update':\n      return previews.map(preview =>\n        preview.id === payload.id\n          ? {\n              ...preview,\n              props: { ...preview.props, ...payload.props },\n              options: {\n                ...preview.options,\n                ...payload.options,\n                previewProps: {\n                  ...preview.options?.previewProps,\n                  ...payload.options?.previewProps\n                }\n              }\n            }\n          : preview\n      );\n\n    case 'unmount':\n      return previews.filter(preview => preview.id !== payload.id);\n\n    case 'clear':\n      return [];\n\n    default:\n      return previews;\n  }\n};\n\nconst WrappedPreview = memo(\n  ({\n    Component,\n    props,\n    options,\n    previewStateSetter,\n    previewTriggerRef,\n    methods\n  }: PreviewObject & {\n    previewStateSetter: Dispatch<SetStateAction<boolean>>;\n    previewTriggerRef: MutableRefObject<HTMLElement | null>;\n  }) => {\n    const optionsRef = useRef(options);\n    optionsRef.current = options;\n\n    // This state change is required to transition the case preview in.\n    const [open, setOpen] = useState(false);\n    const openRef = useRef(false);\n\n    const cleanupPreview = () => {\n      setOpen(false);\n      openRef.current = false;\n      previewStateSetter(false);\n      optionsRef.current?.previewProps.onAfterClose?.();\n      methods.unmountPreview();\n    };\n\n    useEffect(() => {\n      setOpen(true);\n      openRef.current = true;\n      previewStateSetter(true);\n      return () => {\n        // Guard with openRef so we don't double-fire if already closed via the close button.\n        if (openRef.current) {\n          optionsRef.current?.previewProps.onBeforeClose?.();\n          cleanupPreview();\n        }\n      };\n    }, []);\n\n    return (\n      <PreviewContext.Provider\n        // eslint-disable-next-line react/jsx-no-constructed-context-values\n        value={{\n          initialized: true,\n          previewTriggerRef,\n          ...methods\n        }}\n      >\n        <PreviewPanel\n          open={open}\n          {...options?.previewProps}\n          onAfterClose={() => {\n            cleanupPreview();\n          }}\n        >\n          <Component {...(props as Record<string, unknown>)} />\n        </PreviewPanel>\n      </PreviewContext.Provider>\n    );\n  }\n);\n\nconst PreviewManager = ({ children }: PreviewManagerProps) => {\n  const [previews, dispatch] = useReducer(reducer, []);\n  const [previewActive, setPreviewActive] = useState(false);\n  const previewTriggerRef = useRef<HTMLElement | null>(null);\n  const { portalTarget } = useConfiguration();\n  const isSmallOrAbove = useBreakpoint('sm');\n\n  // Dismiss all previews when screen size reflows below sm breakpoint\n  useEffect(() => {\n    if (!isSmallOrAbove && previews.length > 0) {\n      dispatch({ type: 'clear' });\n    }\n  }, [isSmallOrAbove, previews.length]);\n\n  const providerValue = useMemo(\n    () => ({\n      previewActive,\n      setPreviewActive,\n      createPreview: <P extends object>(\n        Component: ComponentType<P>,\n        props?: DeferInfer<P>,\n        options?: PreviewOptions\n      ): PreviewMethods<P> => {\n        const id = createUID();\n\n        const methods = {\n          updatePreview: (updatedProps: Partial<P>, updatedOptions?: Partial<PreviewOptions>) => {\n            (dispatch as Dispatch<PreviewReducerPayload<P>>)({\n              type: 'update',\n              id,\n              props: updatedProps,\n              options: updatedOptions\n            });\n          },\n          unmountPreview: () => {\n            dispatch({ type: 'unmount', id });\n          }\n        };\n\n        (dispatch as Dispatch<PreviewReducerPayload<P>>)({\n          type: 'create',\n          preview: {\n            id,\n            Component,\n            methods,\n            props: (props ?? {}) as P,\n            options\n          }\n        });\n\n        return methods;\n      },\n      PreviewContext,\n      initialized: true\n    }),\n    [previewActive]\n  );\n\n  const context = windowIsAvailable\n    ? window.cosmos.previewManagerContext ?? PreviewManagerContext\n    : PreviewManagerContext;\n  const priorCtx = useContext(context);\n\n  // Don't create additional Preview managers.\n  if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n  const previewPortal =\n    portalTarget && previews.length > 0\n      ? createPortal(\n          previews.map(preview => (\n            <WrappedPreview\n              {...preview}\n              key={preview.id}\n              previewStateSetter={setPreviewActive}\n              previewTriggerRef={previewTriggerRef}\n            />\n          )),\n          portalTarget\n        )\n      : null;\n\n  return (\n    <context.Provider value={providerValue}>\n      {/* eslint-disable-next-line react/jsx-no-constructed-context-values */}\n      <PreviewContext.Provider value={{ initialized: false, previewTriggerRef }}>\n        {children}\n        {previewPortal}\n      </PreviewContext.Provider>\n    </context.Provider>\n  );\n};\n\nexport default PreviewManager;\n"]}

package/lib/components/Preview/PreviewPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAIzD,eAAO,MAAM,mBAAmB,mVA2B9B,CAAC;;;;AA4HH,wBAAiE"}
+{"version":3,"file":"PreviewPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAIzD,eAAO,MAAM,mBAAmB,mVA2B9B,CAAC;;;;AAqIH,wBAAiE"}

package/lib/components/Preview/PreviewPanel.js

@@ -72,6 +72,11 @@ const StyledCloseButton = styled(Button)(({ theme }) => {
   `;
 });
 StyledCloseButton.defaultProps = defaultThemeProp;
+const StyledContentOverflow = styled(Flex) `
+  min-height: 0;
+  overflow-y: auto;
+`;
+StyledContentOverflow.defaultProps = defaultThemeProp;
 const PreviewPanel = forwardRef(function PreviewPanel({ testId, previewLabel, open, children, progress, onBeforeOpen, onAfterOpen, onBeforeClose, onAfterClose, ...restProps }, ref) {
     const testIds = useTestIds(testId, getPreviewPanelTestIds);
     const t = useI18n();
@@ -104,7 +109,7 @@ const PreviewPanel = forwardRef(function PreviewPanel({ testId, previewLabel, op
                     previewTriggerRef.current?.focus();
                 }, ref: setCloseButtonEl, label: t('close_preview'), children: _jsx(Icon, { name: 'times', size: 'font-size' }) }), _jsx(Progress, { "data-testid": testIds.progress, placement: 'local', visible: !!progress, focusOnVisible: true, delay: true, onTransitionStartIn: () => {
                     setProgressVisible(true);
-                }, onTransitionEndOut: () => setProgressVisible(false) }), !progress && children] }));
+                }, onTransitionEndOut: () => setProgressVisible(false) }), _jsx(StyledContentOverflow, { item: { grow: 1, basis: '0' }, children: !progress && children })] }));
 });
 export default withTestIds(PreviewPanel, getPreviewPanelTestIds);
 //# sourceMappingURL=PreviewPanel.js.map

package/lib/components/Preview/PreviewPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewPanel.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport getFocusables from '../../utils/getFocusables';\nimport Icon, { registerIcon } from '../Icon';\nimport Progress from '../Progress';\nimport { readableHue } from '../../styles/utils';\nimport {\n  resizeDrawerDefaultWidth,\n  resizeDrawerMaxWidth,\n  resizeDrawerMinWidth\n} from '../../styles/constants';\nimport { StyledResizeHandle } from '../Drawer/ResizeHandle';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport useConsolidatedRef from '../../hooks/useConsolidatedRef';\nimport useDirection from '../../hooks/useDirection';\nimport useElement from '../../hooks/useElement';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport useI18n from '../../hooks/useI18n';\nimport usePreviewContext from '../../hooks/usePreviewContext';\nimport useTestIds from '../../hooks/useTestIds';\nimport { withTestIds } from '../../utils';\n\nimport { getPreviewPanelTestIds } from './PreviewPanel.test-ids';\nimport type { PreviewPanelProps } from './Preview.types';\n\nregisterIcon(timesIcon);\n\nexport const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {\n  return css`\n    min-width: ${resizeDrawerMinWidth};\n    max-width: ${resizeDrawerMaxWidth};\n    width: var(--resize-drawer-width);\n    background-color: ${theme.base.palette['app-background']};\n    height: auto;\n    inset-block-start: var(--appshell-top-offset, 0);\n    inset-block-end: var(--appshell-bottom-offset, 0);\n    z-index: calc(${theme.base['z-index'].backdrop} - 1);\n    transition-property: transform, box-shadow, opacity, border-inline-start;\n    transition-duration: max(${theme.base.animation.speed}, 1ms);\n    transition-timing-function: ${theme.base.animation.timing.ease};\n\n    ${StyledResizeHandle} {\n      z-index: calc(${theme.base['z-index'].max - 1});\n    }\n\n    @media (width >= ${theme.base.breakpoints.md}) {\n      box-shadow: none;\n      border-inline-start: 0.0625rem solid\n        ${readableHue(theme.base.palette['border-line'], theme.base.palette['app-background'], {\n          mode: 'both',\n          level: 'AANonText'\n        })};\n    }\n  `;\n});\n\nStyledPreviewDrawer.defaultProps = defaultThemeProp;\n\nconst StyledCloseButton = styled(Button)(({ theme }) => {\n  return css`\n    --half-btn-compact-difference: calc(\n      (${theme.base['hit-area'].mouse} - ${theme.base['hit-area'].compact}) / 2\n    );\n    @media (pointer: coarse) {\n      --half-btn-compact-difference: calc(\n        (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n      );\n    }\n    position: absolute;\n    border: none;\n\n    /* Places above resize handle */\n    z-index: ${theme.base['z-index'].max};\n    box-shadow: ${theme.base.shadow.low};\n    inset-inline-start: calc(-${theme.base['hit-area'].compact} / 2);\n    inset-block-start: calc(2 * ${theme.base.spacing} + var(--half-btn-compact-difference));\n  `;\n});\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nconst PreviewPanel = forwardRef(function PreviewPanel(\n  {\n    testId,\n    previewLabel,\n    open,\n    children,\n    progress,\n    onBeforeOpen,\n    onAfterOpen,\n    onBeforeClose,\n    onAfterClose,\n    ...restProps\n  }: PropsWithoutRef<PreviewPanelProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const testIds = useTestIds(testId, getPreviewPanelTestIds);\n\n  const t = useI18n();\n  const direction = useDirection();\n  const previewRef = useConsolidatedRef(ref);\n  const { previewTriggerRef } = usePreviewContext();\n\n  const [closeButtonEl, setCloseButtonEl] = useElement<HTMLButtonElement>();\n  const [progressVisible, setProgressVisible] = useState(false);\n\n  const setFocus = () => {\n    if (progressVisible) return;\n\n    const focusables = getFocusables(previewRef).filter(el => el !== closeButtonEl);\n    const focusable = focusables[0] ?? closeButtonEl;\n    focusable?.focus();\n  };\n\n  useEffect(() => {\n    if (!progressVisible) {\n      setFocus();\n    }\n  }, [progressVisible]);\n\n  useFocusTrap(previewRef, true, [], false);\n\n  return (\n    <Drawer\n      data-testid={testIds.root}\n      onBeforeOpen={() => {\n        onBeforeOpen?.();\n      }}\n      onAfterOpen={() => {\n        setFocus();\n        onAfterOpen?.();\n      }}\n      as={StyledPreviewDrawer}\n      role='complementary'\n      forwardedAs={Flex}\n      container={{ direction: 'column' }}\n      ref={previewRef}\n      position='fixed'\n      placement={direction.end}\n      size={resizeDrawerDefaultWidth}\n      aria-label={previewLabel ? t('preview_of_noun', [previewLabel]) : t('preview')}\n      open={open}\n      resizeable\n      shadow\n      nullWhenClosed\n      {...restProps}\n    >\n      <StyledCloseButton\n        data-testid={testIds.close}\n        icon\n        compact\n        onClick={() => {\n          onBeforeClose?.();\n          onAfterClose?.();\n          previewTriggerRef.current?.focus();\n        }}\n        ref={setCloseButtonEl}\n        label={t('close_preview')}\n      >\n        <Icon name='times' size='font-size' />\n      </StyledCloseButton>\n\n      <Progress\n        data-testid={testIds.progress}\n        placement='local'\n        visible={!!progress}\n        focusOnVisible\n        delay\n        onTransitionStartIn={() => {\n          setProgressVisible(true);\n        }}\n        onTransitionEndOut={() => setProgressVisible(false)}\n      />\n      {!progress && children}\n    </Drawer>\n  );\n});\n\nexport default withTestIds(PreviewPanel, getPreviewPanelTestIds);\n"]}
+{"version":3,"file":"PreviewPanel.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport getFocusables from '../../utils/getFocusables';\nimport Icon, { registerIcon } from '../Icon';\nimport Progress from '../Progress';\nimport { readableHue } from '../../styles/utils';\nimport {\n  resizeDrawerDefaultWidth,\n  resizeDrawerMaxWidth,\n  resizeDrawerMinWidth\n} from '../../styles/constants';\nimport { StyledResizeHandle } from '../Drawer/ResizeHandle';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport useConsolidatedRef from '../../hooks/useConsolidatedRef';\nimport useDirection from '../../hooks/useDirection';\nimport useElement from '../../hooks/useElement';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport useI18n from '../../hooks/useI18n';\nimport usePreviewContext from '../../hooks/usePreviewContext';\nimport useTestIds from '../../hooks/useTestIds';\nimport { withTestIds } from '../../utils';\n\nimport { getPreviewPanelTestIds } from './PreviewPanel.test-ids';\nimport type { PreviewPanelProps } from './Preview.types';\n\nregisterIcon(timesIcon);\n\nexport const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {\n  return css`\n    min-width: ${resizeDrawerMinWidth};\n    max-width: ${resizeDrawerMaxWidth};\n    width: var(--resize-drawer-width);\n    background-color: ${theme.base.palette['app-background']};\n    height: auto;\n    inset-block-start: var(--appshell-top-offset, 0);\n    inset-block-end: var(--appshell-bottom-offset, 0);\n    z-index: calc(${theme.base['z-index'].backdrop} - 1);\n    transition-property: transform, box-shadow, opacity, border-inline-start;\n    transition-duration: max(${theme.base.animation.speed}, 1ms);\n    transition-timing-function: ${theme.base.animation.timing.ease};\n\n    ${StyledResizeHandle} {\n      z-index: calc(${theme.base['z-index'].max - 1});\n    }\n\n    @media (width >= ${theme.base.breakpoints.md}) {\n      box-shadow: none;\n      border-inline-start: 0.0625rem solid\n        ${readableHue(theme.base.palette['border-line'], theme.base.palette['app-background'], {\n          mode: 'both',\n          level: 'AANonText'\n        })};\n    }\n  `;\n});\n\nStyledPreviewDrawer.defaultProps = defaultThemeProp;\n\nconst StyledCloseButton = styled(Button)(({ theme }) => {\n  return css`\n    --half-btn-compact-difference: calc(\n      (${theme.base['hit-area'].mouse} - ${theme.base['hit-area'].compact}) / 2\n    );\n    @media (pointer: coarse) {\n      --half-btn-compact-difference: calc(\n        (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n      );\n    }\n    position: absolute;\n    border: none;\n\n    /* Places above resize handle */\n    z-index: ${theme.base['z-index'].max};\n    box-shadow: ${theme.base.shadow.low};\n    inset-inline-start: calc(-${theme.base['hit-area'].compact} / 2);\n    inset-block-start: calc(2 * ${theme.base.spacing} + var(--half-btn-compact-difference));\n  `;\n});\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nconst StyledContentOverflow = styled(Flex)`\n  min-height: 0;\n  overflow-y: auto;\n`;\n\nStyledContentOverflow.defaultProps = defaultThemeProp;\n\nconst PreviewPanel = forwardRef(function PreviewPanel(\n  {\n    testId,\n    previewLabel,\n    open,\n    children,\n    progress,\n    onBeforeOpen,\n    onAfterOpen,\n    onBeforeClose,\n    onAfterClose,\n    ...restProps\n  }: PropsWithoutRef<PreviewPanelProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const testIds = useTestIds(testId, getPreviewPanelTestIds);\n\n  const t = useI18n();\n  const direction = useDirection();\n  const previewRef = useConsolidatedRef(ref);\n  const { previewTriggerRef } = usePreviewContext();\n\n  const [closeButtonEl, setCloseButtonEl] = useElement<HTMLButtonElement>();\n  const [progressVisible, setProgressVisible] = useState(false);\n\n  const setFocus = () => {\n    if (progressVisible) return;\n\n    const focusables = getFocusables(previewRef).filter(el => el !== closeButtonEl);\n    const focusable = focusables[0] ?? closeButtonEl;\n    focusable?.focus();\n  };\n\n  useEffect(() => {\n    if (!progressVisible) {\n      setFocus();\n    }\n  }, [progressVisible]);\n\n  useFocusTrap(previewRef, true, [], false);\n\n  return (\n    <Drawer\n      data-testid={testIds.root}\n      onBeforeOpen={() => {\n        onBeforeOpen?.();\n      }}\n      onAfterOpen={() => {\n        setFocus();\n        onAfterOpen?.();\n      }}\n      as={StyledPreviewDrawer}\n      role='complementary'\n      forwardedAs={Flex}\n      container={{ direction: 'column' }}\n      ref={previewRef}\n      position='fixed'\n      placement={direction.end}\n      size={resizeDrawerDefaultWidth}\n      aria-label={previewLabel ? t('preview_of_noun', [previewLabel]) : t('preview')}\n      open={open}\n      resizeable\n      shadow\n      nullWhenClosed\n      {...restProps}\n    >\n      <StyledCloseButton\n        data-testid={testIds.close}\n        icon\n        compact\n        onClick={() => {\n          onBeforeClose?.();\n          onAfterClose?.();\n          previewTriggerRef.current?.focus();\n        }}\n        ref={setCloseButtonEl}\n        label={t('close_preview')}\n      >\n        <Icon name='times' size='font-size' />\n      </StyledCloseButton>\n\n      <Progress\n        data-testid={testIds.progress}\n        placement='local'\n        visible={!!progress}\n        focusOnVisible\n        delay\n        onTransitionStartIn={() => {\n          setProgressVisible(true);\n        }}\n        onTransitionEndOut={() => setProgressVisible(false)}\n      />\n      <StyledContentOverflow item={{ grow: 1, basis: '0' }}>\n        {!progress && children}\n      </StyledContentOverflow>\n    </Drawer>\n  );\n});\n\nexport default withTestIds(PreviewPanel, getPreviewPanelTestIds);\n"]}

package/lib/components/ResponsiveActions/ResponsiveActions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveActions.d.ts","sourceRoot":"","sources":["../../../src/components/ResponsiveActions/ResponsiveActions.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlD,OAAO,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE1D,KAAK,sBAAsB,GAAG,cAAc,CAC1C,KAAK,EACL,MAAM,GAAG;IAEP,UAAU,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IAEnC,SAAS,EAAE,SAAS,CAAC;CACtB,CACF,CAAC;AAEF,eAAO,MAAM,gCAAgC;cAA0B,OAAO;YAuB7E,CAAC;AAEF,QAAA,MAAM,iBAAiB,GAAI,6CAA6C,sBAAsB,4CAoE7F,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"ResponsiveActions.d.ts","sourceRoot":"","sources":["../../../src/components/ResponsiveActions/ResponsiveActions.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlD,OAAO,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE1D,KAAK,sBAAsB,GAAG,cAAc,CAC1C,KAAK,EACL,MAAM,GAAG;IAEP,UAAU,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IAEnC,SAAS,EAAE,SAAS,CAAC;CACtB,CACF,CAAC;AAEF,eAAO,MAAM,gCAAgC;cAA0B,OAAO;YAwB7E,CAAC;AAEF,QAAA,MAAM,iBAAiB,GAAI,6CAA6C,sBAAsB,4CAoE7F,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/ResponsiveActions/ResponsiveActions.js

@@ -23,6 +23,7 @@ export const StyledResponsiveActionsContainer = styled.div(({ stacked }) => css
     &[aria-hidden='true'] {
       position: fixed;
       visibility: hidden;
+      inset-inline-end: 100lvi;
     }
   `);
 const ResponsiveActions = ({ actionsRef, actionsEl, as, ...restProps }) => {

package/lib/components/ResponsiveActions/ResponsiveActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveActions.js","sourceRoot":"","sources":["../../../src/components/ResponsiveActions/ResponsiveActions.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react';\nimport type { ReactNode, RefObject } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../Flex';\nimport { StyledButton } from '../Button';\nimport type { AsProp, WithAttributes } from '../../types';\n\ntype ResponsiveActionsProps = WithAttributes<\n  'div',\n  AsProp & {\n    /* Ref assigned to the actions region. */\n    actionsRef: RefObject<HTMLElement>;\n    /* Actions region content. */\n    actionsEl: ReactNode;\n  }\n>;\n\nexport const StyledResponsiveActionsContainer = styled.div<{ stacked?: boolean }>(\n  ({ stacked }) => css`\n    ${StyledButton} + ${StyledButton} {\n      margin-inline-start: unset;\n    }\n\n    & > :not(a, button) {\n      display: contents;\n    }\n\n    ${!stacked &&\n    css`\n      & > :is(a, button):first-child:not(:last-child),\n      & > :first-child:not(:last-child) :is(a, button):first-child {\n        margin-inline-end: auto;\n      }\n    `}\n\n    &[aria-hidden='true'] {\n      position: fixed;\n      visibility: hidden;\n    }\n  `\n);\n\nconst ResponsiveActions = ({ actionsRef, actionsEl, as, ...restProps }: ResponsiveActionsProps) => {\n  const hiddenActionsRef = useRef<HTMLDivElement>(null);\n  const [stacked, setStacked] = useState(false);\n\n  useLayoutEffect(() => {\n    if (hiddenActionsRef.current && actionsRef.current) {\n      const minInlineWidth = hiddenActionsRef.current.getBoundingClientRect().width;\n\n      const resizeObserver = new ResizeObserver(entries => {\n        setTimeout(() => {\n          if (stacked && entries[0].borderBoxSize[0].inlineSize > minInlineWidth) {\n            setStacked(false);\n          } else if (!stacked && entries[0].borderBoxSize[0].inlineSize <= minInlineWidth) {\n            setStacked(true);\n          }\n        }, 0);\n      });\n\n      resizeObserver.observe(actionsRef.current);\n\n      return () => {\n        resizeObserver.disconnect();\n      };\n    }\n  });\n\n  useLayoutEffect(() => {\n    hiddenActionsRef.current?.querySelectorAll('a, button').forEach(action => {\n      if (action.hasAttribute('id')) {\n        action.removeAttribute('id');\n      }\n      if (action.hasAttribute('data-testid')) {\n        action.removeAttribute('data-testid');\n      }\n      action.setAttribute('role', 'none');\n    });\n  });\n\n  return (\n    <>\n      <Flex\n        {...restProps}\n        as={StyledResponsiveActionsContainer}\n        forwardedAs={as}\n        ref={actionsRef}\n        stacked={stacked}\n        container={{\n          gap: 1,\n          ...(stacked ? { direction: 'column' } : { justify: 'end' })\n        }}\n      >\n        {actionsEl}\n      </Flex>\n      <Flex\n        as={StyledResponsiveActionsContainer}\n        ref={hiddenActionsRef}\n        aria-hidden\n        inert=''\n        container={{\n          gap: 1,\n          direction: 'row',\n          justify: 'end'\n        }}\n      >\n        {actionsEl}\n      </Flex>\n    </>\n  );\n};\n\nexport default ResponsiveActions;\n"]}
+{"version":3,"file":"ResponsiveActions.js","sourceRoot":"","sources":["../../../src/components/ResponsiveActions/ResponsiveActions.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react';\nimport type { ReactNode, RefObject } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../Flex';\nimport { StyledButton } from '../Button';\nimport type { AsProp, WithAttributes } from '../../types';\n\ntype ResponsiveActionsProps = WithAttributes<\n  'div',\n  AsProp & {\n    /* Ref assigned to the actions region. */\n    actionsRef: RefObject<HTMLElement>;\n    /* Actions region content. */\n    actionsEl: ReactNode;\n  }\n>;\n\nexport const StyledResponsiveActionsContainer = styled.div<{ stacked?: boolean }>(\n  ({ stacked }) => css`\n    ${StyledButton} + ${StyledButton} {\n      margin-inline-start: unset;\n    }\n\n    & > :not(a, button) {\n      display: contents;\n    }\n\n    ${!stacked &&\n    css`\n      & > :is(a, button):first-child:not(:last-child),\n      & > :first-child:not(:last-child) :is(a, button):first-child {\n        margin-inline-end: auto;\n      }\n    `}\n\n    &[aria-hidden='true'] {\n      position: fixed;\n      visibility: hidden;\n      inset-inline-end: 100lvi;\n    }\n  `\n);\n\nconst ResponsiveActions = ({ actionsRef, actionsEl, as, ...restProps }: ResponsiveActionsProps) => {\n  const hiddenActionsRef = useRef<HTMLDivElement>(null);\n  const [stacked, setStacked] = useState(false);\n\n  useLayoutEffect(() => {\n    if (hiddenActionsRef.current && actionsRef.current) {\n      const minInlineWidth = hiddenActionsRef.current.getBoundingClientRect().width;\n\n      const resizeObserver = new ResizeObserver(entries => {\n        setTimeout(() => {\n          if (stacked && entries[0].borderBoxSize[0].inlineSize > minInlineWidth) {\n            setStacked(false);\n          } else if (!stacked && entries[0].borderBoxSize[0].inlineSize <= minInlineWidth) {\n            setStacked(true);\n          }\n        }, 0);\n      });\n\n      resizeObserver.observe(actionsRef.current);\n\n      return () => {\n        resizeObserver.disconnect();\n      };\n    }\n  });\n\n  useLayoutEffect(() => {\n    hiddenActionsRef.current?.querySelectorAll('a, button').forEach(action => {\n      if (action.hasAttribute('id')) {\n        action.removeAttribute('id');\n      }\n      if (action.hasAttribute('data-testid')) {\n        action.removeAttribute('data-testid');\n      }\n      action.setAttribute('role', 'none');\n    });\n  });\n\n  return (\n    <>\n      <Flex\n        {...restProps}\n        as={StyledResponsiveActionsContainer}\n        forwardedAs={as}\n        ref={actionsRef}\n        stacked={stacked}\n        container={{\n          gap: 1,\n          ...(stacked ? { direction: 'column' } : { justify: 'end' })\n        }}\n      >\n        {actionsEl}\n      </Flex>\n      <Flex\n        as={StyledResponsiveActionsContainer}\n        ref={hiddenActionsRef}\n        aria-hidden\n        inert=''\n        container={{\n          gap: 1,\n          direction: 'row',\n          justify: 'end'\n        }}\n      >\n        {actionsEl}\n      </Flex>\n    </>\n  );\n};\n\nexport default ResponsiveActions;\n"]}

package/lib/hooks/useI18n.d.ts

@@ -1875,6 +1875,8 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     app_info_view_content: string;
     app_info_switch_branch: string;
     app_info_update_from_main: string;
+    app_info_commit_private_changes: string;
+    app_info_merge_to_main: string;
     app_info_view_branches: string;
     app_info_application_version: string;
     app_preview_loading: string;

package/lib/hooks/useI18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/i18n/default.d.ts

@@ -1878,6 +1878,8 @@ declare const _default: {
     app_info_view_content: string;
     app_info_switch_branch: string;
     app_info_update_from_main: string;
+    app_info_commit_private_changes: string;
+    app_info_merge_to_main: string;
     app_info_view_branches: string;
     app_info_application_version: string;
     /** studio-dx-components: Preview */

package/lib/i18n/default.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../src/i18n/default.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAmvDE,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAuPxB,6CAA6C;;;;;;;;;;;;;;IAgB7C,6CAA6C;;;;;;;;IAS7C,yCAAyC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAwGzC,+BAA+B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA2C/B,wCAAwC;;IAGxC,oCAAoC;;;;;;;;IASpC,oCAAoC;;;;;;IAOpC,uCAAuC;;;;;;;;;;;IAavC,6CAA6C;;;;;;;IAQ7C,uCAAuC;;;;;;;;IAUvC,yCAAyC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAxsE3C,wBAwvEE"}
+{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../src/i18n/default.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAmvDE,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAuPxB,6CAA6C;;;;;;;;;;;;;;IAgB7C,6CAA6C;;;;;;;;IAS7C,yCAAyC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAwGzC,+BAA+B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA2C/B,wCAAwC;;IAGxC,oCAAoC;;;;;;;;;;IAWpC,oCAAoC;;;;;;IAOpC,uCAAuC;;;;;;;;;;;IAavC,6CAA6C;;;;;;;IAQ7C,uCAAuC;;;;;;;;IAUvC,yCAAyC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA1sE3C,wBA0vEE"}

package/lib/i18n/default.js

@@ -2023,7 +2023,9 @@ export default {
     app_info_create_branch: 'Create branch',
     app_info_view_content: 'View branch contents',
     app_info_switch_branch: 'Switch to branch',
-    app_info_update_from_main: 'Update from main',
+    app_info_update_from_main: 'Update from Main',
+    app_info_commit_private_changes: 'Commit private changes to branch',
+    app_info_merge_to_main: 'Merge to Main',
     app_info_view_branches: 'View all branches',
     app_info_application_version: '{0} - v. {1}',
     /** studio-dx-components: Preview */