@skodaflow/web-library 8.3.2 → 8.4.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.
- package/cjs/components/advancedTable/agGrid.js +1 -1
- package/cjs/components/advancedTable/agGrid.js.map +1 -1
- package/cjs/components/advancedTable/agGridSkodaTheme.d.ts +3 -0
- package/cjs/components/advancedTable/agGridSkodaTheme.js +1 -1
- package/cjs/components/advancedTable/agGridSkodaTheme.js.map +1 -1
- package/cjs/components/advancedTable/agGridUniformRowHeight.d.ts +36 -0
- package/cjs/components/advancedTable/agGridUniformRowHeight.js +2 -0
- package/cjs/components/advancedTable/agGridUniformRowHeight.js.map +1 -0
- package/cjs/components/advancedTable/agGridVariables.js +1 -1
- package/cjs/components/advancedTable/agGridVariables.js.map +1 -1
- package/cjs/components/advancedTable/index.d.ts +1 -0
- package/cjs/components/alert/AlertIconButton.d.ts +8 -0
- package/cjs/components/alert/AlertIconButton.js +2 -0
- package/cjs/components/alert/AlertIconButton.js.map +1 -0
- package/cjs/components/alert/index.d.ts +1 -0
- package/cjs/components/copyButton/CopyButton.d.ts +39 -0
- package/cjs/components/copyButton/CopyButton.js +2 -0
- package/cjs/components/copyButton/CopyButton.js.map +1 -0
- package/cjs/components/copyButton/CopyIconButton.d.ts +8 -0
- package/cjs/components/copyButton/CopyIconButton.js +2 -0
- package/cjs/components/copyButton/CopyIconButton.js.map +1 -0
- package/cjs/components/copyButton/index.d.ts +3 -0
- package/cjs/components/copyButton/useCopyAction.d.ts +31 -0
- package/cjs/components/copyButton/useCopyAction.js +2 -0
- package/cjs/components/copyButton/useCopyAction.js.map +1 -0
- package/cjs/components/footer/FooterMenuCollapse.js +1 -1
- package/cjs/components/footer/FooterMenuCollapse.js.map +1 -1
- package/cjs/components/index.d.ts +1 -0
- package/cjs/index.js +1 -1
- package/cjs/materialui/alert/alert.theme.js +1 -1
- package/cjs/materialui/alert/alert.theme.js.map +1 -1
- package/cjs/materialui/alert/alertTitle.theme.js +1 -1
- package/cjs/materialui/alert/alertTitle.theme.js.map +1 -1
- package/cjs/materialui/datepicker/datecalendar.theme.d.ts +102 -102
- package/cjs/materialui/datepicker/digitalclock.theme.d.ts +102 -102
- package/cjs/materialui/iconButton/iconButton.theme.js.map +1 -1
- package/cjs/materialui/theme/theme.extensions.d.ts +11 -1
- package/cjs/materialui/typography/typography.theme.js +1 -1
- package/cjs/materialui/typography/typography.theme.js.map +1 -1
- package/cjs/node_modules/swiper/shared/swiper-core.js +1 -1
- package/cjs/node_modules/swiper/shared/swiper-core.js.map +1 -1
- package/cjs/node_modules/swiper/swiper-react.js +1 -1
- package/cjs/node_modules/swiper/swiper-react.js.map +1 -1
- package/components/advancedTable/agGrid.js +1 -1
- package/components/advancedTable/agGrid.js.map +1 -1
- package/components/advancedTable/agGridSkodaTheme.d.ts +3 -0
- package/components/advancedTable/agGridSkodaTheme.js +1 -1
- package/components/advancedTable/agGridSkodaTheme.js.map +1 -1
- package/components/advancedTable/agGridUniformRowHeight.d.ts +36 -0
- package/components/advancedTable/agGridUniformRowHeight.js +2 -0
- package/components/advancedTable/agGridUniformRowHeight.js.map +1 -0
- package/components/advancedTable/agGridVariables.js +1 -1
- package/components/advancedTable/agGridVariables.js.map +1 -1
- package/components/advancedTable/index.d.ts +1 -0
- package/components/alert/AlertIconButton.d.ts +8 -0
- package/components/alert/AlertIconButton.js +2 -0
- package/components/alert/AlertIconButton.js.map +1 -0
- package/components/alert/index.d.ts +1 -0
- package/components/copyButton/CopyButton.d.ts +39 -0
- package/components/copyButton/CopyButton.js +2 -0
- package/components/copyButton/CopyButton.js.map +1 -0
- package/components/copyButton/CopyIconButton.d.ts +8 -0
- package/components/copyButton/CopyIconButton.js +2 -0
- package/components/copyButton/CopyIconButton.js.map +1 -0
- package/components/copyButton/index.d.ts +3 -0
- package/components/copyButton/useCopyAction.d.ts +31 -0
- package/components/copyButton/useCopyAction.js +2 -0
- package/components/copyButton/useCopyAction.js.map +1 -0
- package/components/footer/FooterMenuCollapse.js +1 -1
- package/components/footer/FooterMenuCollapse.js.map +1 -1
- package/components/index.d.ts +1 -0
- package/index.js +1 -1
- package/materialui/alert/alert.theme.js +1 -1
- package/materialui/alert/alert.theme.js.map +1 -1
- package/materialui/alert/alertTitle.theme.js +1 -1
- package/materialui/alert/alertTitle.theme.js.map +1 -1
- package/materialui/datepicker/datecalendar.theme.d.ts +102 -102
- package/materialui/datepicker/digitalclock.theme.d.ts +102 -102
- package/materialui/iconButton/iconButton.theme.js.map +1 -1
- package/materialui/theme/theme.extensions.d.ts +11 -1
- package/materialui/typography/typography.theme.js +1 -1
- package/materialui/typography/typography.theme.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"iconButton.theme.js","sources":["../../../src/materialui/iconButton/iconButton.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowIconButton: Components<Theme>['MuiIconButton'] = {\n defaultProps: {\n disableRipple: true,\n variant: 'standard',\n color: 'secondary',\n size: 'medium',\n },\n styleOverrides: {\n root: ({ theme }) => ({\n position: 'relative',\n boxShadow: 'none',\n outline: 'none',\n width: '44px',\n height: '44px',\n borderRadius: '1000px',\n maxWidth: 'none',\n transition: 'all 0.3s ease-out',\n flexShrink: '0',\n '&:hover': {\n boxShadow: 'none',\n },\n '&&:active': {\n boxShadow: 'none',\n },\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n },\n {\n // hover effect also in accordionSummary.theme.tsx\n backgroundColor: theme.palette.transparent.secondary,\n },\n ),\n // focused style\n ...getFocusRingStyle(theme),\n // disabled style\n '&.Mui-disabled': {\n opacity: '1',\n color: theme.palette.disabled.primary,\n },\n }),\n sizeSmall: {\n height: '32px',\n width: '32px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n },\n },\n sizeMedium: {\n // width & height & borderRadius is default in root\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '20px',\n },\n },\n sizeLarge: {\n height: '50px',\n width: '50px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '22px',\n },\n },\n },\n variants: [\n {\n props: { color: 'secondary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.text.primary,\n },\n {\n color: theme.palette.text.primary,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled' },\n style: ({ theme }) => ({\n // disabled style\n '&.Mui-disabled': {\n opacity: '1',\n backgroundColor: theme.palette.disabled.secondary,\n color: theme.palette.disabled.tertiary,\n },\n }),\n },\n {\n props: { variant: 'filled', color: 'primary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.brand.secondary,\n color: theme.palette.onSurface.os900,\n },\n {\n backgroundColor: theme.palette.brandHover.secondary,\n color: theme.palette.onSurface.os900,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled', color: 'secondary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.secondary.main,\n color: theme.palette.secondary.contrastText,\n },\n {\n backgroundColor: theme.palette.secondary.light,\n color: theme.palette.secondary.contrastText,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled', color: 'error' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.error.contrastText,\n backgroundColor: theme.palette.error.main,\n },\n {\n color: theme.palette.error.contrastText,\n backgroundColor: theme.palette.error.dark,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled', color: 'inherit' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.transparent.secondary,\n },\n {\n backgroundColor: theme.palette.surface.primary,\n },\n ),\n }),\n },\n {\n props: { variant: 'outlined' },\n style: {\n border: '2px solid currentColor',\n ...updateFocusRingStyle(2),\n },\n },\n {\n props: { variant: 'outlined', size: 'small' },\n style: {\n borderWidth: '1px',\n ...updateFocusRingStyle(1),\n },\n },\n {\n props: { color: 'surface' },\n style: ({ theme }) => ({\n border: `1px solid ${theme.palette.mode === 'dark' ? theme.palette.transparent.quarternary : theme.palette.onSurface.os100}`,\n ...updateFocusRingStyle(1),\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.surface.primary,\n color: theme.palette.text.primary,\n },\n {\n backgroundColor: theme.palette.surface.secondary,\n color: theme.palette.text.primary,\n },\n ),\n // disabled style\n '&.Mui-disabled': {\n backgroundColor: theme.palette.surface.secondary,\n borderColor: theme.palette.surface.secondary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n {\n props: { color: 'surface', variant: 'outlined' },\n style: {\n borderWidth: '2px',\n ...updateFocusRingStyle(2),\n },\n },\n {\n props: { color: 'white' },\n style: ({ theme }) => ({\n // hover effect also in accordionSummary.theme.tsx\n // hover effect also in FooterAccordion.tsx\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os0,\n },\n {\n color: theme.palette.onSurface.os0,\n backgroundColor: theme.palette.transparent.tertiary,\n },\n ),\n // disabled style\n '&.Mui-disabled': {\n borderColor: theme.palette.disabled.primary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n ],\n};\n"],"names":["flowIconButton","defaultProps","disableRipple","variant","color","size","styleOverrides","root","theme","position","boxShadow","outline","width","height","borderRadius","maxWidth","transition","flexShrink","getInteractiveStyle","backgroundColor","palette","transparent","secondary","getFocusRingStyle","opacity","disabled","primary","sizeSmall","fontSize","sizeMedium","sizeLarge","variants","props","style","text","tertiary","brand","onSurface","os900","brandHover","main","contrastText","light","error","dark","surface","border","updateFocusRingStyle","borderWidth","mode","quarternary","os100","borderColor","os0"],"mappings":"qKAKO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,eAAe,EACfC,QAAS,WACTC,MAAO,YACPC,KAAM,UAERC,eAAgB,
|
|
1
|
+
{"version":3,"file":"iconButton.theme.js","sources":["../../../src/materialui/iconButton/iconButton.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowIconButton: Components<Theme>['MuiIconButton'] = {\n defaultProps: {\n disableRipple: true,\n variant: 'standard',\n color: 'secondary',\n size: 'medium',\n },\n styleOverrides: {\n // this style is mirrored in advancedTable/agGrid.tsx for the AG Grid pagination arrows,\n // which are plain divs - keep the two in sync\n root: ({ theme }) => ({\n position: 'relative',\n boxShadow: 'none',\n outline: 'none',\n width: '44px',\n height: '44px',\n borderRadius: '1000px',\n maxWidth: 'none',\n transition: 'all 0.3s ease-out',\n flexShrink: '0',\n '&:hover': {\n boxShadow: 'none',\n },\n '&&:active': {\n boxShadow: 'none',\n },\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n },\n {\n // hover effect also in accordionSummary.theme.tsx\n backgroundColor: theme.palette.transparent.secondary,\n },\n ),\n // focused style\n ...getFocusRingStyle(theme),\n // disabled style\n '&.Mui-disabled': {\n opacity: '1',\n color: theme.palette.disabled.primary,\n },\n }),\n sizeSmall: {\n height: '32px',\n width: '32px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n },\n },\n sizeMedium: {\n // width & height & borderRadius is default in root\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '20px',\n },\n },\n sizeLarge: {\n height: '50px',\n width: '50px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '22px',\n },\n },\n },\n variants: [\n {\n props: { color: 'secondary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.text.primary,\n },\n {\n color: theme.palette.text.primary,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled' },\n style: ({ theme }) => ({\n // disabled style\n '&.Mui-disabled': {\n opacity: '1',\n backgroundColor: theme.palette.disabled.secondary,\n color: theme.palette.disabled.tertiary,\n },\n }),\n },\n {\n props: { variant: 'filled', color: 'primary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.brand.secondary,\n color: theme.palette.onSurface.os900,\n },\n {\n backgroundColor: theme.palette.brandHover.secondary,\n color: theme.palette.onSurface.os900,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled', color: 'secondary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.secondary.main,\n color: theme.palette.secondary.contrastText,\n },\n {\n backgroundColor: theme.palette.secondary.light,\n color: theme.palette.secondary.contrastText,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled', color: 'error' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.error.contrastText,\n backgroundColor: theme.palette.error.main,\n },\n {\n color: theme.palette.error.contrastText,\n backgroundColor: theme.palette.error.dark,\n },\n ),\n }),\n },\n {\n props: { variant: 'filled', color: 'inherit' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.transparent.secondary,\n },\n {\n backgroundColor: theme.palette.surface.primary,\n },\n ),\n }),\n },\n {\n props: { variant: 'outlined' },\n style: {\n border: '2px solid currentColor',\n ...updateFocusRingStyle(2),\n },\n },\n {\n props: { variant: 'outlined', size: 'small' },\n style: {\n borderWidth: '1px',\n ...updateFocusRingStyle(1),\n },\n },\n {\n props: { color: 'surface' },\n style: ({ theme }) => ({\n border: `1px solid ${theme.palette.mode === 'dark' ? theme.palette.transparent.quarternary : theme.palette.onSurface.os100}`,\n ...updateFocusRingStyle(1),\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.surface.primary,\n color: theme.palette.text.primary,\n },\n {\n backgroundColor: theme.palette.surface.secondary,\n color: theme.palette.text.primary,\n },\n ),\n // disabled style\n '&.Mui-disabled': {\n backgroundColor: theme.palette.surface.secondary,\n borderColor: theme.palette.surface.secondary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n {\n props: { color: 'surface', variant: 'outlined' },\n style: {\n borderWidth: '2px',\n ...updateFocusRingStyle(2),\n },\n },\n {\n props: { color: 'white' },\n style: ({ theme }) => ({\n // hover effect also in accordionSummary.theme.tsx\n // hover effect also in FooterAccordion.tsx\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os0,\n },\n {\n color: theme.palette.onSurface.os0,\n backgroundColor: theme.palette.transparent.tertiary,\n },\n ),\n // disabled style\n '&.Mui-disabled': {\n borderColor: theme.palette.disabled.primary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n ],\n};\n"],"names":["flowIconButton","defaultProps","disableRipple","variant","color","size","styleOverrides","root","theme","position","boxShadow","outline","width","height","borderRadius","maxWidth","transition","flexShrink","getInteractiveStyle","backgroundColor","palette","transparent","secondary","getFocusRingStyle","opacity","disabled","primary","sizeSmall","fontSize","sizeMedium","sizeLarge","variants","props","style","text","tertiary","brand","onSurface","os900","brandHover","main","contrastText","light","error","dark","surface","border","updateFocusRingStyle","borderWidth","mode","quarternary","os100","borderColor","os0"],"mappings":"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"}
|
|
@@ -400,7 +400,7 @@ declare module '@mui/material/Card' {
|
|
|
400
400
|
*/
|
|
401
401
|
iconSlots?: {
|
|
402
402
|
icon?: ComponentType<SvgIconProps>;
|
|
403
|
-
|
|
403
|
+
selectedIcon?: ComponentType<SvgIconProps>;
|
|
404
404
|
hoverIcon?: ComponentType<SvgIconProps>;
|
|
405
405
|
hoverSelectedIcon?: ComponentType<SvgIconProps>;
|
|
406
406
|
};
|
|
@@ -485,6 +485,16 @@ declare module '@mui/material/LinearProgress' {
|
|
|
485
485
|
size?: 'small' | 'medium';
|
|
486
486
|
}
|
|
487
487
|
}
|
|
488
|
+
declare module '@mui/material/Pagination' {
|
|
489
|
+
interface PaginationPropsVariantOverrides {
|
|
490
|
+
dots: true;
|
|
491
|
+
}
|
|
492
|
+
}
|
|
493
|
+
declare module '@mui/material/PaginationItem' {
|
|
494
|
+
interface PaginationItemPropsVariantOverrides {
|
|
495
|
+
dots: true;
|
|
496
|
+
}
|
|
497
|
+
}
|
|
488
498
|
declare module '@mui/x-date-pickers' {
|
|
489
499
|
/**
|
|
490
500
|
* Extend pickers shortcut with chip properties that are applied in code already
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createBreakpoints as t}from"@mui/system";import e from"@skodaflow/web-tokens/src/tokens.json";const
|
|
1
|
+
import{createBreakpoints as t}from"@mui/system";import e from"@skodaflow/web-tokens/src/tokens.json";const i=t=>["SKODA Next"+(t?" R2L":""),"Helvetica","Arial","system-ui","sans-serif"].join(","),n=(t,n,o)=>{const a=e["flow-typography"].find(e=>e.name===`${o??"small"}-${t}`);return a?{...a.style,fontFamily:i(n),...["h1","h2","h3","h4","display","subheadline"].includes(t)&&{textWrap:"balance"}}:null},o=(e,i,o)=>{const a=t(i);return{...n(e,o,"small"),[a.up("md")]:{...n(e,o,"medium")},[a.up("xl")]:{...n(e,o,"large")}}},a=(t,e)=>{const n=o("body",t,e);return{fontFamily:i(e),body:n,...Object.fromEntries(["h1","h2","h3","h4","subheadline","subtitle1","subtitle2","display","list","disclaimer","disclaimer1","disclaimer2","caption1","caption2"].map(i=>[i,o(i,t,e)])),body1:n,body2:n,h5:o("subheadline",t,e),h6:o("caption1",t,e),caption:o("caption2",t,e),overline:o("caption1",t,e),button:{fontFamily:i(e),letterSpacing:"0.75px",textTransform:"none",textDecoration:"none",fontSize:"16px",fontWeight:"700",lineHeight:"16px"}}};export{o as generateTypography,i as getFontFamily,n as getTypography,a as getTypographyOptions};
|
|
2
2
|
//# sourceMappingURL=typography.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"typography.theme.js","sources":["../../../src/materialui/typography/typography.theme.ts"],"sourcesContent":["import { CSSProperties } from 'react';\nimport { BreakpointsOptions, createBreakpoints } from '@mui/system';\nimport tokens from '@skodaflow/web-tokens/src/tokens.json';\n\nexport type TypographySize = 'small' | 'medium' | 'large';\n\n/**\n * Obtain fontFamily for SKODA Next font with fallbacks\n */\nexport const getFontFamily = (rtl: boolean) => {\n return [`SKODA Next${rtl ? ' R2L' : ''}`, 'Helvetica', 'Arial', 'system-ui', 'sans-serif'].join(',');\n};\n\n/**\n * Obtain style for element for the certain size\n */\nexport const getTypography = (element: string, rtl: boolean, size?: TypographySize) => {\n const typo = tokens['flow-typography'].find((el) => el.name === `${size ?? 'small'}-${element}`);\n if (typo)\n return {\n ...typo['style'],\n fontFamily: getFontFamily(rtl),\n } as CSSProperties;\n else return null;\n};\n\n/**\n * Generate responsive typography style with the media queries\n */\nexport const generateTypography = (element: string, breakpointsOptions: BreakpointsOptions, rtl: boolean) => {\n const breakpoints = createBreakpoints(breakpointsOptions);\n\n return {\n ...getTypography(element, rtl, 'small'),\n [breakpoints.up('md')]: {\n ...getTypography(element, rtl, 'medium'),\n },\n [breakpoints.up('xl')]: {\n ...getTypography(element, rtl, 'large'),\n },\n };\n};\n\n/**\n * Build the typography theme options\n */\nexport const getTypographyOptions = (breakpointsOptions: BreakpointsOptions, rtl: boolean) => {\n const bodyTypo = generateTypography('body', breakpointsOptions, rtl);\n\n return {\n fontFamily: getFontFamily(rtl),\n body: bodyTypo,\n ...Object.fromEntries(\n [\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'subheadline',\n 'subtitle1',\n 'subtitle2',\n 'display',\n 'list',\n 'disclaimer',\n 'disclaimer1',\n 'disclaimer2',\n 'caption1',\n 'caption2',\n ].map((element) => [element, generateTypography(element, breakpointsOptions, rtl)]),\n ),\n // original @mui properties\n body1: bodyTypo,\n body2: bodyTypo,\n h5: generateTypography('subheadline', breakpointsOptions, rtl),\n h6: generateTypography('caption1', breakpointsOptions, rtl),\n caption: generateTypography('caption2', breakpointsOptions, rtl),\n overline: generateTypography('caption1', breakpointsOptions, rtl),\n // button, later this definition should come from @skodaflow/web-tokens\n button: {\n fontFamily: getFontFamily(rtl),\n letterSpacing: '0.75px',\n textTransform: 'none',\n textDecoration: 'none',\n fontSize: '16px',\n fontWeight: '700',\n lineHeight: '16px',\n },\n };\n};\n"],"names":["getFontFamily","rtl","join","getTypography","element","size","typo","tokens","find","el","name","fontFamily","generateTypography","breakpointsOptions","breakpoints","createBreakpoints","up","getTypographyOptions","bodyTypo","body","Object","fromEntries","map","body1","body2","h5","h6","caption","overline","button","letterSpacing","textTransform","textDecoration","fontSize","fontWeight","lineHeight"],"mappings":"qGASO,MAAMA,EAAiBC,GACrB,CAAC,cAAaA,EAAM,OAAS,IAAM,YAAa,QAAS,YAAa,cAAcC,KAAK,KAMrFC,EAAgB,CAACC,EAAiBH,EAAcI,KAC3D,MAAMC,EAAOC,EAAO,mBAAmBC,KAAMC,GAAOA,EAAGC,OAAS,GAAGL,GAAQ,WAAWD,
|
|
1
|
+
{"version":3,"file":"typography.theme.js","sources":["../../../src/materialui/typography/typography.theme.ts"],"sourcesContent":["import { CSSProperties } from 'react';\nimport { BreakpointsOptions, createBreakpoints } from '@mui/system';\nimport tokens from '@skodaflow/web-tokens/src/tokens.json';\n\nexport type TypographySize = 'small' | 'medium' | 'large';\n\n/**\n * Obtain fontFamily for SKODA Next font with fallbacks\n */\nexport const getFontFamily = (rtl: boolean) => {\n return [`SKODA Next${rtl ? ' R2L' : ''}`, 'Helvetica', 'Arial', 'system-ui', 'sans-serif'].join(',');\n};\n\n/**\n * Obtain style for element for the certain size\n */\nexport const getTypography = (element: string, rtl: boolean, size?: TypographySize) => {\n const typo = tokens['flow-typography'].find((el) => el.name === `${size ?? 'small'}-${element}`);\n const headlines = ['h1', 'h2', 'h3', 'h4', 'display', 'subheadline'];\n if (typo)\n return {\n ...typo['style'],\n fontFamily: getFontFamily(rtl),\n ...(headlines.includes(element) && { textWrap: 'balance' }),\n } as CSSProperties;\n else return null;\n};\n\n/**\n * Generate responsive typography style with the media queries\n */\nexport const generateTypography = (element: string, breakpointsOptions: BreakpointsOptions, rtl: boolean) => {\n const breakpoints = createBreakpoints(breakpointsOptions);\n\n return {\n ...getTypography(element, rtl, 'small'),\n [breakpoints.up('md')]: {\n ...getTypography(element, rtl, 'medium'),\n },\n [breakpoints.up('xl')]: {\n ...getTypography(element, rtl, 'large'),\n },\n };\n};\n\n/**\n * Build the typography theme options\n */\nexport const getTypographyOptions = (breakpointsOptions: BreakpointsOptions, rtl: boolean) => {\n const bodyTypo = generateTypography('body', breakpointsOptions, rtl);\n\n return {\n fontFamily: getFontFamily(rtl),\n body: bodyTypo,\n ...Object.fromEntries(\n [\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'subheadline',\n 'subtitle1',\n 'subtitle2',\n 'display',\n 'list',\n 'disclaimer',\n 'disclaimer1',\n 'disclaimer2',\n 'caption1',\n 'caption2',\n ].map((element) => [element, generateTypography(element, breakpointsOptions, rtl)]),\n ),\n // original @mui properties\n body1: bodyTypo,\n body2: bodyTypo,\n h5: generateTypography('subheadline', breakpointsOptions, rtl),\n h6: generateTypography('caption1', breakpointsOptions, rtl),\n caption: generateTypography('caption2', breakpointsOptions, rtl),\n overline: generateTypography('caption1', breakpointsOptions, rtl),\n // button, later this definition should come from @skodaflow/web-tokens\n button: {\n fontFamily: getFontFamily(rtl),\n letterSpacing: '0.75px',\n textTransform: 'none',\n textDecoration: 'none',\n fontSize: '16px',\n fontWeight: '700',\n lineHeight: '16px',\n },\n };\n};\n"],"names":["getFontFamily","rtl","join","getTypography","element","size","typo","tokens","find","el","name","fontFamily","includes","textWrap","generateTypography","breakpointsOptions","breakpoints","createBreakpoints","up","getTypographyOptions","bodyTypo","body","Object","fromEntries","map","body1","body2","h5","h6","caption","overline","button","letterSpacing","textTransform","textDecoration","fontSize","fontWeight","lineHeight"],"mappings":"qGASO,MAAMA,EAAiBC,GACrB,CAAC,cAAaA,EAAM,OAAS,IAAM,YAAa,QAAS,YAAa,cAAcC,KAAK,KAMrFC,EAAgB,CAACC,EAAiBH,EAAcI,KAC3D,MAAMC,EAAOC,EAAO,mBAAmBC,KAAMC,GAAOA,EAAGC,OAAS,GAAGL,GAAQ,WAAWD,KAEtF,OAAIE,EACK,IACFA,EAAY,MACfK,WAAYX,EAAcC,MAJZ,CAAC,KAAM,KAAM,KAAM,KAAM,UAAW,eAKpCW,SAASR,IAAY,CAAES,SAAU,YAEvC,MAMDC,EAAqB,CAACV,EAAiBW,EAAwCd,KAC1F,MAAMe,EAAcC,EAAkBF,GAEtC,MAAO,IACFZ,EAAcC,EAASH,EAAK,SAC/B,CAACe,EAAYE,GAAG,OAAQ,IACnBf,EAAcC,EAASH,EAAK,WAEjC,CAACe,EAAYE,GAAG,OAAQ,IACnBf,EAAcC,EAASH,EAAK,YAQxBkB,EAAuB,CAACJ,EAAwCd,KAC3E,MAAMmB,EAAWN,EAAmB,OAAQC,EAAoBd,GAEhE,MAAO,CACLU,WAAYX,EAAcC,GAC1BoB,KAAMD,KACHE,OAAOC,YACR,CACE,KACA,KACA,KACA,KACA,cACA,YACA,YACA,UACA,OACA,aACA,cACA,cACA,WACA,YACAC,IAAKpB,GAAY,CAACA,EAASU,EAAmBV,EAASW,EAAoBd,MAG/EwB,MAAOL,EACPM,MAAON,EACPO,GAAIb,EAAmB,cAAeC,EAAoBd,GAC1D2B,GAAId,EAAmB,WAAYC,EAAoBd,GACvD4B,QAASf,EAAmB,WAAYC,EAAoBd,GAC5D6B,SAAUhB,EAAmB,WAAYC,EAAoBd,GAE7D8B,OAAQ,CACNpB,WAAYX,EAAcC,GAC1B+B,cAAe,SACfC,cAAe,OACfC,eAAgB,OAChBC,SAAU,OACVC,WAAY,MACZC,WAAY"}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@skodaflow/web-library","version":"8.
|
|
1
|
+
{"name":"@skodaflow/web-library","version":"8.4.0","description":"Implementation of Skoda Flow Design System with Material UI as core library.","author":"Skoda Auto","license":"SKODA AUTO Library EULA 1.1","peerDependencies":{"@emotion/cache":"^11.14.0","@emotion/react":"^11.14.0","@emotion/styled":"^11.14.1","@mui/material":"^7.3.10 || ^9.0.0","@mui/system":"^7.3.10 || ^9.0.0","@mui/x-date-pickers":"^9.0.0","country-flag-icons":"^1.6.15","react":"^18.3.1 || ^19.2.4","react-dom":"^18.3.1 || ^19.2.4","swiper":"^12.1.3"},"dependencies":{"@skodaflow/web-tokens":"3.2.0","stylis":"4.4.0","stylis-plugin-rtl":"2.1.1","tslib":"2.8.1"},"sideEffects":false,"main":"./cjs/index.js","browser":"./index.js","module":"./index.js","types":"./index.d.ts"}
|