@flipdish/portal-library 3.7.1 → 3.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/themes/flipdishPublicTheme.cjs.js +1 -1
- package/dist/themes/flipdishPublicTheme.cjs.js.map +1 -1
- package/dist/themes/flipdishPublicTheme.js +1 -1
- package/dist/themes/flipdishPublicTheme.js.map +1 -1
- package/dist/themes/theme.d.ts +12 -0
- package/dist/themes/tokens/shadows/shadows.cjs.js +2 -0
- package/dist/themes/tokens/shadows/shadows.cjs.js.map +1 -0
- package/dist/themes/tokens/shadows/shadows.d.ts +8 -0
- package/dist/themes/tokens/shadows/shadows.js +2 -0
- package/dist/themes/tokens/shadows/shadows.js.map +1 -0
- package/package.json +3 -3
- package/dist/themes/tokens/colours/index.cjs.js +0 -2
- package/dist/themes/tokens/colours/index.cjs.js.map +0 -1
- package/dist/themes/tokens/colours/index.d.ts +0 -3
- package/dist/themes/tokens/colours/index.js +0 -2
- package/dist/themes/tokens/colours/index.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("@mui/material/styles/createTheme"),r=require("../icons/Cancel/index.cjs.js"),
|
|
1
|
+
"use strict";var e=require("@mui/material/styles/createTheme"),r=require("../icons/Cancel/index.cjs.js"),o=require("./tokens/breakpoints/breakpoints.cjs.js"),t=require("./tokens/colours/semantic.cjs.js"),s=require("./tokens/radius/radius.cjs.js"),i=require("./tokens/shadows/shadows.cjs.js"),a=require("./tokens/typography/variant-mapping.cjs.js"),p=require("./typography.cjs.js");const n=n=>{const d=e({typography:p.typography,palette:"light"===n?t.lightColours:t.darkColours,radius:s.radius,breakpoints:{values:o.breakpointValues}});return Object.keys(p.typography).forEach((e=>{const r=e.split(/(?=[A-Z])/)[0];d.typography[e]={...d.typography[e],[d.breakpoints.down("tablet")]:{...p.getMobileTextStyle(r)}}})),e(d,{shape:{borderRadius:"4px"},customShadows:{...i.shadows},components:{MuiAlert:{defaultProps:{components:{CloseIcon:r}},styleOverrides:{root:{borderRadius:"8px",padding:"24px"},icon:{marginRight:"12px",padding:0},action:{padding:0,"& button":{marginTop:"-5px"}},message:{padding:0}}},MuiButton:{styleOverrides:{root:{padding:"12px 24px",textTransform:"none"}}},MuiCard:{styleOverrides:{root:{boxShadow:"none",borderWidth:"1px",borderStyle:"solid",borderColor:d.palette.divider}}},MuiChip:{styleOverrides:{root:{fontWeight:"bold",paddingLeft:"6px",paddingRight:"6px"}}},MuiListItemButton:{styleOverrides:{root:{"&:hover":{backgroundColor:d.palette.semantic.fill["fill-primary-weak"]},"&:not(:last-child)":{borderBottom:`1px solid ${d.palette.semantic.stroke["stroke-weak"]}`}}}},MuiTableRow:{styleOverrides:{root:{"&.MuiTableRow-hover:hover":{backgroundColor:d.palette.semantic.fill["fill-secondary"],cursor:"pointer"}}}},MuiTypography:{defaultProps:{variantMapping:a.typographyVariantMapping}}}})},d=n("light"),l=n("dark");exports.darkTheme=l,exports.lightTheme=d;
|
|
2
2
|
//# sourceMappingURL=flipdishPublicTheme.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flipdishPublicTheme.cjs.js","sources":["../../src/themes/flipdishPublicTheme.ts"],"sourcesContent":["import createTheme, { type Theme, type ThemeOptions } from '@mui/material/styles/createTheme';\n\nimport CancelIcon from '../icons/Cancel';\nimport { breakpointValues } from './tokens/breakpoints/breakpoints';\nimport { darkColours, lightColours } from './tokens/colours';\nimport { radius } from './tokens/radius/radius';\nimport type { fontSize } from './tokens/typography/font-size';\nimport { typographyVariantMapping } from './tokens/typography/variant-mapping';\nimport { getMobileTextStyle, typography } from './typography';\n\nconst createFlipdishThemeFactory = (mode: 'dark' | 'light'): Theme => {\n const baseTheme = createTheme({\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n });\n\n /* \n Add mobile text styles to typography\n Has to be done using media queries, otherwise it isn't responsive :(\n https://mui.com/material-ui/customization/typography/#responsive-font-sizes \n */\n Object.keys(typography).forEach((key) => {\n // only key before the suffix split by capital letter (h1Strong -> h1)\n const keyWithoutVariantSuffix = key.split(/(?=[A-Z])/)[0];\n baseTheme.typography[key] = {\n ...baseTheme.typography[key],\n [baseTheme.breakpoints.down('tablet')]: {\n ...getMobileTextStyle(keyWithoutVariantSuffix as keyof (typeof fontSize)['mobile']),\n },\n };\n });\n\n // Create final theme with component overrides and additional configurations\n return createTheme(baseTheme as ThemeOptions, {\n shape: {\n borderRadius: '4px',\n },\n components: {\n MuiAlert: {\n defaultProps: {\n components: {\n CloseIcon: CancelIcon,\n },\n },\n styleOverrides: {\n root: {\n // TODO: Replace with borderRadius from tokens when implemented\n borderRadius: '8px',\n // TODO: Replace with spacing from tokens when implemented\n padding: '24px',\n },\n icon: {\n // TODO: Replace with spacing from tokens when implemented\n marginRight: '12px',\n padding: 0,\n },\n action: {\n padding: 0,\n '& button': {\n marginTop: '-5px',\n },\n },\n message: {\n padding: 0,\n },\n },\n },\n MuiButton: {\n styleOverrides: {\n root: {\n padding: '12px 24px',\n textTransform: 'none',\n },\n },\n },\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\n },\n },\n },\n MuiChip: {\n styleOverrides: {\n root: {\n fontWeight: 'bold',\n paddingLeft: '6px',\n paddingRight: '6px',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n '&:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-primary-weak'],\n },\n '&:not(:last-child)': {\n borderBottom: `1px solid ${baseTheme.palette.semantic.stroke['stroke-weak']}`,\n },\n },\n },\n },\n MuiTableRow: {\n styleOverrides: {\n root: {\n '&.MuiTableRow-hover:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-secondary'],\n cursor: 'pointer',\n },\n },\n },\n },\n MuiTypography: {\n defaultProps: {\n variantMapping: typographyVariantMapping,\n },\n },\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","baseTheme","createTheme","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","Object","keys","forEach","key","keyWithoutVariantSuffix","split","down","getMobileTextStyle","shape","borderRadius","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","textTransform","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiChip","fontWeight","paddingLeft","paddingRight","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","lightTheme","darkTheme"],"mappings":"
|
|
1
|
+
{"version":3,"file":"flipdishPublicTheme.cjs.js","sources":["../../src/themes/flipdishPublicTheme.ts"],"sourcesContent":["import createTheme, { type Theme, type ThemeOptions } from '@mui/material/styles/createTheme';\n\nimport CancelIcon from '../icons/Cancel';\nimport { breakpointValues } from './tokens/breakpoints/breakpoints';\nimport { darkColours, lightColours } from './tokens/colours/semantic';\nimport { radius } from './tokens/radius/radius';\nimport { shadows } from './tokens/shadows/shadows';\nimport type { fontSize } from './tokens/typography/font-size';\nimport { typographyVariantMapping } from './tokens/typography/variant-mapping';\nimport { getMobileTextStyle, typography } from './typography';\n\nconst createFlipdishThemeFactory = (mode: 'dark' | 'light'): Theme => {\n const baseTheme = createTheme({\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n });\n\n /* \n Add mobile text styles to typography\n Has to be done using media queries, otherwise it isn't responsive :(\n https://mui.com/material-ui/customization/typography/#responsive-font-sizes \n */\n Object.keys(typography).forEach((key) => {\n // only key before the suffix split by capital letter (h1Strong -> h1)\n const keyWithoutVariantSuffix = key.split(/(?=[A-Z])/)[0];\n baseTheme.typography[key] = {\n ...baseTheme.typography[key],\n [baseTheme.breakpoints.down('tablet')]: {\n ...getMobileTextStyle(keyWithoutVariantSuffix as keyof (typeof fontSize)['mobile']),\n },\n };\n });\n\n // Create final theme with component overrides and additional configurations\n return createTheme(baseTheme as ThemeOptions, {\n shape: {\n borderRadius: '4px',\n },\n customShadows: {\n ...shadows,\n },\n components: {\n MuiAlert: {\n defaultProps: {\n components: {\n CloseIcon: CancelIcon,\n },\n },\n styleOverrides: {\n root: {\n // TODO: Replace with borderRadius from tokens when implemented\n borderRadius: '8px',\n // TODO: Replace with spacing from tokens when implemented\n padding: '24px',\n },\n icon: {\n // TODO: Replace with spacing from tokens when implemented\n marginRight: '12px',\n padding: 0,\n },\n action: {\n padding: 0,\n '& button': {\n marginTop: '-5px',\n },\n },\n message: {\n padding: 0,\n },\n },\n },\n MuiButton: {\n styleOverrides: {\n root: {\n padding: '12px 24px',\n textTransform: 'none',\n },\n },\n },\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\n },\n },\n },\n MuiChip: {\n styleOverrides: {\n root: {\n fontWeight: 'bold',\n paddingLeft: '6px',\n paddingRight: '6px',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n '&:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-primary-weak'],\n },\n '&:not(:last-child)': {\n borderBottom: `1px solid ${baseTheme.palette.semantic.stroke['stroke-weak']}`,\n },\n },\n },\n },\n MuiTableRow: {\n styleOverrides: {\n root: {\n '&.MuiTableRow-hover:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-secondary'],\n cursor: 'pointer',\n },\n },\n },\n },\n MuiTypography: {\n defaultProps: {\n variantMapping: typographyVariantMapping,\n },\n },\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","baseTheme","createTheme","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","Object","keys","forEach","key","keyWithoutVariantSuffix","split","down","getMobileTextStyle","shape","borderRadius","customShadows","shadows","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","textTransform","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiChip","fontWeight","paddingLeft","paddingRight","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","lightTheme","darkTheme"],"mappings":"6XAWA,MAAMA,EAA8BC,IAClC,MAAMC,EAAYC,EAAY,YAC5BC,EAAUA,WACVC,QAAkB,UAATJ,EAAmBK,EAAAA,aAAeC,EAAWA,mBACtDC,EAAMA,OACNC,YAAa,CACXC,OAAQC,EAAgBA,oBAqB5B,OAZAC,OAAOC,KAAKT,EAAAA,YAAYU,SAASC,IAE/B,MAAMC,EAA0BD,EAAIE,MAAM,aAAa,GACvDf,EAAUE,WAAWW,GAAO,IACvBb,EAAUE,WAAWW,GACxB,CAACb,EAAUO,YAAYS,KAAK,WAAY,IACnCC,EAAAA,mBAAmBH,IAEzB,IAIIb,EAAYD,EAA2B,CAC5CkB,MAAO,CACLC,aAAc,OAEhBC,cAAe,IACVC,EAAOA,SAEZC,WAAY,CACVC,SAAU,CACRC,aAAc,CACZF,WAAY,CACVG,UAAWC,IAGfC,eAAgB,CACdC,KAAM,CAEJT,aAAc,MAEdU,QAAS,QAEXC,KAAM,CAEJC,YAAa,OACbF,QAAS,GAEXG,OAAQ,CACNH,QAAS,EACT,WAAY,CACVI,UAAW,SAGfC,QAAS,CACPL,QAAS,KAIfM,UAAW,CACTR,eAAgB,CACdC,KAAM,CACJC,QAAS,YACTO,cAAe,UAIrBC,QAAS,CACPV,eAAgB,CACdC,KAAM,CACJU,UAAW,OACXC,YAAa,MACbC,YAAa,QACbC,YAAazC,EAAUG,QAAQuC,WAIrCC,QAAS,CACPhB,eAAgB,CACdC,KAAM,CACJgB,WAAY,OACZC,YAAa,MACbC,aAAc,SAIpBC,kBAAmB,CACjBpB,eAAgB,CACdC,KAAM,CACJ,UAAW,CACToB,gBAAiBhD,EAAUG,QAAQ8C,SAASC,KAAK,sBAEnD,qBAAsB,CACpBC,aAAc,aAAanD,EAAUG,QAAQ8C,SAASG,OAAO,qBAKrEC,YAAa,CACX1B,eAAgB,CACdC,KAAM,CACJ,4BAA6B,CAC3BoB,gBAAiBhD,EAAUG,QAAQ8C,SAASC,KAAK,kBACjDI,OAAQ,cAKhBC,cAAe,CACb/B,aAAc,CACZgC,eAAgBC,EAAwBA,6BAI9C,EAGSC,EAAa5D,EAA2B,SACxC6D,EAAY7D,EAA2B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import o from"@mui/material/styles/createTheme";import
|
|
1
|
+
import o from"@mui/material/styles/createTheme";import t from"../icons/Cancel/index.js";import{breakpointValues as r}from"./tokens/breakpoints/breakpoints.js";import{lightColours as e,darkColours as i}from"./tokens/colours/semantic.js";import{radius as s}from"./tokens/radius/radius.js";import{shadows as a}from"./tokens/shadows/shadows.js";import{typographyVariantMapping as p}from"./tokens/typography/variant-mapping.js";import{typography as n,getMobileTextStyle as d}from"./typography.js";const l=l=>{const m=o({typography:n,palette:"light"===l?e:i,radius:s,breakpoints:{values:r}});return Object.keys(n).forEach((o=>{const t=o.split(/(?=[A-Z])/)[0];m.typography[o]={...m.typography[o],[m.breakpoints.down("tablet")]:{...d(t)}}})),o(m,{shape:{borderRadius:"4px"},customShadows:{...a},components:{MuiAlert:{defaultProps:{components:{CloseIcon:t}},styleOverrides:{root:{borderRadius:"8px",padding:"24px"},icon:{marginRight:"12px",padding:0},action:{padding:0,"& button":{marginTop:"-5px"}},message:{padding:0}}},MuiButton:{styleOverrides:{root:{padding:"12px 24px",textTransform:"none"}}},MuiCard:{styleOverrides:{root:{boxShadow:"none",borderWidth:"1px",borderStyle:"solid",borderColor:m.palette.divider}}},MuiChip:{styleOverrides:{root:{fontWeight:"bold",paddingLeft:"6px",paddingRight:"6px"}}},MuiListItemButton:{styleOverrides:{root:{"&:hover":{backgroundColor:m.palette.semantic.fill["fill-primary-weak"]},"&:not(:last-child)":{borderBottom:`1px solid ${m.palette.semantic.stroke["stroke-weak"]}`}}}},MuiTableRow:{styleOverrides:{root:{"&.MuiTableRow-hover:hover":{backgroundColor:m.palette.semantic.fill["fill-secondary"],cursor:"pointer"}}}},MuiTypography:{defaultProps:{variantMapping:p}}}})},m=l("light"),u=l("dark");export{u as darkTheme,m as lightTheme};
|
|
2
2
|
//# sourceMappingURL=flipdishPublicTheme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flipdishPublicTheme.js","sources":["../../src/themes/flipdishPublicTheme.ts"],"sourcesContent":["import createTheme, { type Theme, type ThemeOptions } from '@mui/material/styles/createTheme';\n\nimport CancelIcon from '../icons/Cancel';\nimport { breakpointValues } from './tokens/breakpoints/breakpoints';\nimport { darkColours, lightColours } from './tokens/colours';\nimport { radius } from './tokens/radius/radius';\nimport type { fontSize } from './tokens/typography/font-size';\nimport { typographyVariantMapping } from './tokens/typography/variant-mapping';\nimport { getMobileTextStyle, typography } from './typography';\n\nconst createFlipdishThemeFactory = (mode: 'dark' | 'light'): Theme => {\n const baseTheme = createTheme({\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n });\n\n /* \n Add mobile text styles to typography\n Has to be done using media queries, otherwise it isn't responsive :(\n https://mui.com/material-ui/customization/typography/#responsive-font-sizes \n */\n Object.keys(typography).forEach((key) => {\n // only key before the suffix split by capital letter (h1Strong -> h1)\n const keyWithoutVariantSuffix = key.split(/(?=[A-Z])/)[0];\n baseTheme.typography[key] = {\n ...baseTheme.typography[key],\n [baseTheme.breakpoints.down('tablet')]: {\n ...getMobileTextStyle(keyWithoutVariantSuffix as keyof (typeof fontSize)['mobile']),\n },\n };\n });\n\n // Create final theme with component overrides and additional configurations\n return createTheme(baseTheme as ThemeOptions, {\n shape: {\n borderRadius: '4px',\n },\n components: {\n MuiAlert: {\n defaultProps: {\n components: {\n CloseIcon: CancelIcon,\n },\n },\n styleOverrides: {\n root: {\n // TODO: Replace with borderRadius from tokens when implemented\n borderRadius: '8px',\n // TODO: Replace with spacing from tokens when implemented\n padding: '24px',\n },\n icon: {\n // TODO: Replace with spacing from tokens when implemented\n marginRight: '12px',\n padding: 0,\n },\n action: {\n padding: 0,\n '& button': {\n marginTop: '-5px',\n },\n },\n message: {\n padding: 0,\n },\n },\n },\n MuiButton: {\n styleOverrides: {\n root: {\n padding: '12px 24px',\n textTransform: 'none',\n },\n },\n },\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\n },\n },\n },\n MuiChip: {\n styleOverrides: {\n root: {\n fontWeight: 'bold',\n paddingLeft: '6px',\n paddingRight: '6px',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n '&:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-primary-weak'],\n },\n '&:not(:last-child)': {\n borderBottom: `1px solid ${baseTheme.palette.semantic.stroke['stroke-weak']}`,\n },\n },\n },\n },\n MuiTableRow: {\n styleOverrides: {\n root: {\n '&.MuiTableRow-hover:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-secondary'],\n cursor: 'pointer',\n },\n },\n },\n },\n MuiTypography: {\n defaultProps: {\n variantMapping: typographyVariantMapping,\n },\n },\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","baseTheme","createTheme","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","Object","keys","forEach","key","keyWithoutVariantSuffix","split","down","getMobileTextStyle","shape","borderRadius","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","textTransform","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiChip","fontWeight","paddingLeft","paddingRight","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","lightTheme","darkTheme"],"mappings":"
|
|
1
|
+
{"version":3,"file":"flipdishPublicTheme.js","sources":["../../src/themes/flipdishPublicTheme.ts"],"sourcesContent":["import createTheme, { type Theme, type ThemeOptions } from '@mui/material/styles/createTheme';\n\nimport CancelIcon from '../icons/Cancel';\nimport { breakpointValues } from './tokens/breakpoints/breakpoints';\nimport { darkColours, lightColours } from './tokens/colours/semantic';\nimport { radius } from './tokens/radius/radius';\nimport { shadows } from './tokens/shadows/shadows';\nimport type { fontSize } from './tokens/typography/font-size';\nimport { typographyVariantMapping } from './tokens/typography/variant-mapping';\nimport { getMobileTextStyle, typography } from './typography';\n\nconst createFlipdishThemeFactory = (mode: 'dark' | 'light'): Theme => {\n const baseTheme = createTheme({\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n });\n\n /* \n Add mobile text styles to typography\n Has to be done using media queries, otherwise it isn't responsive :(\n https://mui.com/material-ui/customization/typography/#responsive-font-sizes \n */\n Object.keys(typography).forEach((key) => {\n // only key before the suffix split by capital letter (h1Strong -> h1)\n const keyWithoutVariantSuffix = key.split(/(?=[A-Z])/)[0];\n baseTheme.typography[key] = {\n ...baseTheme.typography[key],\n [baseTheme.breakpoints.down('tablet')]: {\n ...getMobileTextStyle(keyWithoutVariantSuffix as keyof (typeof fontSize)['mobile']),\n },\n };\n });\n\n // Create final theme with component overrides and additional configurations\n return createTheme(baseTheme as ThemeOptions, {\n shape: {\n borderRadius: '4px',\n },\n customShadows: {\n ...shadows,\n },\n components: {\n MuiAlert: {\n defaultProps: {\n components: {\n CloseIcon: CancelIcon,\n },\n },\n styleOverrides: {\n root: {\n // TODO: Replace with borderRadius from tokens when implemented\n borderRadius: '8px',\n // TODO: Replace with spacing from tokens when implemented\n padding: '24px',\n },\n icon: {\n // TODO: Replace with spacing from tokens when implemented\n marginRight: '12px',\n padding: 0,\n },\n action: {\n padding: 0,\n '& button': {\n marginTop: '-5px',\n },\n },\n message: {\n padding: 0,\n },\n },\n },\n MuiButton: {\n styleOverrides: {\n root: {\n padding: '12px 24px',\n textTransform: 'none',\n },\n },\n },\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\n },\n },\n },\n MuiChip: {\n styleOverrides: {\n root: {\n fontWeight: 'bold',\n paddingLeft: '6px',\n paddingRight: '6px',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n '&:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-primary-weak'],\n },\n '&:not(:last-child)': {\n borderBottom: `1px solid ${baseTheme.palette.semantic.stroke['stroke-weak']}`,\n },\n },\n },\n },\n MuiTableRow: {\n styleOverrides: {\n root: {\n '&.MuiTableRow-hover:hover': {\n backgroundColor: baseTheme.palette.semantic.fill['fill-secondary'],\n cursor: 'pointer',\n },\n },\n },\n },\n MuiTypography: {\n defaultProps: {\n variantMapping: typographyVariantMapping,\n },\n },\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","baseTheme","createTheme","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","Object","keys","forEach","key","keyWithoutVariantSuffix","split","down","getMobileTextStyle","shape","borderRadius","customShadows","shadows","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","textTransform","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiChip","fontWeight","paddingLeft","paddingRight","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","lightTheme","darkTheme"],"mappings":"4eAWA,MAAMA,EAA8BC,IAClC,MAAMC,EAAYC,EAAY,CAC5BC,aACAC,QAAkB,UAATJ,EAAmBK,EAAeC,EAC3CC,SACAC,YAAa,CACXC,OAAQC,KAqBZ,OAZAC,OAAOC,KAAKT,GAAYU,SAASC,IAE/B,MAAMC,EAA0BD,EAAIE,MAAM,aAAa,GACvDf,EAAUE,WAAWW,GAAO,IACvBb,EAAUE,WAAWW,GACxB,CAACb,EAAUO,YAAYS,KAAK,WAAY,IACnCC,EAAmBH,IAEzB,IAIIb,EAAYD,EAA2B,CAC5CkB,MAAO,CACLC,aAAc,OAEhBC,cAAe,IACVC,GAELC,WAAY,CACVC,SAAU,CACRC,aAAc,CACZF,WAAY,CACVG,UAAWC,IAGfC,eAAgB,CACdC,KAAM,CAEJT,aAAc,MAEdU,QAAS,QAEXC,KAAM,CAEJC,YAAa,OACbF,QAAS,GAEXG,OAAQ,CACNH,QAAS,EACT,WAAY,CACVI,UAAW,SAGfC,QAAS,CACPL,QAAS,KAIfM,UAAW,CACTR,eAAgB,CACdC,KAAM,CACJC,QAAS,YACTO,cAAe,UAIrBC,QAAS,CACPV,eAAgB,CACdC,KAAM,CACJU,UAAW,OACXC,YAAa,MACbC,YAAa,QACbC,YAAazC,EAAUG,QAAQuC,WAIrCC,QAAS,CACPhB,eAAgB,CACdC,KAAM,CACJgB,WAAY,OACZC,YAAa,MACbC,aAAc,SAIpBC,kBAAmB,CACjBpB,eAAgB,CACdC,KAAM,CACJ,UAAW,CACToB,gBAAiBhD,EAAUG,QAAQ8C,SAASC,KAAK,sBAEnD,qBAAsB,CACpBC,aAAc,aAAanD,EAAUG,QAAQ8C,SAASG,OAAO,qBAKrEC,YAAa,CACX1B,eAAgB,CACdC,KAAM,CACJ,4BAA6B,CAC3BoB,gBAAiBhD,EAAUG,QAAQ8C,SAASC,KAAK,kBACjDI,OAAQ,cAKhBC,cAAe,CACb/B,aAAc,CACZgC,eAAgBC,MAItB,EAGSC,EAAa5D,EAA2B,SACxC6D,EAAY7D,EAA2B"}
|
package/dist/themes/theme.d.ts
CHANGED
|
@@ -203,6 +203,12 @@ declare module '@mui/material/styles' {
|
|
|
203
203
|
};
|
|
204
204
|
}
|
|
205
205
|
interface Theme {
|
|
206
|
+
customShadows?: {
|
|
207
|
+
base: string;
|
|
208
|
+
sunken: string;
|
|
209
|
+
raised: string;
|
|
210
|
+
overlay: string;
|
|
211
|
+
};
|
|
206
212
|
breakpoints: {
|
|
207
213
|
up: (key: Breakpoint | number) => string;
|
|
208
214
|
down: (key: Breakpoint | number) => string;
|
|
@@ -226,6 +232,12 @@ declare module '@mui/material/styles' {
|
|
|
226
232
|
}
|
|
227
233
|
interface ThemeOptions {
|
|
228
234
|
radius?: Record<RadiusToken, string>;
|
|
235
|
+
customShadows?: {
|
|
236
|
+
base?: string;
|
|
237
|
+
sunken?: string;
|
|
238
|
+
raised?: string;
|
|
239
|
+
overlay?: string;
|
|
240
|
+
};
|
|
229
241
|
}
|
|
230
242
|
interface TypographyVariants {
|
|
231
243
|
d1Strong: React.CSSProperties;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var s=require("../colours/semantic.cjs.js");const r={x:0,y:1,blur:2,spread:0},a={x:0,y:2,blur:6,spread:0},p={x:0,y:1,blur:2,spread:0},x={x:0,y:8,blur:16,spread:0},o={x:0,y:1,blur:6,spread:0},e={base:"none",sunken:`${r.x}px ${r.y}px ${r.blur}px ${r.spread}px ${s.lightColours.semantic.shadow["shadow-strong"]} inset`,raised:`${p.x}px ${p.y}px ${p.blur}px ${p.spread}px ${s.lightColours.semantic.shadow["shadow-weak"]}, ${a.x}px ${a.y}px ${a.blur}px ${a.spread}px ${s.lightColours.semantic.shadow["shadow-strong"]}`,overlay:`${o.x}px ${o.y}px ${o.blur}px ${o.spread}px ${s.lightColours.semantic.shadow["shadow-weak"]}, ${x.x}px ${x.y}px ${x.blur}px ${x.spread}px ${s.lightColours.semantic.shadow["shadow-strong"]}`};exports.shadows=e;
|
|
2
|
+
//# sourceMappingURL=shadows.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"shadows.cjs.js","sources":["../../../../src/themes/tokens/shadows/shadows.ts"],"sourcesContent":["import { lightColours } from '../colours/semantic';\n\nconst shadowParts = {\n sunken: { x: 0, y: 1, blur: 2, spread: 0 },\n raisedLarge: { x: 0, y: 2, blur: 6, spread: 0 },\n raisedSmall: { x: 0, y: 1, blur: 2, spread: 0 },\n overlayLarge: { x: 0, y: 8, blur: 16, spread: 0 },\n overlaySmall: { x: 0, y: 1, blur: 6, spread: 0 },\n};\n\nexport const shadows = {\n base: 'none',\n sunken: `${shadowParts.sunken.x}px ${shadowParts.sunken.y}px ${shadowParts.sunken.blur}px ${shadowParts.sunken.spread}px ${lightColours.semantic.shadow['shadow-strong']} inset`,\n raised: `${shadowParts.raisedSmall.x}px ${shadowParts.raisedSmall.y}px ${shadowParts.raisedSmall.blur}px ${shadowParts.raisedSmall.spread}px ${lightColours.semantic.shadow['shadow-weak']}, ${shadowParts.raisedLarge.x}px ${shadowParts.raisedLarge.y}px ${shadowParts.raisedLarge.blur}px ${shadowParts.raisedLarge.spread}px ${lightColours.semantic.shadow['shadow-strong']}`,\n overlay: `${shadowParts.overlaySmall.x}px ${shadowParts.overlaySmall.y}px ${shadowParts.overlaySmall.blur}px ${shadowParts.overlaySmall.spread}px ${lightColours.semantic.shadow['shadow-weak']}, ${shadowParts.overlayLarge.x}px ${shadowParts.overlayLarge.y}px ${shadowParts.overlayLarge.blur}px ${shadowParts.overlayLarge.spread}px ${lightColours.semantic.shadow['shadow-strong']}`,\n};\n"],"names":["shadowParts","x","y","blur","spread","shadows","base","sunken","lightColours","semantic","shadow","raised","overlay"],"mappings":"yDAEA,MAAMA,EACI,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GADnCJ,EAES,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GAFxCJ,EAGS,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GAHxCJ,EAIU,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,GAAIC,OAAQ,GAJ1CJ,EAKU,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GAGlCC,EAAU,CACrBC,KAAM,OACNC,OAAQ,GAAGP,EAAmBC,OAAOD,EAAmBE,OAAOF,EAAmBG,UAAUH,EAAmBI,YAAYI,EAAYA,aAACC,SAASC,OAAO,yBACxJC,OAAQ,GAAGX,EAAwBC,OAAOD,EAAwBE,OAAOF,EAAwBG,UAAUH,EAAwBI,YAAYI,EAAYA,aAACC,SAASC,OAAO,mBAAmBV,EAAwBC,OAAOD,EAAwBE,OAAOF,EAAwBG,UAAUH,EAAwBI,YAAYI,EAAYA,aAACC,SAASC,OAAO,mBAChWE,QAAS,GAAGZ,EAAyBC,OAAOD,EAAyBE,OAAOF,EAAyBG,UAAUH,EAAyBI,YAAYI,EAAYA,aAACC,SAASC,OAAO,mBAAmBV,EAAyBC,OAAOD,EAAyBE,OAAOF,EAAyBG,UAAUH,EAAyBI,YAAYI,EAAYA,aAACC,SAASC,OAAO"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{lightColours as s}from"../colours/semantic.js";const p={x:0,y:1,blur:2,spread:0},a={x:0,y:2,blur:6,spread:0},x={x:0,y:1,blur:2,spread:0},r={x:0,y:8,blur:16,spread:0},e={x:0,y:1,blur:6,spread:0},$={base:"none",sunken:`${p.x}px ${p.y}px ${p.blur}px ${p.spread}px ${s.semantic.shadow["shadow-strong"]} inset`,raised:`${x.x}px ${x.y}px ${x.blur}px ${x.spread}px ${s.semantic.shadow["shadow-weak"]}, ${a.x}px ${a.y}px ${a.blur}px ${a.spread}px ${s.semantic.shadow["shadow-strong"]}`,overlay:`${e.x}px ${e.y}px ${e.blur}px ${e.spread}px ${s.semantic.shadow["shadow-weak"]}, ${r.x}px ${r.y}px ${r.blur}px ${r.spread}px ${s.semantic.shadow["shadow-strong"]}`};export{$ as shadows};
|
|
2
|
+
//# sourceMappingURL=shadows.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"shadows.js","sources":["../../../../src/themes/tokens/shadows/shadows.ts"],"sourcesContent":["import { lightColours } from '../colours/semantic';\n\nconst shadowParts = {\n sunken: { x: 0, y: 1, blur: 2, spread: 0 },\n raisedLarge: { x: 0, y: 2, blur: 6, spread: 0 },\n raisedSmall: { x: 0, y: 1, blur: 2, spread: 0 },\n overlayLarge: { x: 0, y: 8, blur: 16, spread: 0 },\n overlaySmall: { x: 0, y: 1, blur: 6, spread: 0 },\n};\n\nexport const shadows = {\n base: 'none',\n sunken: `${shadowParts.sunken.x}px ${shadowParts.sunken.y}px ${shadowParts.sunken.blur}px ${shadowParts.sunken.spread}px ${lightColours.semantic.shadow['shadow-strong']} inset`,\n raised: `${shadowParts.raisedSmall.x}px ${shadowParts.raisedSmall.y}px ${shadowParts.raisedSmall.blur}px ${shadowParts.raisedSmall.spread}px ${lightColours.semantic.shadow['shadow-weak']}, ${shadowParts.raisedLarge.x}px ${shadowParts.raisedLarge.y}px ${shadowParts.raisedLarge.blur}px ${shadowParts.raisedLarge.spread}px ${lightColours.semantic.shadow['shadow-strong']}`,\n overlay: `${shadowParts.overlaySmall.x}px ${shadowParts.overlaySmall.y}px ${shadowParts.overlaySmall.blur}px ${shadowParts.overlaySmall.spread}px ${lightColours.semantic.shadow['shadow-weak']}, ${shadowParts.overlayLarge.x}px ${shadowParts.overlayLarge.y}px ${shadowParts.overlayLarge.blur}px ${shadowParts.overlayLarge.spread}px ${lightColours.semantic.shadow['shadow-strong']}`,\n};\n"],"names":["shadowParts","x","y","blur","spread","shadows","base","sunken","lightColours","semantic","shadow","raised","overlay"],"mappings":"sDAEA,MAAMA,EACI,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GADnCJ,EAES,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GAFxCJ,EAGS,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GAHxCJ,EAIU,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,GAAIC,OAAQ,GAJ1CJ,EAKU,CAAEC,EAAG,EAAGC,EAAG,EAAGC,KAAM,EAAGC,OAAQ,GAGlCC,EAAU,CACrBC,KAAM,OACNC,OAAQ,GAAGP,EAAmBC,OAAOD,EAAmBE,OAAOF,EAAmBG,UAAUH,EAAmBI,YAAYI,EAAaC,SAASC,OAAO,yBACxJC,OAAQ,GAAGX,EAAwBC,OAAOD,EAAwBE,OAAOF,EAAwBG,UAAUH,EAAwBI,YAAYI,EAAaC,SAASC,OAAO,mBAAmBV,EAAwBC,OAAOD,EAAwBE,OAAOF,EAAwBG,UAAUH,EAAwBI,YAAYI,EAAaC,SAASC,OAAO,mBAChWE,QAAS,GAAGZ,EAAyBC,OAAOD,EAAyBE,OAAOF,EAAyBG,UAAUH,EAAyBI,YAAYI,EAAaC,SAASC,OAAO,mBAAmBV,EAAyBC,OAAOD,EAAyBE,OAAOF,EAAyBG,UAAUH,EAAyBI,YAAYI,EAAaC,SAASC,OAAO"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@flipdish/portal-library",
|
|
3
|
-
"version": "3.7.
|
|
3
|
+
"version": "3.7.2",
|
|
4
4
|
"files": [
|
|
5
5
|
"dist"
|
|
6
6
|
],
|
|
@@ -77,11 +77,11 @@
|
|
|
77
77
|
"@tanstack/react-query": "^5.62.0",
|
|
78
78
|
"@testing-library/jest-dom": "6.6.3",
|
|
79
79
|
"@testing-library/react": "15.0.7",
|
|
80
|
-
"@types/react": "18.3.
|
|
80
|
+
"@types/react": "18.3.23",
|
|
81
81
|
"@types/react-dom": "18.3.7",
|
|
82
82
|
"@typescript-eslint/eslint-plugin": "7.18.0",
|
|
83
83
|
"@typescript-eslint/parser": "7.18.0",
|
|
84
|
-
"@vitejs/plugin-react-swc": "3.
|
|
84
|
+
"@vitejs/plugin-react-swc": "3.10.0",
|
|
85
85
|
"chromatic": "^11.25.2",
|
|
86
86
|
"dotenv": "^16.4.5",
|
|
87
87
|
"eslint": "^8.56.0",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
export { GreyPrimitives, LightDarkPrimitives, PrimaryPrimitives, PrimativeColours, SimplePaletteColourOptions, SinglePrimitive, SolidGreyPrimitives, SystemPrimitives } from './types.js';
|
|
2
|
-
export { primativeColours } from './primitives.js';
|
|
3
|
-
export { darkColours, lightColours } from './semantic.js';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|