@flipdish/portal-library 8.0.0 → 8.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/dist/components/atoms/IconButton/getIconButtonStyles.cjs.js +1 -1
  2. package/dist/components/atoms/IconButton/getIconButtonStyles.cjs.js.map +1 -1
  3. package/dist/components/atoms/IconButton/getIconButtonStyles.d.ts +22 -12
  4. package/dist/components/atoms/IconButton/getIconButtonStyles.js +1 -1
  5. package/dist/components/atoms/IconButton/getIconButtonStyles.js.map +1 -1
  6. package/dist/components/atoms/IconButton/index.cjs.js +1 -1
  7. package/dist/components/atoms/IconButton/index.cjs.js.map +1 -1
  8. package/dist/components/atoms/IconButton/index.d.ts +2 -2
  9. package/dist/components/atoms/IconButton/index.js +1 -1
  10. package/dist/components/atoms/IconButton/index.js.map +1 -1
  11. package/dist/themes/flipdishPublicTheme.cjs.js +1 -1
  12. package/dist/themes/flipdishPublicTheme.cjs.js.map +1 -1
  13. package/dist/themes/flipdishPublicTheme.js +1 -1
  14. package/dist/themes/flipdishPublicTheme.js.map +1 -1
  15. package/dist/themes/overrides/iconButtonOverrides.cjs.js +2 -0
  16. package/dist/themes/overrides/iconButtonOverrides.cjs.js.map +1 -0
  17. package/dist/themes/overrides/iconButtonOverrides.d.ts +5 -0
  18. package/dist/themes/overrides/iconButtonOverrides.js +2 -0
  19. package/dist/themes/overrides/iconButtonOverrides.js.map +1 -0
  20. package/package.json +1 -1
  21. package/dist/components/atoms/IconButton/iconButtonThemeOverrides.cjs.js +0 -2
  22. package/dist/components/atoms/IconButton/iconButtonThemeOverrides.cjs.js.map +0 -1
  23. package/dist/components/atoms/IconButton/iconButtonThemeOverrides.d.ts +0 -13
  24. package/dist/components/atoms/IconButton/iconButtonThemeOverrides.js +0 -2
  25. package/dist/components/atoms/IconButton/iconButtonThemeOverrides.js.map +0 -1
@@ -1,2 +1,2 @@
1
- "use strict";var o=require("@mui/material/styles");module.exports=(r,i="primary",n="brand",e="medium")=>{const l="light"===r.palette.mode,s=r.palette.semantic,c="small"===e?32:48,t={borderRadius:r.radius["radius-8"]||8,width:c,height:c,boxShadow:r.customShadows?.raised||"0px 1px 2px 0px rgba(0,0,0,0.1), 0px 2px 6px 0px rgba(0,0,0,0.15)",minWidth:0,padding:0,position:"relative",transition:"all 0.2s ease-in-out"},d={generic:{focus:{outlineOffset:"2px",outline:`2px solid ${r.palette.semantic.stroke["stroke-focus"]}`,transition:"none"}},primary:{brand:{default:{...t,background:s.fill["fill-primary-strong"],color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:l?o.darken(s.fill["fill-primary-strong"],.1):o.lighten(s.fill["fill-primary-strong"],.1),color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:l?o.darken(s.fill["fill-primary-strong"],.2):o.lighten(s.fill["fill-primary-strong"],.2),color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},neutral:{default:{...t,background:s.fill["fill-strong"],color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:l?o.lighten(s.fill["fill-strong"],.1):o.darken(s.fill["fill-strong"],.1),color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:l?o.lighten(s.fill["fill-strong"],.2):o.darken(s.fill["fill-strong"],.2),color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},destructive:{default:{...t,background:s.fill["fill-error-strong"],color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:l?o.darken(s.fill["fill-error-strong"],.1):o.lighten(s.fill["fill-error-strong"],.1),color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:l?o.darken(s.fill["fill-error-strong"],.2):o.lighten(s.fill["fill-error-strong"],.2),color:s.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},inverse:{default:{...t,background:s.fill["fill-inverse-strong"],color:s.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:l?o.darken(s.fill["fill-inverse-strong"],.1):o.lighten(s.fill["fill-inverse-strong"],.1),color:s.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:l?o.darken(s.fill["fill-inverse-strong"],.2):o.lighten(s.fill["fill-inverse-strong"],.2),color:s.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}}},secondary:{brand:{default:{...t,background:s.fill["fill-inverse-strong"],color:s.icon["icon-primary"],border:`1px solid ${s.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},hover:{...t,background:s.fill["fill-hover"],color:s.icon["icon-primary"],border:`1px solid ${s.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},press:{...t,background:s.fill["fill-press"],color:s.icon["icon-primary"],border:`1px solid ${s.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:`1px solid ${s.stroke["stroke-disabled"]}`,cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},destructive:{default:{...t,background:s.fill["fill-inverse-strong"],color:s.icon["icon-error"],border:`1px solid ${s.stroke["stroke-error-strong"]}`,cursor:"pointer",opacity:1},hover:{...t,background:s.fill["fill-hover"],color:s.icon["icon-error"],border:`1px solid ${s.stroke["stroke-error-strong"]}`,cursor:"pointer",opacity:1},press:{...t,background:s.fill["fill-press"],color:s.icon["icon-error"],border:`1px solid ${s.stroke["stroke-error-strong"]}`,cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:`1px solid ${s.stroke["stroke-disabled"]}`,cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},neutral:{default:{...t,background:s.fill["fill-strong"],color:s.icon["icon-strong"],border:`1px solid ${s.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},hover:{...t,background:l?o.darken(s.fill["fill-strong"],.1):o.lighten(s.fill["fill-strong"],.1),color:s.icon["icon-strong"],border:`1px solid ${s.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},press:{...t,background:l?o.darken(s.fill["fill-strong"],.2):o.lighten(s.fill["fill-strong"],.2),color:s.icon["icon-strong"],border:`1px solid ${s.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:`1px solid ${s.stroke["stroke-disabled"]}`,cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},inverse:{default:{...t,background:s.fill["fill-inverse-strong"],color:s.icon["icon-inverse-strong"],border:`1px solid ${s.stroke["stroke-inverse-strong"]}`,cursor:"pointer",opacity:1},hover:{...t,background:l?o.darken(s.fill["fill-inverse-strong"],.1):o.lighten(s.fill["fill-inverse-strong"],.1),color:s.icon["icon-inverse-strong"],border:`1px solid ${s.stroke["stroke-inverse-strong"]}`,cursor:"pointer",opacity:1},press:{...t,background:l?o.darken(s.fill["fill-inverse-strong"],.2):o.lighten(s.fill["fill-inverse-strong"],.2),color:s.icon["icon-inverse-strong"],border:`1px solid ${s.stroke["stroke-inverse-strong"]}`,cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:`1px solid ${s.stroke["stroke-disabled"]}`,cursor:"not-allowed",opacity:.5}}},tertiary:{brand:{default:{...t,boxShadow:"none",background:"transparent",color:s.icon["icon-primary"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:s.fill["fill-hover"],color:s.icon["icon-primary"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:s.fill["fill-press"],color:s.icon["icon-primary"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},destructive:{default:{...t,boxShadow:"none",background:"transparent",color:s.icon["icon-error"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:s.fill["fill-hover"],color:s.icon["icon-error"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:s.fill["fill-press"],color:s.icon["icon-error"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",opacity:.5}},neutral:{default:{...t,boxShadow:"none",background:"transparent",color:s.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:s.fill["fill-hover"],color:s.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:s.fill["fill-press"],color:s.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},inverse:{default:{...t,boxShadow:"none",background:"transparent",color:s.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},hover:{...t,background:s.fill["fill-hover"],color:s.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},press:{...t,background:s.fill["fill-press"],color:s.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},disabled:{...t,background:s.fill["fill-disabled"],color:s.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}}}};return{...d.generic,...d[i][n in d[i]?n:"brand"]}};
1
+ "use strict";require("@mui/material/styles");module.exports=(o,r="primary",e="brand")=>{const l=o.palette.semantic,i={borderRadius:o.radius["radius-8"],boxShadow:o.customShadows.raised,boxSizing:"border-box",cursor:"pointer",minWidth:0,opacity:1,overflow:"hidden",padding:0,position:"relative",transition:"all 0.2s ease-in-out"},n={borderRadius:"inherit",borderStyle:"solid",borderWidth:1,content:'""',inset:0,pointerEvents:"none",position:"absolute"},s={boxShadow:"none",cursor:"not-allowed",pointerEvents:"auto"},d={primary:{brand:{default:{...i,background:l.fill["fill-primary-strong"],color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,background:l.fill["fill-disabled"],color:l.icon["icon-inverse"]}},neutral:{default:{...i,background:l.fill["fill-strong"],color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-inverse-hover"]},press:{background:l.fill["fill-inverse-press"]},disabled:{...s,background:l.fill["fill-disabled"],color:l.icon["icon-inverse"]}},destructive:{default:{...i,background:l.fill["fill-error-strong"],color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,background:l.fill["fill-disabled"],color:l.icon["icon-inverse"]}},inverse:{default:{...i,background:l.fill["fill-inverse-strong"],color:l.icon["icon-strong"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,background:l.fill["fill-inverse-disabled"],color:l.icon["icon-strong"]}}},secondary:{brand:{default:{...i,color:l.icon["icon-primary"],"&::before":{...n,borderColor:l.stroke["stroke-primary-strong"]}},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"],"&::before":{borderColor:l.stroke["stroke-disabled"]}}},neutral:{default:{...i,color:l.icon["icon-strong"],"&::before":{...n,borderColor:l.stroke["stroke-strong"]}},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"],"&::before":{borderColor:l.stroke["stroke-disabled"]}}},destructive:{default:{...i,color:l.icon["icon-error"],"&::before":{...n,borderColor:l.stroke["stroke-error-strong"]}},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"],"&::before":{borderColor:l.stroke["stroke-disabled"]}}},inverse:{default:{...i,color:l.icon["icon-inverse"],"&::before":{...n,borderColor:l.stroke["stroke-inverse-strong"]}},hover:{background:l.fill["fill-inverse-hover"]},press:{background:l.fill["fill-inverse-press"]},disabled:{...s,color:l.icon["icon-inverse-disabled"],"&::before":{borderColor:l.stroke["stroke-inverse-disabled"]}}}},tertiary:{brand:{default:{...i,boxShadow:"none",color:l.icon["icon-primary"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"]}},neutral:{default:{...i,boxShadow:"none",color:l.icon["icon-strong"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"]}},destructive:{default:{...i,boxShadow:"none",color:l.icon["icon-error"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"]}},inverse:{default:{...i,boxShadow:"none",color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-inverse-hover"]},press:{background:l.fill["fill-inverse-press"]},disabled:{...s,color:l.icon["icon-inverse-disabled"]}}}};return d[r][e in d[r]?e:"brand"]};
2
2
  //# sourceMappingURL=getIconButtonStyles.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"getIconButtonStyles.cjs.js","sources":["../../../../src/components/atoms/IconButton/getIconButtonStyles.ts"],"sourcesContent":["import { darken, lighten, type Theme } from '@mui/material/styles';\n\nexport type IconButtonVariant = 'primary' | 'secondary' | 'tertiary';\nexport type IconButtonTone = 'brand' | 'destructive' | 'inverse' | 'neutral';\nexport type IconButtonState = 'default' | 'disabled' | 'focus' | 'hover' | 'press';\n\ninterface StyleObject {\n [property: string]: number | string | undefined;\n}\ninterface IconButtonStyles {\n default?: StyleObject;\n disabled?: StyleObject;\n focus?: StyleObject;\n hover?: StyleObject;\n press?: StyleObject;\n}\n\nconst getIconButtonStyles = (\n theme: Theme,\n variant: IconButtonVariant = 'primary',\n tone: IconButtonTone = 'brand',\n size: 'medium' | 'small' = 'medium'\n): IconButtonStyles => {\n const isLight = theme.palette.mode === 'light';\n const palette = theme.palette.semantic;\n const radius = theme.radius['radius-8'] || 8;\n const boxShadow = theme.customShadows?.raised || '0px 1px 2px 0px rgba(0,0,0,0.1), 0px 2px 6px 0px rgba(0,0,0,0.15)';\n const sizePx = size === 'small' ? 32 : 48;\n\n const shared = {\n borderRadius: radius,\n width: sizePx,\n height: sizePx,\n boxShadow,\n minWidth: 0,\n padding: 0,\n position: 'relative',\n transition: 'all 0.2s ease-in-out',\n };\n\n const variants = {\n generic: {\n focus: {\n outlineOffset: '2px',\n outline: `2px solid ${theme.palette.semantic.stroke['stroke-focus']}`,\n transition: 'none',\n },\n },\n primary: {\n brand: {\n default: {\n ...shared,\n background: palette.fill['fill-primary-strong'],\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-primary-strong'], 0.1) : lighten(palette.fill['fill-primary-strong'], 0.1),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-primary-strong'], 0.2) : lighten(palette.fill['fill-primary-strong'], 0.2),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n neutral: {\n default: {\n ...shared,\n background: palette.fill['fill-strong'],\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? lighten(palette.fill['fill-strong'], 0.1) : darken(palette.fill['fill-strong'], 0.1),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? lighten(palette.fill['fill-strong'], 0.2) : darken(palette.fill['fill-strong'], 0.2),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n destructive: {\n default: {\n ...shared,\n background: palette.fill['fill-error-strong'],\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-error-strong'], 0.1) : lighten(palette.fill['fill-error-strong'], 0.1),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-error-strong'], 0.2) : lighten(palette.fill['fill-error-strong'], 0.2),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n inverse: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.1) : lighten(palette.fill['fill-inverse-strong'], 0.1),\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.2) : lighten(palette.fill['fill-inverse-strong'], 0.2),\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n },\n secondary: {\n brand: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-primary'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-primary'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-primary'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n destructive: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-error'],\n border: `1px solid ${palette.stroke['stroke-error-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-error'],\n border: `1px solid ${palette.stroke['stroke-error-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-error'],\n border: `1px solid ${palette.stroke['stroke-error-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n neutral: {\n default: {\n ...shared,\n background: palette.fill['fill-strong'],\n color: palette.icon['icon-strong'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-strong'], 0.1) : lighten(palette.fill['fill-strong'], 0.1),\n color: palette.icon['icon-strong'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-strong'], 0.2) : lighten(palette.fill['fill-strong'], 0.2),\n color: palette.icon['icon-strong'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n inverse: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-inverse-strong'],\n border: `1px solid ${palette.stroke['stroke-inverse-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.1) : lighten(palette.fill['fill-inverse-strong'], 0.1),\n color: palette.icon['icon-inverse-strong'],\n border: `1px solid ${palette.stroke['stroke-inverse-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.2) : lighten(palette.fill['fill-inverse-strong'], 0.2),\n color: palette.icon['icon-inverse-strong'],\n border: `1px solid ${palette.stroke['stroke-inverse-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n opacity: 0.5,\n },\n },\n },\n tertiary: {\n brand: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-primary'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-primary'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-primary'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n destructive: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-error'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-error'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-error'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n opacity: 0.5,\n },\n },\n neutral: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n inverse: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n },\n };\n\n // Fallback to brand if tone not found\n const toneKey: IconButtonTone = tone in variants[variant] ? tone : 'brand';\n return { ...variants.generic, ...variants[variant][toneKey] };\n};\n\nexport default getIconButtonStyles;"],"names":["theme","variant","tone","size","isLight","palette","mode","semantic","sizePx","shared","borderRadius","radius","width","height","boxShadow","customShadows","raised","minWidth","padding","position","transition","variants","generic","focus","outlineOffset","outline","stroke","primary","brand","default","background","fill","color","icon","border","cursor","opacity","hover","darken","lighten","press","disabled","pointerEvents","neutral","destructive","inverse","secondary","tertiary"],"mappings":"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"}
1
+ {"version":3,"file":"getIconButtonStyles.cjs.js","sources":["../../../../src/components/atoms/IconButton/getIconButtonStyles.ts"],"sourcesContent":["import { type CSSObject, type Theme } from '@mui/material/styles';\n\n/**\n * The variant of the IconButton.\n * @default 'primary'\n */\nexport type IconButtonVariant = 'primary' | 'secondary' | 'tertiary';\n/**\n * The tone of the IconButton.\n * @default 'brand'\n */\nexport type IconButtonTone = 'brand' | 'destructive' | 'inverse' | 'neutral';\n\ninterface IconButtonStyles {\n default?: CSSObject;\n disabled?: CSSObject;\n hover?: CSSObject;\n press?: CSSObject;\n}\n\n/**\n * Returns the styles for the IconButton states based on the variant and tone.\n * @param theme - The theme object.\n * @param variant - The variant of the IconButton.\n * @param tone - The tone of the IconButton.\n * @returns The styles for the IconButton states based on the variant and tone.\n */\nconst getIconButtonStyles = (\n theme: Theme,\n variant: IconButtonVariant = 'primary',\n tone: IconButtonTone = 'brand',\n): IconButtonStyles => {\n const palette = theme.palette.semantic;\n const radius = theme.radius['radius-8'];\n const boxShadow = theme.customShadows.raised;\n\n const shared = {\n borderRadius: radius,\n boxShadow,\n boxSizing: 'border-box',\n cursor: 'pointer',\n minWidth: 0,\n opacity: 1,\n overflow: 'hidden',\n padding: 0,\n position: 'relative',\n transition: 'all 0.2s ease-in-out',\n } satisfies CSSObject;\n\n const secondaryBorderStyle = {\n borderRadius: 'inherit',\n borderStyle: 'solid',\n borderWidth: 1,\n content: '\"\"',\n inset: 0,\n pointerEvents: 'none',\n position: 'absolute',\n } satisfies CSSObject;\n\n const sharedDisabled = {\n boxShadow: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n } satisfies CSSObject;\n\n const variants = {\n primary: {\n brand: {\n default: {\n ...shared,\n background: palette.fill['fill-primary-strong'],\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-inverse'],\n },\n },\n neutral: {\n default: {\n ...shared,\n background: palette.fill['fill-strong'],\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-inverse-hover'],\n },\n press: {\n background: palette.fill['fill-inverse-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-inverse'],\n },\n },\n destructive: {\n default: {\n ...shared,\n background: palette.fill['fill-error-strong'],\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-inverse'],\n },\n },\n inverse: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-strong'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-inverse-disabled'],\n color: palette.icon['icon-strong'],\n },\n },\n },\n secondary: {\n brand: {\n default: {\n ...shared,\n color: palette.icon['icon-primary'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-primary-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-disabled'],\n },\n },\n },\n neutral: {\n default: {\n ...shared,\n color: palette.icon['icon-strong'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-disabled'],\n },\n },\n },\n destructive: {\n default: {\n ...shared,\n color: palette.icon['icon-error'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-error-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-disabled'],\n },\n },\n },\n inverse: {\n default: {\n ...shared,\n color: palette.icon['icon-inverse'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-inverse-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-inverse-hover'],\n },\n press: {\n background: palette.fill['fill-inverse-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-inverse-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-inverse-disabled'],\n },\n },\n },\n },\n tertiary: {\n brand: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-primary'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n },\n },\n neutral: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-strong'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n },\n },\n destructive: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-error'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n },\n },\n inverse: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-inverse-hover'],\n },\n press: {\n background: palette.fill['fill-inverse-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-inverse-disabled'],\n },\n },\n },\n };\n\n // Fallback to brand if tone not found\n const toneKey: IconButtonTone = tone in variants[variant] ? tone : 'brand';\n return variants[variant][toneKey];\n};\n\nexport default getIconButtonStyles;\n"],"names":["theme","variant","tone","palette","semantic","shared","borderRadius","radius","boxShadow","customShadows","raised","boxSizing","cursor","minWidth","opacity","overflow","padding","position","transition","secondaryBorderStyle","borderStyle","borderWidth","content","inset","pointerEvents","sharedDisabled","variants","primary","brand","default","background","fill","color","icon","hover","press","disabled","neutral","destructive","inverse","secondary","borderColor","stroke","tertiary"],"mappings":"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"}
@@ -1,19 +1,29 @@
1
- import { Theme } from '@mui/material/styles';
1
+ import { Theme, CSSObject } from '@mui/material/styles';
2
2
 
3
+ /**
4
+ * The variant of the IconButton.
5
+ * @default 'primary'
6
+ */
3
7
  type IconButtonVariant = 'primary' | 'secondary' | 'tertiary';
8
+ /**
9
+ * The tone of the IconButton.
10
+ * @default 'brand'
11
+ */
4
12
  type IconButtonTone = 'brand' | 'destructive' | 'inverse' | 'neutral';
5
- type IconButtonState = 'default' | 'disabled' | 'focus' | 'hover' | 'press';
6
- interface StyleObject {
7
- [property: string]: number | string | undefined;
8
- }
9
13
  interface IconButtonStyles {
10
- default?: StyleObject;
11
- disabled?: StyleObject;
12
- focus?: StyleObject;
13
- hover?: StyleObject;
14
- press?: StyleObject;
14
+ default?: CSSObject;
15
+ disabled?: CSSObject;
16
+ hover?: CSSObject;
17
+ press?: CSSObject;
15
18
  }
16
- declare const getIconButtonStyles: (theme: Theme, variant?: IconButtonVariant, tone?: IconButtonTone, size?: 'medium' | 'small') => IconButtonStyles;
19
+ /**
20
+ * Returns the styles for the IconButton states based on the variant and tone.
21
+ * @param theme - The theme object.
22
+ * @param variant - The variant of the IconButton.
23
+ * @param tone - The tone of the IconButton.
24
+ * @returns The styles for the IconButton states based on the variant and tone.
25
+ */
26
+ declare const getIconButtonStyles: (theme: Theme, variant?: IconButtonVariant, tone?: IconButtonTone) => IconButtonStyles;
17
27
 
18
28
  export { getIconButtonStyles as default };
19
- export type { IconButtonState, IconButtonTone, IconButtonVariant };
29
+ export type { IconButtonTone, IconButtonVariant };
@@ -1,2 +1,2 @@
1
- import{darken as o,lighten as r}from"@mui/material/styles";const i=(i,n="primary",e="brand",l="medium")=>{const s="light"===i.palette.mode,c=i.palette.semantic,t="small"===l?32:48,d={borderRadius:i.radius["radius-8"]||8,width:t,height:t,boxShadow:i.customShadows?.raised||"0px 1px 2px 0px rgba(0,0,0,0.1), 0px 2px 6px 0px rgba(0,0,0,0.15)",minWidth:0,padding:0,position:"relative",transition:"all 0.2s ease-in-out"},a={generic:{focus:{outlineOffset:"2px",outline:`2px solid ${i.palette.semantic.stroke["stroke-focus"]}`,transition:"none"}},primary:{brand:{default:{...d,background:c.fill["fill-primary-strong"],color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:s?o(c.fill["fill-primary-strong"],.1):r(c.fill["fill-primary-strong"],.1),color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:s?o(c.fill["fill-primary-strong"],.2):r(c.fill["fill-primary-strong"],.2),color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},neutral:{default:{...d,background:c.fill["fill-strong"],color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:s?r(c.fill["fill-strong"],.1):o(c.fill["fill-strong"],.1),color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:s?r(c.fill["fill-strong"],.2):o(c.fill["fill-strong"],.2),color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},destructive:{default:{...d,background:c.fill["fill-error-strong"],color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:s?o(c.fill["fill-error-strong"],.1):r(c.fill["fill-error-strong"],.1),color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:s?o(c.fill["fill-error-strong"],.2):r(c.fill["fill-error-strong"],.2),color:c.icon["icon-inverse"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},inverse:{default:{...d,background:c.fill["fill-inverse-strong"],color:c.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:s?o(c.fill["fill-inverse-strong"],.1):r(c.fill["fill-inverse-strong"],.1),color:c.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:s?o(c.fill["fill-inverse-strong"],.2):r(c.fill["fill-inverse-strong"],.2),color:c.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}}},secondary:{brand:{default:{...d,background:c.fill["fill-inverse-strong"],color:c.icon["icon-primary"],border:`1px solid ${c.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},hover:{...d,background:c.fill["fill-hover"],color:c.icon["icon-primary"],border:`1px solid ${c.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},press:{...d,background:c.fill["fill-press"],color:c.icon["icon-primary"],border:`1px solid ${c.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:`1px solid ${c.stroke["stroke-disabled"]}`,cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},destructive:{default:{...d,background:c.fill["fill-inverse-strong"],color:c.icon["icon-error"],border:`1px solid ${c.stroke["stroke-error-strong"]}`,cursor:"pointer",opacity:1},hover:{...d,background:c.fill["fill-hover"],color:c.icon["icon-error"],border:`1px solid ${c.stroke["stroke-error-strong"]}`,cursor:"pointer",opacity:1},press:{...d,background:c.fill["fill-press"],color:c.icon["icon-error"],border:`1px solid ${c.stroke["stroke-error-strong"]}`,cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:`1px solid ${c.stroke["stroke-disabled"]}`,cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},neutral:{default:{...d,background:c.fill["fill-strong"],color:c.icon["icon-strong"],border:`1px solid ${c.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},hover:{...d,background:s?o(c.fill["fill-strong"],.1):r(c.fill["fill-strong"],.1),color:c.icon["icon-strong"],border:`1px solid ${c.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},press:{...d,background:s?o(c.fill["fill-strong"],.2):r(c.fill["fill-strong"],.2),color:c.icon["icon-strong"],border:`1px solid ${c.stroke["stroke-primary-strong"]}`,cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:`1px solid ${c.stroke["stroke-disabled"]}`,cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},inverse:{default:{...d,background:c.fill["fill-inverse-strong"],color:c.icon["icon-inverse-strong"],border:`1px solid ${c.stroke["stroke-inverse-strong"]}`,cursor:"pointer",opacity:1},hover:{...d,background:s?o(c.fill["fill-inverse-strong"],.1):r(c.fill["fill-inverse-strong"],.1),color:c.icon["icon-inverse-strong"],border:`1px solid ${c.stroke["stroke-inverse-strong"]}`,cursor:"pointer",opacity:1},press:{...d,background:s?o(c.fill["fill-inverse-strong"],.2):r(c.fill["fill-inverse-strong"],.2),color:c.icon["icon-inverse-strong"],border:`1px solid ${c.stroke["stroke-inverse-strong"]}`,cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:`1px solid ${c.stroke["stroke-disabled"]}`,cursor:"not-allowed",opacity:.5}}},tertiary:{brand:{default:{...d,boxShadow:"none",background:"transparent",color:c.icon["icon-primary"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:c.fill["fill-hover"],color:c.icon["icon-primary"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:c.fill["fill-press"],color:c.icon["icon-primary"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},destructive:{default:{...d,boxShadow:"none",background:"transparent",color:c.icon["icon-error"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:c.fill["fill-hover"],color:c.icon["icon-error"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:c.fill["fill-press"],color:c.icon["icon-error"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",opacity:.5}},neutral:{default:{...d,boxShadow:"none",background:"transparent",color:c.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:c.fill["fill-hover"],color:c.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:c.fill["fill-press"],color:c.icon["icon-strong"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}},inverse:{default:{...d,boxShadow:"none",background:"transparent",color:c.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},hover:{...d,background:c.fill["fill-hover"],color:c.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},press:{...d,background:c.fill["fill-press"],color:c.icon["icon-inverse-strong"],border:"none",cursor:"pointer",opacity:1},disabled:{...d,background:c.fill["fill-disabled"],color:c.icon["icon-disabled"],border:"none",cursor:"not-allowed",pointerEvents:"auto",opacity:.5}}}};return{...a.generic,...a[n][e in a[n]?e:"brand"]}};export{i as default};
1
+ import"@mui/material/styles";const o=(o,r="primary",e="brand")=>{const l=o.palette.semantic,i={borderRadius:o.radius["radius-8"],boxShadow:o.customShadows.raised,boxSizing:"border-box",cursor:"pointer",minWidth:0,opacity:1,overflow:"hidden",padding:0,position:"relative",transition:"all 0.2s ease-in-out"},n={borderRadius:"inherit",borderStyle:"solid",borderWidth:1,content:'""',inset:0,pointerEvents:"none",position:"absolute"},s={boxShadow:"none",cursor:"not-allowed",pointerEvents:"auto"},d={primary:{brand:{default:{...i,background:l.fill["fill-primary-strong"],color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,background:l.fill["fill-disabled"],color:l.icon["icon-inverse"]}},neutral:{default:{...i,background:l.fill["fill-strong"],color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-inverse-hover"]},press:{background:l.fill["fill-inverse-press"]},disabled:{...s,background:l.fill["fill-disabled"],color:l.icon["icon-inverse"]}},destructive:{default:{...i,background:l.fill["fill-error-strong"],color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,background:l.fill["fill-disabled"],color:l.icon["icon-inverse"]}},inverse:{default:{...i,background:l.fill["fill-inverse-strong"],color:l.icon["icon-strong"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,background:l.fill["fill-inverse-disabled"],color:l.icon["icon-strong"]}}},secondary:{brand:{default:{...i,color:l.icon["icon-primary"],"&::before":{...n,borderColor:l.stroke["stroke-primary-strong"]}},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"],"&::before":{borderColor:l.stroke["stroke-disabled"]}}},neutral:{default:{...i,color:l.icon["icon-strong"],"&::before":{...n,borderColor:l.stroke["stroke-strong"]}},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"],"&::before":{borderColor:l.stroke["stroke-disabled"]}}},destructive:{default:{...i,color:l.icon["icon-error"],"&::before":{...n,borderColor:l.stroke["stroke-error-strong"]}},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"],"&::before":{borderColor:l.stroke["stroke-disabled"]}}},inverse:{default:{...i,color:l.icon["icon-inverse"],"&::before":{...n,borderColor:l.stroke["stroke-inverse-strong"]}},hover:{background:l.fill["fill-inverse-hover"]},press:{background:l.fill["fill-inverse-press"]},disabled:{...s,color:l.icon["icon-inverse-disabled"],"&::before":{borderColor:l.stroke["stroke-inverse-disabled"]}}}},tertiary:{brand:{default:{...i,boxShadow:"none",color:l.icon["icon-primary"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"]}},neutral:{default:{...i,boxShadow:"none",color:l.icon["icon-strong"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"]}},destructive:{default:{...i,boxShadow:"none",color:l.icon["icon-error"]},hover:{background:l.fill["fill-hover"]},press:{background:l.fill["fill-press"]},disabled:{...s,color:l.icon["icon-disabled"]}},inverse:{default:{...i,boxShadow:"none",color:l.icon["icon-inverse"]},hover:{background:l.fill["fill-inverse-hover"]},press:{background:l.fill["fill-inverse-press"]},disabled:{...s,color:l.icon["icon-inverse-disabled"]}}}};return d[r][e in d[r]?e:"brand"]};export{o as default};
2
2
  //# sourceMappingURL=getIconButtonStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"getIconButtonStyles.js","sources":["../../../../src/components/atoms/IconButton/getIconButtonStyles.ts"],"sourcesContent":["import { darken, lighten, type Theme } from '@mui/material/styles';\n\nexport type IconButtonVariant = 'primary' | 'secondary' | 'tertiary';\nexport type IconButtonTone = 'brand' | 'destructive' | 'inverse' | 'neutral';\nexport type IconButtonState = 'default' | 'disabled' | 'focus' | 'hover' | 'press';\n\ninterface StyleObject {\n [property: string]: number | string | undefined;\n}\ninterface IconButtonStyles {\n default?: StyleObject;\n disabled?: StyleObject;\n focus?: StyleObject;\n hover?: StyleObject;\n press?: StyleObject;\n}\n\nconst getIconButtonStyles = (\n theme: Theme,\n variant: IconButtonVariant = 'primary',\n tone: IconButtonTone = 'brand',\n size: 'medium' | 'small' = 'medium'\n): IconButtonStyles => {\n const isLight = theme.palette.mode === 'light';\n const palette = theme.palette.semantic;\n const radius = theme.radius['radius-8'] || 8;\n const boxShadow = theme.customShadows?.raised || '0px 1px 2px 0px rgba(0,0,0,0.1), 0px 2px 6px 0px rgba(0,0,0,0.15)';\n const sizePx = size === 'small' ? 32 : 48;\n\n const shared = {\n borderRadius: radius,\n width: sizePx,\n height: sizePx,\n boxShadow,\n minWidth: 0,\n padding: 0,\n position: 'relative',\n transition: 'all 0.2s ease-in-out',\n };\n\n const variants = {\n generic: {\n focus: {\n outlineOffset: '2px',\n outline: `2px solid ${theme.palette.semantic.stroke['stroke-focus']}`,\n transition: 'none',\n },\n },\n primary: {\n brand: {\n default: {\n ...shared,\n background: palette.fill['fill-primary-strong'],\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-primary-strong'], 0.1) : lighten(palette.fill['fill-primary-strong'], 0.1),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-primary-strong'], 0.2) : lighten(palette.fill['fill-primary-strong'], 0.2),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n neutral: {\n default: {\n ...shared,\n background: palette.fill['fill-strong'],\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? lighten(palette.fill['fill-strong'], 0.1) : darken(palette.fill['fill-strong'], 0.1),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? lighten(palette.fill['fill-strong'], 0.2) : darken(palette.fill['fill-strong'], 0.2),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n destructive: {\n default: {\n ...shared,\n background: palette.fill['fill-error-strong'],\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-error-strong'], 0.1) : lighten(palette.fill['fill-error-strong'], 0.1),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-error-strong'], 0.2) : lighten(palette.fill['fill-error-strong'], 0.2),\n color: palette.icon['icon-inverse'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n inverse: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.1) : lighten(palette.fill['fill-inverse-strong'], 0.1),\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.2) : lighten(palette.fill['fill-inverse-strong'], 0.2),\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n },\n secondary: {\n brand: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-primary'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-primary'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-primary'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n destructive: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-error'],\n border: `1px solid ${palette.stroke['stroke-error-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-error'],\n border: `1px solid ${palette.stroke['stroke-error-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-error'],\n border: `1px solid ${palette.stroke['stroke-error-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n neutral: {\n default: {\n ...shared,\n background: palette.fill['fill-strong'],\n color: palette.icon['icon-strong'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-strong'], 0.1) : lighten(palette.fill['fill-strong'], 0.1),\n color: palette.icon['icon-strong'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-strong'], 0.2) : lighten(palette.fill['fill-strong'], 0.2),\n color: palette.icon['icon-strong'],\n border: `1px solid ${palette.stroke['stroke-primary-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n inverse: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-inverse-strong'],\n border: `1px solid ${palette.stroke['stroke-inverse-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.1) : lighten(palette.fill['fill-inverse-strong'], 0.1),\n color: palette.icon['icon-inverse-strong'],\n border: `1px solid ${palette.stroke['stroke-inverse-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: isLight ? darken(palette.fill['fill-inverse-strong'], 0.2) : lighten(palette.fill['fill-inverse-strong'], 0.2),\n color: palette.icon['icon-inverse-strong'],\n border: `1px solid ${palette.stroke['stroke-inverse-strong']}`,\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: `1px solid ${palette.stroke['stroke-disabled']}`,\n cursor: 'not-allowed',\n opacity: 0.5,\n },\n },\n },\n tertiary: {\n brand: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-primary'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-primary'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-primary'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n destructive: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-error'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-error'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-error'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n opacity: 0.5,\n },\n },\n neutral: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n inverse: {\n default: {\n ...shared,\n boxShadow: 'none',\n background: 'transparent',\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n hover: {\n ...shared,\n background: palette.fill['fill-hover'],\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n press: {\n ...shared,\n background: palette.fill['fill-press'],\n color: palette.icon['icon-inverse-strong'],\n border: 'none',\n cursor: 'pointer',\n opacity: 1,\n },\n disabled: {\n ...shared,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-disabled'],\n border: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n opacity: 0.5,\n },\n },\n },\n };\n\n // Fallback to brand if tone not found\n const toneKey: IconButtonTone = tone in variants[variant] ? tone : 'brand';\n return { ...variants.generic, ...variants[variant][toneKey] };\n};\n\nexport default getIconButtonStyles;"],"names":["getIconButtonStyles","theme","variant","tone","size","isLight","palette","mode","semantic","sizePx","shared","borderRadius","radius","width","height","boxShadow","customShadows","raised","minWidth","padding","position","transition","variants","generic","focus","outlineOffset","outline","stroke","primary","brand","default","background","fill","color","icon","border","cursor","opacity","hover","darken","lighten","press","disabled","pointerEvents","neutral","destructive","inverse","secondary","tertiary"],"mappings":"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"}
1
+ {"version":3,"file":"getIconButtonStyles.js","sources":["../../../../src/components/atoms/IconButton/getIconButtonStyles.ts"],"sourcesContent":["import { type CSSObject, type Theme } from '@mui/material/styles';\n\n/**\n * The variant of the IconButton.\n * @default 'primary'\n */\nexport type IconButtonVariant = 'primary' | 'secondary' | 'tertiary';\n/**\n * The tone of the IconButton.\n * @default 'brand'\n */\nexport type IconButtonTone = 'brand' | 'destructive' | 'inverse' | 'neutral';\n\ninterface IconButtonStyles {\n default?: CSSObject;\n disabled?: CSSObject;\n hover?: CSSObject;\n press?: CSSObject;\n}\n\n/**\n * Returns the styles for the IconButton states based on the variant and tone.\n * @param theme - The theme object.\n * @param variant - The variant of the IconButton.\n * @param tone - The tone of the IconButton.\n * @returns The styles for the IconButton states based on the variant and tone.\n */\nconst getIconButtonStyles = (\n theme: Theme,\n variant: IconButtonVariant = 'primary',\n tone: IconButtonTone = 'brand',\n): IconButtonStyles => {\n const palette = theme.palette.semantic;\n const radius = theme.radius['radius-8'];\n const boxShadow = theme.customShadows.raised;\n\n const shared = {\n borderRadius: radius,\n boxShadow,\n boxSizing: 'border-box',\n cursor: 'pointer',\n minWidth: 0,\n opacity: 1,\n overflow: 'hidden',\n padding: 0,\n position: 'relative',\n transition: 'all 0.2s ease-in-out',\n } satisfies CSSObject;\n\n const secondaryBorderStyle = {\n borderRadius: 'inherit',\n borderStyle: 'solid',\n borderWidth: 1,\n content: '\"\"',\n inset: 0,\n pointerEvents: 'none',\n position: 'absolute',\n } satisfies CSSObject;\n\n const sharedDisabled = {\n boxShadow: 'none',\n cursor: 'not-allowed',\n pointerEvents: 'auto',\n } satisfies CSSObject;\n\n const variants = {\n primary: {\n brand: {\n default: {\n ...shared,\n background: palette.fill['fill-primary-strong'],\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-inverse'],\n },\n },\n neutral: {\n default: {\n ...shared,\n background: palette.fill['fill-strong'],\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-inverse-hover'],\n },\n press: {\n background: palette.fill['fill-inverse-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-inverse'],\n },\n },\n destructive: {\n default: {\n ...shared,\n background: palette.fill['fill-error-strong'],\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-disabled'],\n color: palette.icon['icon-inverse'],\n },\n },\n inverse: {\n default: {\n ...shared,\n background: palette.fill['fill-inverse-strong'],\n color: palette.icon['icon-strong'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n background: palette.fill['fill-inverse-disabled'],\n color: palette.icon['icon-strong'],\n },\n },\n },\n secondary: {\n brand: {\n default: {\n ...shared,\n color: palette.icon['icon-primary'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-primary-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-disabled'],\n },\n },\n },\n neutral: {\n default: {\n ...shared,\n color: palette.icon['icon-strong'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-disabled'],\n },\n },\n },\n destructive: {\n default: {\n ...shared,\n color: palette.icon['icon-error'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-error-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-disabled'],\n },\n },\n },\n inverse: {\n default: {\n ...shared,\n color: palette.icon['icon-inverse'],\n '&::before': {\n ...secondaryBorderStyle,\n borderColor: palette.stroke['stroke-inverse-strong'],\n },\n },\n hover: {\n background: palette.fill['fill-inverse-hover'],\n },\n press: {\n background: palette.fill['fill-inverse-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-inverse-disabled'],\n '&::before': {\n borderColor: palette.stroke['stroke-inverse-disabled'],\n },\n },\n },\n },\n tertiary: {\n brand: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-primary'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n },\n },\n neutral: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-strong'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n },\n },\n destructive: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-error'],\n },\n hover: {\n background: palette.fill['fill-hover'],\n },\n press: {\n background: palette.fill['fill-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-disabled'],\n },\n },\n inverse: {\n default: {\n ...shared,\n boxShadow: 'none',\n color: palette.icon['icon-inverse'],\n },\n hover: {\n background: palette.fill['fill-inverse-hover'],\n },\n press: {\n background: palette.fill['fill-inverse-press'],\n },\n disabled: {\n ...sharedDisabled,\n color: palette.icon['icon-inverse-disabled'],\n },\n },\n },\n };\n\n // Fallback to brand if tone not found\n const toneKey: IconButtonTone = tone in variants[variant] ? tone : 'brand';\n return variants[variant][toneKey];\n};\n\nexport default getIconButtonStyles;\n"],"names":["getIconButtonStyles","theme","variant","tone","palette","semantic","shared","borderRadius","radius","boxShadow","customShadows","raised","boxSizing","cursor","minWidth","opacity","overflow","padding","position","transition","secondaryBorderStyle","borderStyle","borderWidth","content","inset","pointerEvents","sharedDisabled","variants","primary","brand","default","background","fill","color","icon","hover","press","disabled","neutral","destructive","inverse","secondary","borderColor","stroke","tertiary"],"mappings":"6BA2BA,MAAMA,EAAsB,CAC1BC,EACAC,EAA6B,UAC7BC,EAAuB,WAEvB,MAAMC,EAAUH,EAAMG,QAAQC,SAIxBC,EAAS,CACbC,aAJaN,EAAMO,OAAO,YAK1BC,UAJgBR,EAAMS,cAAcC,OAKpCC,UAAW,aACXC,OAAQ,UACRC,SAAU,EACVC,QAAS,EACTC,SAAU,SACVC,QAAS,EACTC,SAAU,WACVC,WAAY,wBAGRC,EAAuB,CAC3Bb,aAAc,UACdc,YAAa,QACbC,YAAa,EACbC,QAAS,KACTC,MAAO,EACPC,cAAe,OACfP,SAAU,YAGNQ,EAAiB,CACrBjB,UAAW,OACXI,OAAQ,cACRY,cAAe,QAGXE,EAAW,CACfC,QAAS,CACPC,MAAO,CACLC,QAAS,IACJxB,EACHyB,WAAY3B,EAAQ4B,KAAK,uBACzBC,MAAO7B,EAAQ8B,KAAK,iBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHK,WAAY3B,EAAQ4B,KAAK,iBACzBC,MAAO7B,EAAQ8B,KAAK,kBAGxBI,QAAS,CACPR,QAAS,IACJxB,EACHyB,WAAY3B,EAAQ4B,KAAK,eACzBC,MAAO7B,EAAQ8B,KAAK,iBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,uBAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,uBAE3BK,SAAU,IACLX,EACHK,WAAY3B,EAAQ4B,KAAK,iBACzBC,MAAO7B,EAAQ8B,KAAK,kBAGxBK,YAAa,CACXT,QAAS,IACJxB,EACHyB,WAAY3B,EAAQ4B,KAAK,qBACzBC,MAAO7B,EAAQ8B,KAAK,iBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHK,WAAY3B,EAAQ4B,KAAK,iBACzBC,MAAO7B,EAAQ8B,KAAK,kBAGxBM,QAAS,CACPV,QAAS,IACJxB,EACHyB,WAAY3B,EAAQ4B,KAAK,uBACzBC,MAAO7B,EAAQ8B,KAAK,gBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHK,WAAY3B,EAAQ4B,KAAK,yBACzBC,MAAO7B,EAAQ8B,KAAK,kBAI1BO,UAAW,CACTZ,MAAO,CACLC,QAAS,IACJxB,EACH2B,MAAO7B,EAAQ8B,KAAK,gBACpB,YAAa,IACRd,EACHsB,YAAatC,EAAQuC,OAAO,2BAGhCR,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,iBACpB,YAAa,CACXQ,YAAatC,EAAQuC,OAAO,sBAIlCL,QAAS,CACPR,QAAS,IACJxB,EACH2B,MAAO7B,EAAQ8B,KAAK,eACpB,YAAa,IACRd,EACHsB,YAAatC,EAAQuC,OAAO,mBAGhCR,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,iBACpB,YAAa,CACXQ,YAAatC,EAAQuC,OAAO,sBAIlCJ,YAAa,CACXT,QAAS,IACJxB,EACH2B,MAAO7B,EAAQ8B,KAAK,cACpB,YAAa,IACRd,EACHsB,YAAatC,EAAQuC,OAAO,yBAGhCR,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,iBACpB,YAAa,CACXQ,YAAatC,EAAQuC,OAAO,sBAIlCH,QAAS,CACPV,QAAS,IACJxB,EACH2B,MAAO7B,EAAQ8B,KAAK,gBACpB,YAAa,IACRd,EACHsB,YAAatC,EAAQuC,OAAO,2BAGhCR,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,uBAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,uBAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,yBACpB,YAAa,CACXQ,YAAatC,EAAQuC,OAAO,+BAKpCC,SAAU,CACRf,MAAO,CACLC,QAAS,IACJxB,EACHG,UAAW,OACXwB,MAAO7B,EAAQ8B,KAAK,iBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,mBAGxBI,QAAS,CACPR,QAAS,IACJxB,EACHG,UAAW,OACXwB,MAAO7B,EAAQ8B,KAAK,gBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,mBAGxBK,YAAa,CACXT,QAAS,IACJxB,EACHG,UAAW,OACXwB,MAAO7B,EAAQ8B,KAAK,eAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,eAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,eAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,mBAGxBM,QAAS,CACPV,QAAS,IACJxB,EACHG,UAAW,OACXwB,MAAO7B,EAAQ8B,KAAK,iBAEtBC,MAAO,CACLJ,WAAY3B,EAAQ4B,KAAK,uBAE3BI,MAAO,CACLL,WAAY3B,EAAQ4B,KAAK,uBAE3BK,SAAU,IACLX,EACHO,MAAO7B,EAAQ8B,KAAK,6BAQ5B,OAAOP,EAASzB,GADgBC,KAAQwB,EAASzB,GAAWC,EAAO"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material/IconButton"),a=require("@mui/material/styles"),r=require("../BadgeCount/index.cjs.js"),o=require("../BadgeDot/index.cjs.js"),s=require("./getIconButtonStyles.cjs.js");const d=a.styled(i,{shouldForwardProp:e=>!["variant","tone","state","badgeDot","badgeCount","fdKey","size"].includes(e)})((({theme:e,variant:t="primary",tone:i="brand",size:a="medium"})=>{const r=s(e,t,i,a);return{...r.default,"&:hover":r.hover,"&:active":r.press,"&:focus-visible":r.focus,"&.Mui-disabled":r.disabled,"& > svg":{color:r.default?.color||"inherit",verticalAlign:"middle",pointerEvents:"none"}}})),n=a.styled(r)((()=>({position:"absolute",top:-8,right:-8}))),l=a.styled(o)((()=>({position:"absolute",top:8,right:8}))),u=t.forwardRef((({children:t,badgeCount:i,variant:a="primary",tone:r="brand",fdKey:o,className:s,disabled:u=!1,onClick:c,badgeDot:b=!1,size:m="medium",...p},v)=>e.jsxs(d,{ref:v,disableRipple:!0,className:s,"data-fd":o,"data-tone":r,"data-variant":a,disabled:u,onClick:c,size:m,tone:r,variant:a,...p,children:[t,!!i&&e.jsx(n,{"data-testid":"icon-button-badge-count",children:i}),b&&e.jsx(l,{"data-testid":"icon-button-badge-dot"})]})));u.displayName="IconButton",exports.IconButton=u,exports.default=u;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material/IconButton"),a=require("@mui/material/styles"),s=require("../BadgeCount/index.cjs.js"),n=require("../BadgeDot/index.cjs.js"),r=require("@mui/material/Box"),o=require("./getIconButtonStyles.cjs.js");const d=a.styled(i,{shouldForwardProp:e=>!["variant","tone","badgeDot","badgeCount","fdKey"].includes(e)})((({theme:e,variant:t="primary",tone:i="brand"})=>{const a=o(e,t,i),s="inverse"===i?e.palette.semantic.stroke["stroke-inverse-strong"]:e.palette.semantic.stroke["stroke-focus"];return{...a.default,overflow:"visible","&.Mui-disabled":{...a.disabled,overflow:"visible"},"&.Mui-focusVisible":{outlineColor:s}}})),l=a.styled(r,{shouldForwardProp:e=>!["variant","tone"].includes(e)})((({theme:e,variant:t="primary",tone:i="brand"})=>{const a=o(e,t,i);return{alignItems:"center",borderRadius:"inherit",display:"flex",height:"100%",justifyContent:"center",overflow:"hidden",pointerEvents:"none",width:"100%","[data-variant]:hover:not(.Mui-disabled) > &":a.hover,"[data-variant]:active:not(.Mui-disabled) > &":a.press}})),u=a.styled(s,{shouldForwardProp:e=>!["size"].includes(e)})((({theme:e,size:t})=>({position:"absolute",bottom:"small"===t?e.spacing(2.5):e.spacing(4),left:"small"===t?e.spacing(2.5):e.spacing(4),zIndex:1,pointerEvents:"none"}))),c=a.styled(n,{shouldForwardProp:e=>!["size"].includes(e)})((({theme:e,size:t})=>({position:"absolute",bottom:"small"===t?e.spacing(2.5):e.spacing(4),left:"small"===t?e.spacing(2.5):e.spacing(4),zIndex:1,pointerEvents:"none"}))),p=t.forwardRef((({badgeCount:t,badgeDot:i=!1,children:a,className:s,disabled:n=!1,fdKey:r,onClick:o,size:p="medium",tone:m="brand",variant:b="primary",...v},g)=>e.jsxs(d,{ref:g,disableRipple:!0,className:s,"data-fd":r,"data-tone":m,"data-variant":b,disabled:n,onClick:o,size:p,tone:m,variant:b,...v,children:[e.jsx(l,{tone:m,variant:b,children:a}),!!t&&e.jsx(u,{"data-testid":"icon-button-badge-count",size:p,children:t}),i&&!t&&e.jsx(c,{"data-testid":"icon-button-badge-dot",size:p})]})));p.displayName="IconButton",exports.IconButton=p,exports.default=p;
2
2
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/IconButton/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport MuiIconButton, { type IconButtonProps as MuiIconButtonProps } from '@mui/material/IconButton';\nimport { styled } from '@mui/material/styles';\n\nimport BadgeCount from '../BadgeCount';\nimport BadgeDot from '../BadgeDot';\nimport getIconButtonStyles, { type IconButtonState, type IconButtonTone, type IconButtonVariant } from './getIconButtonStyles';\n\n/**\n * Custom IconButton atom for Flipdish design system.\n * - icon: The icon to display (required, use local icon library)\n * - badgeDot: Show a small dot badge (optional)\n * - badgeCount: Show a count badge (optional)\n * - variant: Visual style (primary | secondary | tertiary)\n * - tone: Visual tone (brand | destructive | inverse | neutral)\n * - state: Visual state (default | disabled | focus | hover | press)\n * - aria-label: Accessibility label\n * - fdKey: Data attribute for testing/analytics\n * - ...rest: All other props are passed to MuiIconButton\n */\nexport interface IconButtonProps extends Omit<MuiIconButtonProps, 'color'> {\n badgeCount?: number;\n badgeDot?: boolean;\n className?: string;\n disabled?: boolean;\n fdKey?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n size?: 'medium' | 'small';\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n children: React.ReactNode;\n 'aria-label': string;\n}\n\nconst StyledIconButton = styled(MuiIconButton, {\n shouldForwardProp: (prop) =>\n !['variant', 'tone', 'state', 'badgeDot', 'badgeCount', 'fdKey', 'size'].includes(prop as string),\n})<{\n size?: 'medium' | 'small';\n state?: IconButtonState;\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n iconColor?: string;\n}>(({ theme, variant = 'primary', tone = 'brand', size = 'medium' }) => {\n const styles = getIconButtonStyles(theme, variant, tone, size);\n return {\n ...styles.default,\n '&:hover': styles.hover,\n '&:active': styles.press,\n '&:focus-visible': styles.focus,\n '&.Mui-disabled': styles.disabled,\n // Style the child SVG icon\n '& > svg': {\n color: (styles.default?.['color']) || 'inherit',\n verticalAlign: 'middle',\n pointerEvents: 'none',\n },\n };\n});\n\nconst StyledBadgeCount = styled(BadgeCount)(() => ({\n position: 'absolute',\n top: -8,\n right: -8,\n}));\n\nconst StyledBadgeDot = styled(BadgeDot)(() => ({\n position: 'absolute',\n top: 8,\n right: 8,\n}));\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n (\n {\n children,\n badgeCount,\n variant = 'primary',\n tone = 'brand',\n fdKey,\n className,\n disabled = false,\n onClick,\n badgeDot = false,\n size = 'medium',\n ...rest\n },\n ref\n ) => {\n return (\n <StyledIconButton\n ref={ref}\n disableRipple\n className={className}\n data-fd={fdKey}\n data-tone={tone}\n data-variant={variant}\n disabled={disabled}\n onClick={onClick}\n size={size}\n tone={tone}\n variant={variant}\n {...rest}\n >\n {children}\n {!!badgeCount && <StyledBadgeCount data-testid=\"icon-button-badge-count\">{badgeCount}</StyledBadgeCount>}\n {badgeDot && <StyledBadgeDot data-testid=\"icon-button-badge-dot\" />}\n </StyledIconButton>\n );\n }\n);\n\nIconButton.displayName = 'IconButton';\n\nexport default IconButton;\n"],"names":["StyledIconButton","styled","MuiIconButton","shouldForwardProp","prop","includes","theme","variant","tone","size","styles","getIconButtonStyles","default","hover","press","focus","disabled","color","verticalAlign","pointerEvents","StyledBadgeCount","BadgeCount","position","top","right","StyledBadgeDot","BadgeDot","IconButton","forwardRef","children","badgeCount","fdKey","className","onClick","badgeDot","rest","ref","_jsxs","disableRipple","_jsx","displayName"],"mappings":"0TAmCA,MAAMA,EAAmBC,EAAAA,OAAOC,EAAe,CAC7CC,kBAAoBC,IACjB,CAAC,UAAW,OAAQ,QAAS,WAAY,aAAc,QAAS,QAAQC,SAASD,IAF7DH,EAStB,EAAGK,QAAOC,UAAU,UAAWC,OAAO,QAASC,OAAO,aACvD,MAAMC,EAASC,EAAoBL,EAAOC,EAASC,EAAMC,GACzD,MAAO,IACFC,EAAOE,QACV,UAAWF,EAAOG,MAClB,WAAYH,EAAOI,MACnB,kBAAmBJ,EAAOK,MAC1B,iBAAkBL,EAAOM,SAEzB,UAAW,CACTC,MAAQP,EAAOE,SAAiB,OAAM,UACtCM,cAAe,SACfC,cAAe,YAKfC,EAAmBnB,EAAAA,OAAOoB,EAAPpB,EAAmB,KAAA,CAC1CqB,SAAU,WACVC,KAAK,EACLC,OAAO,MAGHC,EAAiBxB,EAAAA,OAAOyB,EAAPzB,EAAiB,KAAA,CACtCqB,SAAU,WACVC,IAAK,EACLC,MAAO,MAGIG,EAAaC,EAAAA,YACxB,EAEIC,WACAC,aACAvB,UAAU,UACVC,OAAO,QACPuB,QACAC,YACAhB,YAAW,EACXiB,UACAC,YAAW,EACXzB,OAAO,YACJ0B,GAELC,IAGEC,EAAAA,KAACrC,EAAgB,CACfoC,IAAKA,EACLE,eAAa,EACbN,UAAWA,EAAS,UACXD,EAAK,YACHvB,EAAI,eACDD,EACdS,SAAUA,EACViB,QAASA,EACTxB,KAAMA,EACND,KAAMA,EACND,QAASA,KACL4B,EAAIN,SAAA,CAEPA,IACEC,GAAcS,EAAAA,IAACnB,EAAgB,CAAA,cAAa,0BAAyBS,SAAEC,IACzEI,GAAYK,EAAAA,IAACd,EAAc,CAAA,cAAa,+BAMjDE,EAAWa,YAAc"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/IconButton/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport MuiIconButton, { type IconButtonProps as MuiIconButtonProps } from '@mui/material/IconButton';\nimport { styled } from '@mui/material/styles';\n\nimport BadgeCount from '../BadgeCount';\nimport BadgeDot from '../BadgeDot';\nimport Box from '../Box';\nimport getIconButtonStyles, { type IconButtonTone, type IconButtonVariant } from './getIconButtonStyles';\n\n/**\n * Custom IconButton atom for Flipdish design system.\n * - icon: The icon to display (required, use local icon library)\n * - badgeDot: Show a small dot badge (optional)\n * - badgeCount: Show a count badge (optional)\n * - variant: Visual style (primary | secondary | tertiary)\n * - tone: Visual tone (brand | destructive | inverse | neutral)\n * - state: Visual state (default | disabled | focus | hover | press)\n * - aria-label: Accessibility label\n * - fdKey: Data attribute for testing/analytics\n * - ...rest: All other props are passed to MuiIconButton\n */\nexport interface IconButtonProps extends Omit<MuiIconButtonProps, 'color'> {\n 'aria-label': string;\n badgeCount?: number;\n badgeDot?: boolean;\n children: React.ReactNode;\n className?: string;\n disabled?: boolean;\n fdKey?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n size?: 'medium' | 'small';\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n}\n\nconst StyledIconButton = styled(MuiIconButton, {\n shouldForwardProp: (prop) =>\n !['variant', 'tone', 'badgeDot', 'badgeCount', 'fdKey'].includes(prop as string),\n})<{\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n iconColor?: string;\n}>(({ theme, variant = 'primary', tone = 'brand' }) => {\n const styles = getIconButtonStyles(theme, variant, tone);\n const focusColor =\n tone === 'inverse'\n ? theme.palette.semantic.stroke['stroke-inverse-strong']\n : theme.palette.semantic.stroke['stroke-focus'];\n\n return {\n ...styles.default,\n overflow: 'visible', // Allow badges to overflow\n '&.Mui-disabled': { ...styles.disabled, overflow: 'visible' },\n '&.Mui-focusVisible': {\n outlineColor: focusColor,\n },\n };\n});\n\nconst StyledBox = styled(Box, {\n shouldForwardProp: (prop) => !['variant', 'tone'].includes(prop as string),\n})<{ variant: IconButtonVariant; tone: IconButtonTone }>(({ theme, variant = 'primary', tone = 'brand' }) => {\n const styles = getIconButtonStyles(theme, variant, tone);\n\n return {\n alignItems: 'center',\n borderRadius: 'inherit',\n display: 'flex',\n height: '100%',\n justifyContent: 'center',\n overflow: 'hidden',\n pointerEvents: 'none',\n width: '100%',\n '[data-variant]:hover:not(.Mui-disabled) > &': styles.hover,\n '[data-variant]:active:not(.Mui-disabled) > &': styles.press,\n };\n});\n\nconst StyledBadgeCount = styled(BadgeCount, {\n shouldForwardProp: (prop) => !['size'].includes(prop as string),\n})<{ size: 'medium' | 'small' }>(({ theme, size }) => ({\n position: 'absolute',\n bottom: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n left: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n zIndex: 1,\n pointerEvents: 'none',\n}));\n\nconst StyledBadgeDot = styled(BadgeDot, {\n shouldForwardProp: (prop) => !['size'].includes(prop as string),\n})<{ size: 'medium' | 'small' }>(({ theme, size }) => ({\n position: 'absolute',\n bottom: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n left: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n zIndex: 1,\n pointerEvents: 'none',\n}));\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n (\n {\n badgeCount,\n badgeDot = false,\n children,\n className,\n disabled = false,\n fdKey,\n onClick,\n size = 'medium',\n tone = 'brand',\n variant = 'primary',\n ...rest\n },\n ref,\n ) => {\n return (\n <StyledIconButton\n ref={ref}\n disableRipple\n className={className}\n data-fd={fdKey}\n data-tone={tone}\n data-variant={variant}\n disabled={disabled}\n onClick={onClick}\n size={size}\n tone={tone}\n variant={variant}\n {...rest}\n >\n <StyledBox tone={tone} variant={variant}>\n {children}\n </StyledBox>\n {!!badgeCount && (\n <StyledBadgeCount data-testid=\"icon-button-badge-count\" size={size}>\n {badgeCount}\n </StyledBadgeCount>\n )}\n\n {badgeDot && !badgeCount && <StyledBadgeDot data-testid=\"icon-button-badge-dot\" size={size} />}\n </StyledIconButton>\n );\n },\n);\n\nIconButton.displayName = 'IconButton';\n\nexport default IconButton;\n"],"names":["StyledIconButton","styled","MuiIconButton","shouldForwardProp","prop","includes","theme","variant","tone","styles","getIconButtonStyles","focusColor","palette","semantic","stroke","default","overflow","disabled","outlineColor","StyledBox","Box","alignItems","borderRadius","display","height","justifyContent","pointerEvents","width","hover","press","StyledBadgeCount","BadgeCount","size","position","bottom","spacing","left","zIndex","StyledBadgeDot","BadgeDot","IconButton","forwardRef","badgeCount","badgeDot","children","className","fdKey","onClick","rest","ref","_jsxs","disableRipple","_jsx","displayName"],"mappings":"yVAoCA,MAAMA,EAAmBC,EAAAA,OAAOC,EAAe,CAC7CC,kBAAoBC,IACjB,CAAC,UAAW,OAAQ,WAAY,aAAc,SAASC,SAASD,IAF5CH,EAOtB,EAAGK,QAAOC,UAAU,UAAWC,OAAO,YACvC,MAAMC,EAASC,EAAoBJ,EAAOC,EAASC,GAC7CG,EACK,YAATH,EACIF,EAAMM,QAAQC,SAASC,OAAO,yBAC9BR,EAAMM,QAAQC,SAASC,OAAO,gBAEpC,MAAO,IACFL,EAAOM,QACVC,SAAU,UACV,iBAAkB,IAAKP,EAAOQ,SAAUD,SAAU,WAClD,qBAAsB,CACpBE,aAAcP,OAKdQ,EAAYlB,EAAAA,OAAOmB,EAAK,CAC5BjB,kBAAoBC,IAAU,CAAC,UAAW,QAAQC,SAASD,IAD3CH,EAEuC,EAAGK,QAAOC,UAAU,UAAWC,OAAO,YAC7F,MAAMC,EAASC,EAAoBJ,EAAOC,EAASC,GAEnD,MAAO,CACLa,WAAY,SACZC,aAAc,UACdC,QAAS,OACTC,OAAQ,OACRC,eAAgB,SAChBT,SAAU,SACVU,cAAe,OACfC,MAAO,OACP,8CAA+ClB,EAAOmB,MACtD,+CAAgDnB,EAAOoB,UAIrDC,EAAmB7B,EAAAA,OAAO8B,EAAY,CAC1C5B,kBAAoBC,IAAU,CAAC,QAAQC,SAASD,IADzBH,EAEQ,EAAGK,QAAO0B,WAAM,CAC/CC,SAAU,WACVC,OAAiB,UAATF,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC9DC,KAAe,UAATJ,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC5DE,OAAQ,EACRX,cAAe,WAGXY,EAAiBrC,EAAAA,OAAOsC,EAAU,CACtCpC,kBAAoBC,IAAU,CAAC,QAAQC,SAASD,IAD3BH,EAEU,EAAGK,QAAO0B,WAAM,CAC/CC,SAAU,WACVC,OAAiB,UAATF,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC9DC,KAAe,UAATJ,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC5DE,OAAQ,EACRX,cAAe,WAGJc,EAAaC,EAAAA,YACxB,EAEIC,aACAC,YAAW,EACXC,WACAC,YACA5B,YAAW,EACX6B,QACAC,UACAf,OAAO,SACPxB,OAAO,QACPD,UAAU,aACPyC,GAELC,IAGEC,EAAAA,KAAClD,GACCiD,IAAKA,EACLE,iBACAN,UAAWA,EAAS,UACXC,cACEtC,EAAI,eACDD,EACdU,SAAUA,EACV8B,QAASA,EACTf,KAAMA,EACNxB,KAAMA,EACND,QAASA,KACLyC,EAAIJ,SAAA,CAERQ,EAAAA,IAACjC,EAAS,CAACX,KAAMA,EAAMD,QAASA,EAAOqC,SACpCA,MAEAF,GACDU,EAAAA,IAACtB,EAAgB,CAAA,cAAa,0BAA0BE,KAAMA,EAAIY,SAC/DF,IAIJC,IAAaD,GAAcU,EAAAA,IAACd,EAAc,CAAA,cAAa,wBAAwBN,KAAMA,SAM9FQ,EAAWa,YAAc"}
@@ -15,8 +15,10 @@ import { IconButtonTone, IconButtonVariant } from './getIconButtonStyles.js';
15
15
  * - ...rest: All other props are passed to MuiIconButton
16
16
  */
17
17
  interface IconButtonProps extends Omit<IconButtonProps$1, 'color'> {
18
+ 'aria-label': string;
18
19
  badgeCount?: number;
19
20
  badgeDot?: boolean;
21
+ children: React.ReactNode;
20
22
  className?: string;
21
23
  disabled?: boolean;
22
24
  fdKey?: string;
@@ -24,8 +26,6 @@ interface IconButtonProps extends Omit<IconButtonProps$1, 'color'> {
24
26
  size?: 'medium' | 'small';
25
27
  tone?: IconButtonTone;
26
28
  variant?: IconButtonVariant;
27
- children: React.ReactNode;
28
- 'aria-label': string;
29
29
  }
30
30
  declare const IconButton: react.ForwardRefExoticComponent<Omit<IconButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
31
31
 
@@ -1,2 +1,2 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import{forwardRef as o}from"react";import i from"@mui/material/IconButton";import{styled as a}from"@mui/material/styles";import r from"../BadgeCount/index.js";import d from"../BadgeDot/index.js";import n from"./getIconButtonStyles.js";const s=a(i,{shouldForwardProp:t=>!["variant","tone","state","badgeDot","badgeCount","fdKey","size"].includes(t)})((({theme:t,variant:e="primary",tone:o="brand",size:i="medium"})=>{const a=n(t,e,o,i);return{...a.default,"&:hover":a.hover,"&:active":a.press,"&:focus-visible":a.focus,"&.Mui-disabled":a.disabled,"& > svg":{color:a.default?.color||"inherit",verticalAlign:"middle",pointerEvents:"none"}}})),l=a(r)((()=>({position:"absolute",top:-8,right:-8}))),m=a(d)((()=>({position:"absolute",top:8,right:8}))),u=o((({children:o,badgeCount:i,variant:a="primary",tone:r="brand",fdKey:d,className:n,disabled:u=!1,onClick:c,badgeDot:p=!1,size:b="medium",...f},g)=>t(s,{ref:g,disableRipple:!0,className:n,"data-fd":d,"data-tone":r,"data-variant":a,disabled:u,onClick:c,size:b,tone:r,variant:a,...f,children:[o,!!i&&e(l,{"data-testid":"icon-button-badge-count",children:i}),p&&e(m,{"data-testid":"icon-button-badge-dot"})]})));u.displayName="IconButton";export{u as IconButton,u as default};
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{forwardRef as i}from"react";import o from"@mui/material/IconButton";import{styled as a}from"@mui/material/styles";import n from"../BadgeCount/index.js";import r from"../BadgeDot/index.js";import s from"@mui/material/Box";import d from"./getIconButtonStyles.js";const l=a(o,{shouldForwardProp:e=>!["variant","tone","badgeDot","badgeCount","fdKey"].includes(e)})((({theme:e,variant:t="primary",tone:i="brand"})=>{const o=d(e,t,i),a="inverse"===i?e.palette.semantic.stroke["stroke-inverse-strong"]:e.palette.semantic.stroke["stroke-focus"];return{...o.default,overflow:"visible","&.Mui-disabled":{...o.disabled,overflow:"visible"},"&.Mui-focusVisible":{outlineColor:a}}})),m=a(s,{shouldForwardProp:e=>!["variant","tone"].includes(e)})((({theme:e,variant:t="primary",tone:i="brand"})=>{const o=d(e,t,i);return{alignItems:"center",borderRadius:"inherit",display:"flex",height:"100%",justifyContent:"center",overflow:"hidden",pointerEvents:"none",width:"100%","[data-variant]:hover:not(.Mui-disabled) > &":o.hover,"[data-variant]:active:not(.Mui-disabled) > &":o.press}})),c=a(n,{shouldForwardProp:e=>!["size"].includes(e)})((({theme:e,size:t})=>({position:"absolute",bottom:"small"===t?e.spacing(2.5):e.spacing(4),left:"small"===t?e.spacing(2.5):e.spacing(4),zIndex:1,pointerEvents:"none"}))),u=a(r,{shouldForwardProp:e=>!["size"].includes(e)})((({theme:e,size:t})=>({position:"absolute",bottom:"small"===t?e.spacing(2.5):e.spacing(4),left:"small"===t?e.spacing(2.5):e.spacing(4),zIndex:1,pointerEvents:"none"}))),p=i((({badgeCount:i,badgeDot:o=!1,children:a,className:n,disabled:r=!1,fdKey:s,onClick:d,size:p="medium",tone:b="brand",variant:f="primary",...v},g)=>e(l,{ref:g,disableRipple:!0,className:n,"data-fd":s,"data-tone":b,"data-variant":f,disabled:r,onClick:d,size:p,tone:b,variant:f,...v,children:[t(m,{tone:b,variant:f,children:a}),!!i&&t(c,{"data-testid":"icon-button-badge-count",size:p,children:i}),o&&!i&&t(u,{"data-testid":"icon-button-badge-dot",size:p})]})));p.displayName="IconButton";export{p as IconButton,p as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../src/components/atoms/IconButton/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport MuiIconButton, { type IconButtonProps as MuiIconButtonProps } from '@mui/material/IconButton';\nimport { styled } from '@mui/material/styles';\n\nimport BadgeCount from '../BadgeCount';\nimport BadgeDot from '../BadgeDot';\nimport getIconButtonStyles, { type IconButtonState, type IconButtonTone, type IconButtonVariant } from './getIconButtonStyles';\n\n/**\n * Custom IconButton atom for Flipdish design system.\n * - icon: The icon to display (required, use local icon library)\n * - badgeDot: Show a small dot badge (optional)\n * - badgeCount: Show a count badge (optional)\n * - variant: Visual style (primary | secondary | tertiary)\n * - tone: Visual tone (brand | destructive | inverse | neutral)\n * - state: Visual state (default | disabled | focus | hover | press)\n * - aria-label: Accessibility label\n * - fdKey: Data attribute for testing/analytics\n * - ...rest: All other props are passed to MuiIconButton\n */\nexport interface IconButtonProps extends Omit<MuiIconButtonProps, 'color'> {\n badgeCount?: number;\n badgeDot?: boolean;\n className?: string;\n disabled?: boolean;\n fdKey?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n size?: 'medium' | 'small';\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n children: React.ReactNode;\n 'aria-label': string;\n}\n\nconst StyledIconButton = styled(MuiIconButton, {\n shouldForwardProp: (prop) =>\n !['variant', 'tone', 'state', 'badgeDot', 'badgeCount', 'fdKey', 'size'].includes(prop as string),\n})<{\n size?: 'medium' | 'small';\n state?: IconButtonState;\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n iconColor?: string;\n}>(({ theme, variant = 'primary', tone = 'brand', size = 'medium' }) => {\n const styles = getIconButtonStyles(theme, variant, tone, size);\n return {\n ...styles.default,\n '&:hover': styles.hover,\n '&:active': styles.press,\n '&:focus-visible': styles.focus,\n '&.Mui-disabled': styles.disabled,\n // Style the child SVG icon\n '& > svg': {\n color: (styles.default?.['color']) || 'inherit',\n verticalAlign: 'middle',\n pointerEvents: 'none',\n },\n };\n});\n\nconst StyledBadgeCount = styled(BadgeCount)(() => ({\n position: 'absolute',\n top: -8,\n right: -8,\n}));\n\nconst StyledBadgeDot = styled(BadgeDot)(() => ({\n position: 'absolute',\n top: 8,\n right: 8,\n}));\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n (\n {\n children,\n badgeCount,\n variant = 'primary',\n tone = 'brand',\n fdKey,\n className,\n disabled = false,\n onClick,\n badgeDot = false,\n size = 'medium',\n ...rest\n },\n ref\n ) => {\n return (\n <StyledIconButton\n ref={ref}\n disableRipple\n className={className}\n data-fd={fdKey}\n data-tone={tone}\n data-variant={variant}\n disabled={disabled}\n onClick={onClick}\n size={size}\n tone={tone}\n variant={variant}\n {...rest}\n >\n {children}\n {!!badgeCount && <StyledBadgeCount data-testid=\"icon-button-badge-count\">{badgeCount}</StyledBadgeCount>}\n {badgeDot && <StyledBadgeDot data-testid=\"icon-button-badge-dot\" />}\n </StyledIconButton>\n );\n }\n);\n\nIconButton.displayName = 'IconButton';\n\nexport default IconButton;\n"],"names":["StyledIconButton","styled","MuiIconButton","shouldForwardProp","prop","includes","theme","variant","tone","size","styles","getIconButtonStyles","default","hover","press","focus","disabled","color","verticalAlign","pointerEvents","StyledBadgeCount","BadgeCount","position","top","right","StyledBadgeDot","BadgeDot","IconButton","forwardRef","children","badgeCount","fdKey","className","onClick","badgeDot","rest","ref","_jsxs","disableRipple","_jsx","displayName"],"mappings":"6RAmCA,MAAMA,EAAmBC,EAAOC,EAAe,CAC7CC,kBAAoBC,IACjB,CAAC,UAAW,OAAQ,QAAS,WAAY,aAAc,QAAS,QAAQC,SAASD,IAF7DH,EAStB,EAAGK,QAAOC,UAAU,UAAWC,OAAO,QAASC,OAAO,aACvD,MAAMC,EAASC,EAAoBL,EAAOC,EAASC,EAAMC,GACzD,MAAO,IACFC,EAAOE,QACV,UAAWF,EAAOG,MAClB,WAAYH,EAAOI,MACnB,kBAAmBJ,EAAOK,MAC1B,iBAAkBL,EAAOM,SAEzB,UAAW,CACTC,MAAQP,EAAOE,SAAiB,OAAM,UACtCM,cAAe,SACfC,cAAe,YAKfC,EAAmBnB,EAAOoB,EAAPpB,EAAmB,KAAA,CAC1CqB,SAAU,WACVC,KAAK,EACLC,OAAO,MAGHC,EAAiBxB,EAAOyB,EAAPzB,EAAiB,KAAA,CACtCqB,SAAU,WACVC,IAAK,EACLC,MAAO,MAGIG,EAAaC,GACxB,EAEIC,WACAC,aACAvB,UAAU,UACVC,OAAO,QACPuB,QACAC,YACAhB,YAAW,EACXiB,UACAC,YAAW,EACXzB,OAAO,YACJ0B,GAELC,IAGEC,EAACrC,EAAgB,CACfoC,IAAKA,EACLE,eAAa,EACbN,UAAWA,EAAS,UACXD,EAAK,YACHvB,EAAI,eACDD,EACdS,SAAUA,EACViB,QAASA,EACTxB,KAAMA,EACND,KAAMA,EACND,QAASA,KACL4B,EAAIN,SAAA,CAEPA,IACEC,GAAcS,EAACnB,EAAgB,CAAA,cAAa,0BAAyBS,SAAEC,IACzEI,GAAYK,EAACd,EAAc,CAAA,cAAa,+BAMjDE,EAAWa,YAAc"}
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/atoms/IconButton/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport MuiIconButton, { type IconButtonProps as MuiIconButtonProps } from '@mui/material/IconButton';\nimport { styled } from '@mui/material/styles';\n\nimport BadgeCount from '../BadgeCount';\nimport BadgeDot from '../BadgeDot';\nimport Box from '../Box';\nimport getIconButtonStyles, { type IconButtonTone, type IconButtonVariant } from './getIconButtonStyles';\n\n/**\n * Custom IconButton atom for Flipdish design system.\n * - icon: The icon to display (required, use local icon library)\n * - badgeDot: Show a small dot badge (optional)\n * - badgeCount: Show a count badge (optional)\n * - variant: Visual style (primary | secondary | tertiary)\n * - tone: Visual tone (brand | destructive | inverse | neutral)\n * - state: Visual state (default | disabled | focus | hover | press)\n * - aria-label: Accessibility label\n * - fdKey: Data attribute for testing/analytics\n * - ...rest: All other props are passed to MuiIconButton\n */\nexport interface IconButtonProps extends Omit<MuiIconButtonProps, 'color'> {\n 'aria-label': string;\n badgeCount?: number;\n badgeDot?: boolean;\n children: React.ReactNode;\n className?: string;\n disabled?: boolean;\n fdKey?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n size?: 'medium' | 'small';\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n}\n\nconst StyledIconButton = styled(MuiIconButton, {\n shouldForwardProp: (prop) =>\n !['variant', 'tone', 'badgeDot', 'badgeCount', 'fdKey'].includes(prop as string),\n})<{\n tone?: IconButtonTone;\n variant?: IconButtonVariant;\n iconColor?: string;\n}>(({ theme, variant = 'primary', tone = 'brand' }) => {\n const styles = getIconButtonStyles(theme, variant, tone);\n const focusColor =\n tone === 'inverse'\n ? theme.palette.semantic.stroke['stroke-inverse-strong']\n : theme.palette.semantic.stroke['stroke-focus'];\n\n return {\n ...styles.default,\n overflow: 'visible', // Allow badges to overflow\n '&.Mui-disabled': { ...styles.disabled, overflow: 'visible' },\n '&.Mui-focusVisible': {\n outlineColor: focusColor,\n },\n };\n});\n\nconst StyledBox = styled(Box, {\n shouldForwardProp: (prop) => !['variant', 'tone'].includes(prop as string),\n})<{ variant: IconButtonVariant; tone: IconButtonTone }>(({ theme, variant = 'primary', tone = 'brand' }) => {\n const styles = getIconButtonStyles(theme, variant, tone);\n\n return {\n alignItems: 'center',\n borderRadius: 'inherit',\n display: 'flex',\n height: '100%',\n justifyContent: 'center',\n overflow: 'hidden',\n pointerEvents: 'none',\n width: '100%',\n '[data-variant]:hover:not(.Mui-disabled) > &': styles.hover,\n '[data-variant]:active:not(.Mui-disabled) > &': styles.press,\n };\n});\n\nconst StyledBadgeCount = styled(BadgeCount, {\n shouldForwardProp: (prop) => !['size'].includes(prop as string),\n})<{ size: 'medium' | 'small' }>(({ theme, size }) => ({\n position: 'absolute',\n bottom: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n left: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n zIndex: 1,\n pointerEvents: 'none',\n}));\n\nconst StyledBadgeDot = styled(BadgeDot, {\n shouldForwardProp: (prop) => !['size'].includes(prop as string),\n})<{ size: 'medium' | 'small' }>(({ theme, size }) => ({\n position: 'absolute',\n bottom: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n left: size === 'small' ? theme.spacing(2.5) : theme.spacing(4),\n zIndex: 1,\n pointerEvents: 'none',\n}));\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n (\n {\n badgeCount,\n badgeDot = false,\n children,\n className,\n disabled = false,\n fdKey,\n onClick,\n size = 'medium',\n tone = 'brand',\n variant = 'primary',\n ...rest\n },\n ref,\n ) => {\n return (\n <StyledIconButton\n ref={ref}\n disableRipple\n className={className}\n data-fd={fdKey}\n data-tone={tone}\n data-variant={variant}\n disabled={disabled}\n onClick={onClick}\n size={size}\n tone={tone}\n variant={variant}\n {...rest}\n >\n <StyledBox tone={tone} variant={variant}>\n {children}\n </StyledBox>\n {!!badgeCount && (\n <StyledBadgeCount data-testid=\"icon-button-badge-count\" size={size}>\n {badgeCount}\n </StyledBadgeCount>\n )}\n\n {badgeDot && !badgeCount && <StyledBadgeDot data-testid=\"icon-button-badge-dot\" size={size} />}\n </StyledIconButton>\n );\n },\n);\n\nIconButton.displayName = 'IconButton';\n\nexport default IconButton;\n"],"names":["StyledIconButton","styled","MuiIconButton","shouldForwardProp","prop","includes","theme","variant","tone","styles","getIconButtonStyles","focusColor","palette","semantic","stroke","default","overflow","disabled","outlineColor","StyledBox","Box","alignItems","borderRadius","display","height","justifyContent","pointerEvents","width","hover","press","StyledBadgeCount","BadgeCount","size","position","bottom","spacing","left","zIndex","StyledBadgeDot","BadgeDot","IconButton","forwardRef","badgeCount","badgeDot","children","className","fdKey","onClick","rest","ref","_jsxs","disableRipple","_jsx","displayName"],"mappings":"8TAoCA,MAAMA,EAAmBC,EAAOC,EAAe,CAC7CC,kBAAoBC,IACjB,CAAC,UAAW,OAAQ,WAAY,aAAc,SAASC,SAASD,IAF5CH,EAOtB,EAAGK,QAAOC,UAAU,UAAWC,OAAO,YACvC,MAAMC,EAASC,EAAoBJ,EAAOC,EAASC,GAC7CG,EACK,YAATH,EACIF,EAAMM,QAAQC,SAASC,OAAO,yBAC9BR,EAAMM,QAAQC,SAASC,OAAO,gBAEpC,MAAO,IACFL,EAAOM,QACVC,SAAU,UACV,iBAAkB,IAAKP,EAAOQ,SAAUD,SAAU,WAClD,qBAAsB,CACpBE,aAAcP,OAKdQ,EAAYlB,EAAOmB,EAAK,CAC5BjB,kBAAoBC,IAAU,CAAC,UAAW,QAAQC,SAASD,IAD3CH,EAEuC,EAAGK,QAAOC,UAAU,UAAWC,OAAO,YAC7F,MAAMC,EAASC,EAAoBJ,EAAOC,EAASC,GAEnD,MAAO,CACLa,WAAY,SACZC,aAAc,UACdC,QAAS,OACTC,OAAQ,OACRC,eAAgB,SAChBT,SAAU,SACVU,cAAe,OACfC,MAAO,OACP,8CAA+ClB,EAAOmB,MACtD,+CAAgDnB,EAAOoB,UAIrDC,EAAmB7B,EAAO8B,EAAY,CAC1C5B,kBAAoBC,IAAU,CAAC,QAAQC,SAASD,IADzBH,EAEQ,EAAGK,QAAO0B,WAAM,CAC/CC,SAAU,WACVC,OAAiB,UAATF,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC9DC,KAAe,UAATJ,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC5DE,OAAQ,EACRX,cAAe,WAGXY,EAAiBrC,EAAOsC,EAAU,CACtCpC,kBAAoBC,IAAU,CAAC,QAAQC,SAASD,IAD3BH,EAEU,EAAGK,QAAO0B,WAAM,CAC/CC,SAAU,WACVC,OAAiB,UAATF,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC9DC,KAAe,UAATJ,EAAmB1B,EAAM6B,QAAQ,KAAO7B,EAAM6B,QAAQ,GAC5DE,OAAQ,EACRX,cAAe,WAGJc,EAAaC,GACxB,EAEIC,aACAC,YAAW,EACXC,WACAC,YACA5B,YAAW,EACX6B,QACAC,UACAf,OAAO,SACPxB,OAAO,QACPD,UAAU,aACPyC,GAELC,IAGEC,EAAClD,GACCiD,IAAKA,EACLE,iBACAN,UAAWA,EAAS,UACXC,cACEtC,EAAI,eACDD,EACdU,SAAUA,EACV8B,QAASA,EACTf,KAAMA,EACNxB,KAAMA,EACND,QAASA,KACLyC,EAAIJ,SAAA,CAERQ,EAACjC,EAAS,CAACX,KAAMA,EAAMD,QAASA,EAAOqC,SACpCA,MAEAF,GACDU,EAACtB,EAAgB,CAAA,cAAa,0BAA0BE,KAAMA,EAAIY,SAC/DF,IAIJC,IAAaD,GAAcU,EAACd,EAAc,CAAA,cAAa,wBAAwBN,KAAMA,SAM9FQ,EAAWa,YAAc"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("@mui/material/styles/createTheme"),r=require("../components/atoms/Button/buttonThemeOverrides.cjs.js"),s=require("../components/atoms/IconButton/iconButtonThemeOverrides.cjs.js"),i=require("../icons/Cancel/index.cjs.js"),t=require("./overrides/autocompleteOverrides.cjs.js"),o=require("./overrides/buttonBaseOverrides.cjs.js"),d=require("./overrides/checkboxOverrides.cjs.js"),a=require("./overrides/chipOverrides.cjs.js"),u=require("./overrides/formControlLabelOverrides.cjs.js"),n=require("./overrides/formHelperTextOverrides.cjs.js"),l=require("./overrides/formLabelOverrides.cjs.js"),p=require("./overrides/inputBaseOverrides.cjs.js"),c=require("./overrides/inputLabelOverrides.cjs.js"),v=require("./overrides/listItemTextOverrides.cjs.js"),j=require("./overrides/listSubheaderOverrides.cjs.js"),m=require("./overrides/menuItemOverrides.cjs.js"),b=require("./overrides/menuOverrides.cjs.js"),O=require("./overrides/ratingOverride.cjs.js"),h=require("./overrides/selectOverrides.cjs.js"),y=require("./overrides/tabOverrides.cjs.js"),g=require("./overrides/tabsOverrides.cjs.js"),M=require("./overrides/textFieldOverrides.cjs.js"),q=require("./tokens/breakpoints/breakpoints.cjs.js"),k=require("./tokens/colours/semantic.cjs.js"),x=require("./tokens/radius/radius.cjs.js"),T=require("./tokens/shadows/shadows.cjs.js"),B=require("./tokens/typography/variant-mapping.cjs.js"),f=require("./typography.cjs.js");const C=C=>{const w={typography:f.typography,palette:"light"===C?k.lightColours:k.darkColours,radius:x.radius,breakpoints:{values:q.breakpointValues},customShadows:{...T.shadows}},I=e(w);return Object.keys(f.typography).forEach((e=>{const r=e.split(/(?=[A-Z])/)[0],s=e;I.typography[s]={...I.typography[s],[I.breakpoints.down("tablet")]:{...f.getMobileTextStyle(r)}}})),e({...w,typography:I.typography,shape:{borderRadius:4},customShadows:I.customShadows,components:{MuiAlert:{defaultProps:{components:{CloseIcon:i}},styleOverrides:{root:{borderRadius:"8px",padding:"24px"},icon:{marginRight:"12px",padding:0},action:{padding:0,"& button":{marginTop:"-5px"}},message:{padding:0}}},MuiButton:r.buttonStyleOverrides(I),MuiIconButton:s.iconButtonStyleOverrides(),MuiCard:{styleOverrides:{root:{boxShadow:"none",borderWidth:"1px",borderStyle:"solid",borderColor:I.palette.divider}}},MuiListItemButton:{styleOverrides:{root:{"&:hover":{backgroundColor:I.palette.semantic.fill["fill-primary-weak"]},"&:not(:last-child)":{borderBottom:`1px solid ${I.palette.semantic.stroke["stroke-weak"]}`}}}},MuiTableRow:{styleOverrides:{root:{"&.MuiTableRow-hover:hover":{backgroundColor:I.palette.semantic.fill["fill-secondary"],cursor:"pointer"}}}},MuiTypography:{defaultProps:{variantMapping:B.typographyVariantMapping}},MuiAutocomplete:t.autocompleteOverrides(I),MuiButtonBase:o.buttonBaseOverrides(),MuiCheckbox:d.checkboxOverrides(I),MuiChip:a.chipOverrides(I),MuiFormControlLabel:u.formControlLabelOverrides(I),MuiFormHelperText:n.formHelperTextOverrides(I),MuiFormLabel:l.formLabelOverrides(I),MuiInputBase:p.inputBaseOverrides(I),MuiInputLabel:c.inputLabelOverrides(I),MuiListItemText:v.listItemTextOverrides(I),MuiListSubheader:j.listSubheaderOverrides(I),MuiMenu:b.menuOverrides(I),MuiMenuItem:m.menuItemOverrides(I),MuiRating:O.ratingOverride(),MuiSelect:h.selectOverrides(I),MuiTab:y.tabOverrides(I),MuiTabs:g.tabsOverrides(I),MuiTextField:M.textFieldOverrides(I)}})},w=C("light"),I=C("dark");exports.darkTheme=I,exports.lightTheme=w;
1
+ "use strict";var e=require("@mui/material/styles/createTheme"),r=require("../components/atoms/Button/buttonThemeOverrides.cjs.js"),s=require("../icons/Cancel/index.cjs.js"),i=require("./overrides/autocompleteOverrides.cjs.js"),t=require("./overrides/buttonBaseOverrides.cjs.js"),o=require("./overrides/checkboxOverrides.cjs.js"),d=require("./overrides/chipOverrides.cjs.js"),a=require("./overrides/formControlLabelOverrides.cjs.js"),u=require("./overrides/formHelperTextOverrides.cjs.js"),n=require("./overrides/formLabelOverrides.cjs.js"),l=require("./overrides/iconButtonOverrides.cjs.js"),p=require("./overrides/inputBaseOverrides.cjs.js"),c=require("./overrides/inputLabelOverrides.cjs.js"),v=require("./overrides/listItemTextOverrides.cjs.js"),j=require("./overrides/listSubheaderOverrides.cjs.js"),m=require("./overrides/menuItemOverrides.cjs.js"),b=require("./overrides/menuOverrides.cjs.js"),O=require("./overrides/ratingOverride.cjs.js"),h=require("./overrides/selectOverrides.cjs.js"),y=require("./overrides/tabOverrides.cjs.js"),g=require("./overrides/tabsOverrides.cjs.js"),M=require("./overrides/textFieldOverrides.cjs.js"),q=require("./tokens/breakpoints/breakpoints.cjs.js"),k=require("./tokens/colours/semantic.cjs.js"),x=require("./tokens/radius/radius.cjs.js"),T=require("./tokens/shadows/shadows.cjs.js"),B=require("./tokens/typography/variant-mapping.cjs.js"),f=require("./typography.cjs.js");const C=C=>{const w={typography:f.typography,palette:"light"===C?k.lightColours:k.darkColours,radius:x.radius,breakpoints:{values:q.breakpointValues},customShadows:{...T.shadows}},L=e(w);return Object.keys(f.typography).forEach((e=>{const r=e.split(/(?=[A-Z])/)[0],s=e;L.typography[s]={...L.typography[s],[L.breakpoints.down("tablet")]:{...f.getMobileTextStyle(r)}}})),e({...w,typography:L.typography,shape:{borderRadius:4},customShadows:L.customShadows,components:{MuiAlert:{defaultProps:{components:{CloseIcon:s}},styleOverrides:{root:{borderRadius:"8px",padding:"24px"},icon:{marginRight:"12px",padding:0},action:{padding:0,"& button":{marginTop:"-5px"}},message:{padding:0}}},MuiButton:r.buttonStyleOverrides(L),MuiIconButton:l.iconButtonOverrides(),MuiCard:{styleOverrides:{root:{boxShadow:"none",borderWidth:"1px",borderStyle:"solid",borderColor:L.palette.divider}}},MuiListItemButton:{styleOverrides:{root:{"&:hover":{backgroundColor:L.palette.semantic.fill["fill-primary-weak"]},"&:not(:last-child)":{borderBottom:`1px solid ${L.palette.semantic.stroke["stroke-weak"]}`}}}},MuiTableRow:{styleOverrides:{root:{"&.MuiTableRow-hover:hover":{backgroundColor:L.palette.semantic.fill["fill-secondary"],cursor:"pointer"}}}},MuiTypography:{defaultProps:{variantMapping:B.typographyVariantMapping}},MuiAutocomplete:i.autocompleteOverrides(L),MuiButtonBase:t.buttonBaseOverrides(),MuiCheckbox:o.checkboxOverrides(L),MuiChip:d.chipOverrides(L),MuiFormControlLabel:a.formControlLabelOverrides(L),MuiFormHelperText:u.formHelperTextOverrides(L),MuiFormLabel:n.formLabelOverrides(L),MuiInputBase:p.inputBaseOverrides(L),MuiInputLabel:c.inputLabelOverrides(L),MuiListItemText:v.listItemTextOverrides(L),MuiListSubheader:j.listSubheaderOverrides(L),MuiMenu:b.menuOverrides(L),MuiMenuItem:m.menuItemOverrides(L),MuiRating:O.ratingOverride(),MuiSelect:h.selectOverrides(L),MuiTab:y.tabOverrides(L),MuiTabs:g.tabsOverrides(L),MuiTextField:M.textFieldOverrides(L)}})},w=C("light"),L=C("dark");exports.darkTheme=L,exports.lightTheme=w;
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 { buttonStyleOverrides } from '../components/atoms/Button/buttonThemeOverrides';\nimport { iconButtonStyleOverrides } from '../components/atoms/IconButton/iconButtonThemeOverrides';\nimport CancelIcon from '../icons/Cancel';\nimport { autocompleteOverrides } from './overrides/autocompleteOverrides';\nimport { buttonBaseOverrides } from './overrides/buttonBaseOverrides';\nimport { checkboxOverrides } from './overrides/checkboxOverrides';\nimport { chipOverrides } from './overrides/chipOverrides';\nimport { formControlLabelOverrides } from './overrides/formControlLabelOverrides';\nimport { formHelperTextOverrides } from './overrides/formHelperTextOverrides';\nimport { formLabelOverrides } from './overrides/formLabelOverrides';\nimport { inputBaseOverrides } from './overrides/inputBaseOverrides';\nimport { inputLabelOverrides } from './overrides/inputLabelOverrides';\nimport { listItemTextOverrides } from './overrides/listItemTextOverrides';\nimport { listSubheaderOverrides } from './overrides/listSubheaderOverrides';\nimport { menuItemOverrides } from './overrides/menuItemOverrides';\nimport { menuOverrides } from './overrides/menuOverrides';\nimport { ratingOverride } from './overrides/ratingOverride';\nimport { selectOverrides } from './overrides/selectOverrides';\nimport { tabOverrides } from './overrides/tabOverrides';\nimport { tabsOverrides } from './overrides/tabsOverrides';\nimport { textFieldOverrides } from './overrides/textFieldOverrides';\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 { 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 themeOptions: ThemeOptions = {\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n customShadows: {\n ...shadows,\n },\n };\n const baseTheme = createTheme(themeOptions);\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 const typographyKey = key as keyof typeof typography;\n baseTheme.typography[typographyKey] = {\n ...baseTheme.typography[typographyKey],\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({\n ...themeOptions,\n typography: baseTheme.typography,\n shape: {\n borderRadius: 4,\n },\n customShadows: baseTheme.customShadows,\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: buttonStyleOverrides(baseTheme),\n MuiIconButton: iconButtonStyleOverrides(),\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\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 MuiAutocomplete: autocompleteOverrides(baseTheme),\n MuiButtonBase: buttonBaseOverrides(baseTheme),\n MuiCheckbox: checkboxOverrides(baseTheme),\n MuiChip: chipOverrides(baseTheme),\n MuiFormControlLabel: formControlLabelOverrides(baseTheme),\n MuiFormHelperText: formHelperTextOverrides(baseTheme),\n MuiFormLabel: formLabelOverrides(baseTheme),\n MuiInputBase: inputBaseOverrides(baseTheme),\n MuiInputLabel: inputLabelOverrides(baseTheme),\n MuiListItemText: listItemTextOverrides(baseTheme),\n MuiListSubheader: listSubheaderOverrides(baseTheme),\n MuiMenu: menuOverrides(baseTheme),\n MuiMenuItem: menuItemOverrides(baseTheme),\n MuiRating: ratingOverride(),\n MuiSelect: selectOverrides(baseTheme),\n MuiTab: tabOverrides(baseTheme),\n MuiTabs: tabsOverrides(baseTheme),\n MuiTextField: textFieldOverrides(baseTheme),\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","themeOptions","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","customShadows","shadows","baseTheme","createTheme","Object","keys","forEach","key","keyWithoutVariantSuffix","split","typographyKey","down","getMobileTextStyle","shape","borderRadius","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","buttonStyleOverrides","MuiIconButton","iconButtonStyleOverrides","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","MuiAutocomplete","autocompleteOverrides","MuiButtonBase","buttonBaseOverrides","MuiCheckbox","checkboxOverrides","MuiChip","chipOverrides","MuiFormControlLabel","formControlLabelOverrides","MuiFormHelperText","formHelperTextOverrides","MuiFormLabel","formLabelOverrides","MuiInputBase","inputBaseOverrides","MuiInputLabel","inputLabelOverrides","MuiListItemText","listItemTextOverrides","MuiListSubheader","listSubheaderOverrides","MuiMenu","menuOverrides","MuiMenuItem","menuItemOverrides","MuiRating","ratingOverride","MuiSelect","selectOverrides","MuiTab","tabOverrides","MuiTabs","tabsOverrides","MuiTextField","textFieldOverrides","lightTheme","darkTheme"],"mappings":"65CA+BA,MAAMA,EAA8BC,IAClC,MAAMC,EAA6B,YACjCC,EAAAA,WACAC,QAAkB,UAATH,EAAmBI,EAAAA,aAAeC,EAAAA,mBAC3CC,EAAAA,OACAC,YAAa,CACXC,OAAQC,EAAAA,kBAEVC,cAAe,IACVC,EAAAA,UAGDC,EAAYC,EAAYZ,GAoB9B,OAbAa,OAAOC,KAAKb,EAAAA,YAAYc,SAASC,IAE/B,MAAMC,EAA0BD,EAAIE,MAAM,aAAa,GACjDC,EAAgBH,EACtBL,EAAUV,WAAWkB,GAAiB,IACjCR,EAAUV,WAAWkB,GACxB,CAACR,EAAUL,YAAYc,KAAK,WAAY,IACnCC,EAAAA,mBAAmBJ,QAMrBL,EAAY,IACdZ,EACHC,WAAYU,EAAUV,WACtBqB,MAAO,CACLC,aAAc,GAEhBd,cAAeE,EAAUF,cACzBe,WAAY,CACVC,SAAU,CACRC,aAAc,CACZF,WAAY,CACVG,UAAWC,IAGfC,eAAgB,CACdC,KAAM,CAEJP,aAAc,MAEdQ,QAAS,QAEXC,KAAM,CAEJC,YAAa,OACbF,QAAS,GAEXG,OAAQ,CACNH,QAAS,EACT,WAAY,CACVI,UAAW,SAGfC,QAAS,CACPL,QAAS,KAIfM,UAAWC,EAAAA,qBAAqB3B,GAChC4B,cAAeC,EAAAA,2BACfC,QAAS,CACPZ,eAAgB,CACdC,KAAM,CACJY,UAAW,OACXC,YAAa,MACbC,YAAa,QACbC,YAAalC,EAAUT,QAAQ4C,WAIrCC,kBAAmB,CACjBlB,eAAgB,CACdC,KAAM,CACJ,UAAW,CACTkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,sBAEnD,qBAAsB,CACpBC,aAAc,aAAaxC,EAAUT,QAAQ+C,SAASG,OAAO,qBAKrEC,YAAa,CACXxB,eAAgB,CACdC,KAAM,CACJ,4BAA6B,CAC3BkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,kBACjDI,OAAQ,cAKhBC,cAAe,CACb7B,aAAc,CACZ8B,eAAgBC,EAAAA,2BAGpBC,gBAAiBC,EAAAA,sBAAsBhD,GACvCiD,cAAeC,EAAAA,sBACfC,YAAaC,EAAAA,kBAAkBpD,GAC/BqD,QAASC,EAAAA,cAActD,GACvBuD,oBAAqBC,EAAAA,0BAA0BxD,GAC/CyD,kBAAmBC,EAAAA,wBAAwB1D,GAC3C2D,aAAcC,EAAAA,mBAAmB5D,GACjC6D,aAAcC,EAAAA,mBAAmB9D,GACjC+D,cAAeC,EAAAA,oBAAoBhE,GACnCiE,gBAAiBC,EAAAA,sBAAsBlE,GACvCmE,iBAAkBC,EAAAA,uBAAuBpE,GACzCqE,QAASC,EAAAA,cAActE,GACvBuE,YAAaC,EAAAA,kBAAkBxE,GAC/ByE,UAAWC,EAAAA,iBACXC,UAAWC,EAAAA,gBAAgB5E,GAC3B6E,OAAQC,EAAAA,aAAa9E,GACrB+E,QAASC,EAAAA,cAAchF,GACvBiF,aAAcC,EAAAA,mBAAmBlF,OAK1BmF,EAAahG,EAA2B,SACxCiG,EAAYjG,EAA2B"}
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 { buttonStyleOverrides } from '../components/atoms/Button/buttonThemeOverrides';\nimport CancelIcon from '../icons/Cancel';\nimport { autocompleteOverrides } from './overrides/autocompleteOverrides';\nimport { buttonBaseOverrides } from './overrides/buttonBaseOverrides';\nimport { checkboxOverrides } from './overrides/checkboxOverrides';\nimport { chipOverrides } from './overrides/chipOverrides';\nimport { formControlLabelOverrides } from './overrides/formControlLabelOverrides';\nimport { formHelperTextOverrides } from './overrides/formHelperTextOverrides';\nimport { formLabelOverrides } from './overrides/formLabelOverrides';\nimport { iconButtonOverrides } from './overrides/iconButtonOverrides';\nimport { inputBaseOverrides } from './overrides/inputBaseOverrides';\nimport { inputLabelOverrides } from './overrides/inputLabelOverrides';\nimport { listItemTextOverrides } from './overrides/listItemTextOverrides';\nimport { listSubheaderOverrides } from './overrides/listSubheaderOverrides';\nimport { menuItemOverrides } from './overrides/menuItemOverrides';\nimport { menuOverrides } from './overrides/menuOverrides';\nimport { ratingOverride } from './overrides/ratingOverride';\nimport { selectOverrides } from './overrides/selectOverrides';\nimport { tabOverrides } from './overrides/tabOverrides';\nimport { tabsOverrides } from './overrides/tabsOverrides';\nimport { textFieldOverrides } from './overrides/textFieldOverrides';\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 { 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 themeOptions: ThemeOptions = {\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n customShadows: {\n ...shadows,\n },\n };\n const baseTheme = createTheme(themeOptions);\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 const typographyKey = key as keyof typeof typography;\n baseTheme.typography[typographyKey] = {\n ...baseTheme.typography[typographyKey],\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({\n ...themeOptions,\n typography: baseTheme.typography,\n shape: {\n borderRadius: 4,\n },\n customShadows: baseTheme.customShadows,\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: buttonStyleOverrides(baseTheme),\n MuiIconButton: iconButtonOverrides(),\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\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 MuiAutocomplete: autocompleteOverrides(baseTheme),\n MuiButtonBase: buttonBaseOverrides(baseTheme),\n MuiCheckbox: checkboxOverrides(baseTheme),\n MuiChip: chipOverrides(baseTheme),\n MuiFormControlLabel: formControlLabelOverrides(baseTheme),\n MuiFormHelperText: formHelperTextOverrides(baseTheme),\n MuiFormLabel: formLabelOverrides(baseTheme),\n MuiInputBase: inputBaseOverrides(baseTheme),\n MuiInputLabel: inputLabelOverrides(baseTheme),\n MuiListItemText: listItemTextOverrides(baseTheme),\n MuiListSubheader: listSubheaderOverrides(baseTheme),\n MuiMenu: menuOverrides(baseTheme),\n MuiMenuItem: menuItemOverrides(baseTheme),\n MuiRating: ratingOverride(),\n MuiSelect: selectOverrides(baseTheme),\n MuiTab: tabOverrides(baseTheme),\n MuiTabs: tabsOverrides(baseTheme),\n MuiTextField: textFieldOverrides(baseTheme),\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","themeOptions","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","customShadows","shadows","baseTheme","createTheme","Object","keys","forEach","key","keyWithoutVariantSuffix","split","typographyKey","down","getMobileTextStyle","shape","borderRadius","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","buttonStyleOverrides","MuiIconButton","iconButtonOverrides","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","MuiAutocomplete","autocompleteOverrides","MuiButtonBase","buttonBaseOverrides","MuiCheckbox","checkboxOverrides","MuiChip","chipOverrides","MuiFormControlLabel","formControlLabelOverrides","MuiFormHelperText","formHelperTextOverrides","MuiFormLabel","formLabelOverrides","MuiInputBase","inputBaseOverrides","MuiInputLabel","inputLabelOverrides","MuiListItemText","listItemTextOverrides","MuiListSubheader","listSubheaderOverrides","MuiMenu","menuOverrides","MuiMenuItem","menuItemOverrides","MuiRating","ratingOverride","MuiSelect","selectOverrides","MuiTab","tabOverrides","MuiTabs","tabsOverrides","MuiTextField","textFieldOverrides","lightTheme","darkTheme"],"mappings":"q4CA+BA,MAAMA,EAA8BC,IAClC,MAAMC,EAA6B,YACjCC,EAAAA,WACAC,QAAkB,UAATH,EAAmBI,EAAAA,aAAeC,EAAAA,mBAC3CC,EAAAA,OACAC,YAAa,CACXC,OAAQC,EAAAA,kBAEVC,cAAe,IACVC,EAAAA,UAGDC,EAAYC,EAAYZ,GAoB9B,OAbAa,OAAOC,KAAKb,EAAAA,YAAYc,SAASC,IAE/B,MAAMC,EAA0BD,EAAIE,MAAM,aAAa,GACjDC,EAAgBH,EACtBL,EAAUV,WAAWkB,GAAiB,IACjCR,EAAUV,WAAWkB,GACxB,CAACR,EAAUL,YAAYc,KAAK,WAAY,IACnCC,EAAAA,mBAAmBJ,QAMrBL,EAAY,IACdZ,EACHC,WAAYU,EAAUV,WACtBqB,MAAO,CACLC,aAAc,GAEhBd,cAAeE,EAAUF,cACzBe,WAAY,CACVC,SAAU,CACRC,aAAc,CACZF,WAAY,CACVG,UAAWC,IAGfC,eAAgB,CACdC,KAAM,CAEJP,aAAc,MAEdQ,QAAS,QAEXC,KAAM,CAEJC,YAAa,OACbF,QAAS,GAEXG,OAAQ,CACNH,QAAS,EACT,WAAY,CACVI,UAAW,SAGfC,QAAS,CACPL,QAAS,KAIfM,UAAWC,EAAAA,qBAAqB3B,GAChC4B,cAAeC,EAAAA,sBACfC,QAAS,CACPZ,eAAgB,CACdC,KAAM,CACJY,UAAW,OACXC,YAAa,MACbC,YAAa,QACbC,YAAalC,EAAUT,QAAQ4C,WAIrCC,kBAAmB,CACjBlB,eAAgB,CACdC,KAAM,CACJ,UAAW,CACTkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,sBAEnD,qBAAsB,CACpBC,aAAc,aAAaxC,EAAUT,QAAQ+C,SAASG,OAAO,qBAKrEC,YAAa,CACXxB,eAAgB,CACdC,KAAM,CACJ,4BAA6B,CAC3BkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,kBACjDI,OAAQ,cAKhBC,cAAe,CACb7B,aAAc,CACZ8B,eAAgBC,EAAAA,2BAGpBC,gBAAiBC,EAAAA,sBAAsBhD,GACvCiD,cAAeC,EAAAA,sBACfC,YAAaC,EAAAA,kBAAkBpD,GAC/BqD,QAASC,EAAAA,cAActD,GACvBuD,oBAAqBC,EAAAA,0BAA0BxD,GAC/CyD,kBAAmBC,EAAAA,wBAAwB1D,GAC3C2D,aAAcC,EAAAA,mBAAmB5D,GACjC6D,aAAcC,EAAAA,mBAAmB9D,GACjC+D,cAAeC,EAAAA,oBAAoBhE,GACnCiE,gBAAiBC,EAAAA,sBAAsBlE,GACvCmE,iBAAkBC,EAAAA,uBAAuBpE,GACzCqE,QAASC,EAAAA,cAActE,GACvBuE,YAAaC,EAAAA,kBAAkBxE,GAC/ByE,UAAWC,EAAAA,iBACXC,UAAWC,EAAAA,gBAAgB5E,GAC3B6E,OAAQC,EAAAA,aAAa9E,GACrB+E,QAASC,EAAAA,cAAchF,GACvBiF,aAAcC,EAAAA,mBAAmBlF,OAK1BmF,EAAahG,EAA2B,SACxCiG,EAAYjG,EAA2B"}
@@ -1,2 +1,2 @@
1
- import r from"@mui/material/styles/createTheme";import{buttonStyleOverrides as e}from"../components/atoms/Button/buttonThemeOverrides.js";import{iconButtonStyleOverrides as o}from"../components/atoms/IconButton/iconButtonThemeOverrides.js";import t from"../icons/Cancel/index.js";import{autocompleteOverrides as i}from"./overrides/autocompleteOverrides.js";import{buttonBaseOverrides as s}from"./overrides/buttonBaseOverrides.js";import{checkboxOverrides as m}from"./overrides/checkboxOverrides.js";import{chipOverrides as p}from"./overrides/chipOverrides.js";import{formControlLabelOverrides as a}from"./overrides/formControlLabelOverrides.js";import{formHelperTextOverrides as d}from"./overrides/formHelperTextOverrides.js";import{formLabelOverrides as n}from"./overrides/formLabelOverrides.js";import{inputBaseOverrides as u}from"./overrides/inputBaseOverrides.js";import{inputLabelOverrides as l}from"./overrides/inputLabelOverrides.js";import{listItemTextOverrides as v}from"./overrides/listItemTextOverrides.js";import{listSubheaderOverrides as c}from"./overrides/listSubheaderOverrides.js";import{menuItemOverrides as f}from"./overrides/menuItemOverrides.js";import{menuOverrides as b}from"./overrides/menuOverrides.js";import{ratingOverride as h}from"./overrides/ratingOverride.js";import{selectOverrides as M}from"./overrides/selectOverrides.js";import{tabOverrides as j}from"./overrides/tabOverrides.js";import{tabsOverrides as y}from"./overrides/tabsOverrides.js";import{textFieldOverrides as O}from"./overrides/textFieldOverrides.js";import{breakpointValues as g}from"./tokens/breakpoints/breakpoints.js";import{lightColours as k,darkColours as x}from"./tokens/colours/semantic.js";import{radius as T}from"./tokens/radius/radius.js";import{shadows as B}from"./tokens/shadows/shadows.js";import{typographyVariantMapping as w}from"./tokens/typography/variant-mapping.js";import{typography as C,getMobileTextStyle as I}from"./typography.js";const L=L=>{const S={typography:C,palette:"light"===L?k:x,radius:T,breakpoints:{values:g},customShadows:{...B}},R=r(S);return Object.keys(C).forEach((r=>{const e=r.split(/(?=[A-Z])/)[0],o=r;R.typography[o]={...R.typography[o],[R.breakpoints.down("tablet")]:{...I(e)}}})),r({...S,typography:R.typography,shape:{borderRadius:4},customShadows:R.customShadows,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:e(R),MuiIconButton:o(),MuiCard:{styleOverrides:{root:{boxShadow:"none",borderWidth:"1px",borderStyle:"solid",borderColor:R.palette.divider}}},MuiListItemButton:{styleOverrides:{root:{"&:hover":{backgroundColor:R.palette.semantic.fill["fill-primary-weak"]},"&:not(:last-child)":{borderBottom:`1px solid ${R.palette.semantic.stroke["stroke-weak"]}`}}}},MuiTableRow:{styleOverrides:{root:{"&.MuiTableRow-hover:hover":{backgroundColor:R.palette.semantic.fill["fill-secondary"],cursor:"pointer"}}}},MuiTypography:{defaultProps:{variantMapping:w}},MuiAutocomplete:i(R),MuiButtonBase:s(),MuiCheckbox:m(R),MuiChip:p(R),MuiFormControlLabel:a(R),MuiFormHelperText:d(R),MuiFormLabel:n(R),MuiInputBase:u(R),MuiInputLabel:l(R),MuiListItemText:v(R),MuiListSubheader:c(R),MuiMenu:b(R),MuiMenuItem:f(R),MuiRating:h(),MuiSelect:M(R),MuiTab:j(R),MuiTabs:y(R),MuiTextField:O(R)}})},S=L("light"),R=L("dark");export{R as darkTheme,S as lightTheme};
1
+ import r from"@mui/material/styles/createTheme";import{buttonStyleOverrides as e}from"../components/atoms/Button/buttonThemeOverrides.js";import o from"../icons/Cancel/index.js";import{autocompleteOverrides as i}from"./overrides/autocompleteOverrides.js";import{buttonBaseOverrides as t}from"./overrides/buttonBaseOverrides.js";import{checkboxOverrides as s}from"./overrides/checkboxOverrides.js";import{chipOverrides as m}from"./overrides/chipOverrides.js";import{formControlLabelOverrides as p}from"./overrides/formControlLabelOverrides.js";import{formHelperTextOverrides as a}from"./overrides/formHelperTextOverrides.js";import{formLabelOverrides as d}from"./overrides/formLabelOverrides.js";import{iconButtonOverrides as n}from"./overrides/iconButtonOverrides.js";import{inputBaseOverrides as u}from"./overrides/inputBaseOverrides.js";import{inputLabelOverrides as l}from"./overrides/inputLabelOverrides.js";import{listItemTextOverrides as v}from"./overrides/listItemTextOverrides.js";import{listSubheaderOverrides as f}from"./overrides/listSubheaderOverrides.js";import{menuItemOverrides as c}from"./overrides/menuItemOverrides.js";import{menuOverrides as b}from"./overrides/menuOverrides.js";import{ratingOverride as h}from"./overrides/ratingOverride.js";import{selectOverrides as M}from"./overrides/selectOverrides.js";import{tabOverrides as j}from"./overrides/tabOverrides.js";import{tabsOverrides as y}from"./overrides/tabsOverrides.js";import{textFieldOverrides as O}from"./overrides/textFieldOverrides.js";import{breakpointValues as g}from"./tokens/breakpoints/breakpoints.js";import{lightColours as k,darkColours as x}from"./tokens/colours/semantic.js";import{radius as T}from"./tokens/radius/radius.js";import{shadows as w}from"./tokens/shadows/shadows.js";import{typographyVariantMapping as B}from"./tokens/typography/variant-mapping.js";import{typography as C,getMobileTextStyle as I}from"./typography.js";const L=L=>{const S={typography:C,palette:"light"===L?k:x,radius:T,breakpoints:{values:g},customShadows:{...w}},R=r(S);return Object.keys(C).forEach((r=>{const e=r.split(/(?=[A-Z])/)[0],o=r;R.typography[o]={...R.typography[o],[R.breakpoints.down("tablet")]:{...I(e)}}})),r({...S,typography:R.typography,shape:{borderRadius:4},customShadows:R.customShadows,components:{MuiAlert:{defaultProps:{components:{CloseIcon:o}},styleOverrides:{root:{borderRadius:"8px",padding:"24px"},icon:{marginRight:"12px",padding:0},action:{padding:0,"& button":{marginTop:"-5px"}},message:{padding:0}}},MuiButton:e(R),MuiIconButton:n(),MuiCard:{styleOverrides:{root:{boxShadow:"none",borderWidth:"1px",borderStyle:"solid",borderColor:R.palette.divider}}},MuiListItemButton:{styleOverrides:{root:{"&:hover":{backgroundColor:R.palette.semantic.fill["fill-primary-weak"]},"&:not(:last-child)":{borderBottom:`1px solid ${R.palette.semantic.stroke["stroke-weak"]}`}}}},MuiTableRow:{styleOverrides:{root:{"&.MuiTableRow-hover:hover":{backgroundColor:R.palette.semantic.fill["fill-secondary"],cursor:"pointer"}}}},MuiTypography:{defaultProps:{variantMapping:B}},MuiAutocomplete:i(R),MuiButtonBase:t(),MuiCheckbox:s(R),MuiChip:m(R),MuiFormControlLabel:p(R),MuiFormHelperText:a(R),MuiFormLabel:d(R),MuiInputBase:u(R),MuiInputLabel:l(R),MuiListItemText:v(R),MuiListSubheader:f(R),MuiMenu:b(R),MuiMenuItem:c(R),MuiRating:h(),MuiSelect:M(R),MuiTab:j(R),MuiTabs:y(R),MuiTextField:O(R)}})},S=L("light"),R=L("dark");export{R as darkTheme,S 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 { buttonStyleOverrides } from '../components/atoms/Button/buttonThemeOverrides';\nimport { iconButtonStyleOverrides } from '../components/atoms/IconButton/iconButtonThemeOverrides';\nimport CancelIcon from '../icons/Cancel';\nimport { autocompleteOverrides } from './overrides/autocompleteOverrides';\nimport { buttonBaseOverrides } from './overrides/buttonBaseOverrides';\nimport { checkboxOverrides } from './overrides/checkboxOverrides';\nimport { chipOverrides } from './overrides/chipOverrides';\nimport { formControlLabelOverrides } from './overrides/formControlLabelOverrides';\nimport { formHelperTextOverrides } from './overrides/formHelperTextOverrides';\nimport { formLabelOverrides } from './overrides/formLabelOverrides';\nimport { inputBaseOverrides } from './overrides/inputBaseOverrides';\nimport { inputLabelOverrides } from './overrides/inputLabelOverrides';\nimport { listItemTextOverrides } from './overrides/listItemTextOverrides';\nimport { listSubheaderOverrides } from './overrides/listSubheaderOverrides';\nimport { menuItemOverrides } from './overrides/menuItemOverrides';\nimport { menuOverrides } from './overrides/menuOverrides';\nimport { ratingOverride } from './overrides/ratingOverride';\nimport { selectOverrides } from './overrides/selectOverrides';\nimport { tabOverrides } from './overrides/tabOverrides';\nimport { tabsOverrides } from './overrides/tabsOverrides';\nimport { textFieldOverrides } from './overrides/textFieldOverrides';\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 { 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 themeOptions: ThemeOptions = {\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n customShadows: {\n ...shadows,\n },\n };\n const baseTheme = createTheme(themeOptions);\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 const typographyKey = key as keyof typeof typography;\n baseTheme.typography[typographyKey] = {\n ...baseTheme.typography[typographyKey],\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({\n ...themeOptions,\n typography: baseTheme.typography,\n shape: {\n borderRadius: 4,\n },\n customShadows: baseTheme.customShadows,\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: buttonStyleOverrides(baseTheme),\n MuiIconButton: iconButtonStyleOverrides(),\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\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 MuiAutocomplete: autocompleteOverrides(baseTheme),\n MuiButtonBase: buttonBaseOverrides(baseTheme),\n MuiCheckbox: checkboxOverrides(baseTheme),\n MuiChip: chipOverrides(baseTheme),\n MuiFormControlLabel: formControlLabelOverrides(baseTheme),\n MuiFormHelperText: formHelperTextOverrides(baseTheme),\n MuiFormLabel: formLabelOverrides(baseTheme),\n MuiInputBase: inputBaseOverrides(baseTheme),\n MuiInputLabel: inputLabelOverrides(baseTheme),\n MuiListItemText: listItemTextOverrides(baseTheme),\n MuiListSubheader: listSubheaderOverrides(baseTheme),\n MuiMenu: menuOverrides(baseTheme),\n MuiMenuItem: menuItemOverrides(baseTheme),\n MuiRating: ratingOverride(),\n MuiSelect: selectOverrides(baseTheme),\n MuiTab: tabOverrides(baseTheme),\n MuiTabs: tabsOverrides(baseTheme),\n MuiTextField: textFieldOverrides(baseTheme),\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","themeOptions","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","customShadows","shadows","baseTheme","createTheme","Object","keys","forEach","key","keyWithoutVariantSuffix","split","typographyKey","down","getMobileTextStyle","shape","borderRadius","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","buttonStyleOverrides","MuiIconButton","iconButtonStyleOverrides","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","MuiAutocomplete","autocompleteOverrides","MuiButtonBase","buttonBaseOverrides","MuiCheckbox","checkboxOverrides","MuiChip","chipOverrides","MuiFormControlLabel","formControlLabelOverrides","MuiFormHelperText","formHelperTextOverrides","MuiFormLabel","formLabelOverrides","MuiInputBase","inputBaseOverrides","MuiInputLabel","inputLabelOverrides","MuiListItemText","listItemTextOverrides","MuiListSubheader","listSubheaderOverrides","MuiMenu","menuOverrides","MuiMenuItem","menuItemOverrides","MuiRating","ratingOverride","MuiSelect","selectOverrides","MuiTab","tabOverrides","MuiTabs","tabsOverrides","MuiTextField","textFieldOverrides","lightTheme","darkTheme"],"mappings":"85DA+BA,MAAMA,EAA8BC,IAClC,MAAMC,EAA6B,CACjCC,aACAC,QAAkB,UAATH,EAAmBI,EAAeC,EAC3CC,SACAC,YAAa,CACXC,OAAQC,GAEVC,cAAe,IACVC,IAGDC,EAAYC,EAAYZ,GAoB9B,OAbAa,OAAOC,KAAKb,GAAYc,SAASC,IAE/B,MAAMC,EAA0BD,EAAIE,MAAM,aAAa,GACjDC,EAAgBH,EACtBL,EAAUV,WAAWkB,GAAiB,IACjCR,EAAUV,WAAWkB,GACxB,CAACR,EAAUL,YAAYc,KAAK,WAAY,IACnCC,EAAmBJ,QAMrBL,EAAY,IACdZ,EACHC,WAAYU,EAAUV,WACtBqB,MAAO,CACLC,aAAc,GAEhBd,cAAeE,EAAUF,cACzBe,WAAY,CACVC,SAAU,CACRC,aAAc,CACZF,WAAY,CACVG,UAAWC,IAGfC,eAAgB,CACdC,KAAM,CAEJP,aAAc,MAEdQ,QAAS,QAEXC,KAAM,CAEJC,YAAa,OACbF,QAAS,GAEXG,OAAQ,CACNH,QAAS,EACT,WAAY,CACVI,UAAW,SAGfC,QAAS,CACPL,QAAS,KAIfM,UAAWC,EAAqB3B,GAChC4B,cAAeC,IACfC,QAAS,CACPZ,eAAgB,CACdC,KAAM,CACJY,UAAW,OACXC,YAAa,MACbC,YAAa,QACbC,YAAalC,EAAUT,QAAQ4C,WAIrCC,kBAAmB,CACjBlB,eAAgB,CACdC,KAAM,CACJ,UAAW,CACTkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,sBAEnD,qBAAsB,CACpBC,aAAc,aAAaxC,EAAUT,QAAQ+C,SAASG,OAAO,qBAKrEC,YAAa,CACXxB,eAAgB,CACdC,KAAM,CACJ,4BAA6B,CAC3BkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,kBACjDI,OAAQ,cAKhBC,cAAe,CACb7B,aAAc,CACZ8B,eAAgBC,IAGpBC,gBAAiBC,EAAsBhD,GACvCiD,cAAeC,IACfC,YAAaC,EAAkBpD,GAC/BqD,QAASC,EAActD,GACvBuD,oBAAqBC,EAA0BxD,GAC/CyD,kBAAmBC,EAAwB1D,GAC3C2D,aAAcC,EAAmB5D,GACjC6D,aAAcC,EAAmB9D,GACjC+D,cAAeC,EAAoBhE,GACnCiE,gBAAiBC,EAAsBlE,GACvCmE,iBAAkBC,EAAuBpE,GACzCqE,QAASC,EAActE,GACvBuE,YAAaC,EAAkBxE,GAC/ByE,UAAWC,IACXC,UAAWC,EAAgB5E,GAC3B6E,OAAQC,EAAa9E,GACrB+E,QAASC,EAAchF,GACvBiF,aAAcC,EAAmBlF,OAK1BmF,EAAahG,EAA2B,SACxCiG,EAAYjG,EAA2B"}
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 { buttonStyleOverrides } from '../components/atoms/Button/buttonThemeOverrides';\nimport CancelIcon from '../icons/Cancel';\nimport { autocompleteOverrides } from './overrides/autocompleteOverrides';\nimport { buttonBaseOverrides } from './overrides/buttonBaseOverrides';\nimport { checkboxOverrides } from './overrides/checkboxOverrides';\nimport { chipOverrides } from './overrides/chipOverrides';\nimport { formControlLabelOverrides } from './overrides/formControlLabelOverrides';\nimport { formHelperTextOverrides } from './overrides/formHelperTextOverrides';\nimport { formLabelOverrides } from './overrides/formLabelOverrides';\nimport { iconButtonOverrides } from './overrides/iconButtonOverrides';\nimport { inputBaseOverrides } from './overrides/inputBaseOverrides';\nimport { inputLabelOverrides } from './overrides/inputLabelOverrides';\nimport { listItemTextOverrides } from './overrides/listItemTextOverrides';\nimport { listSubheaderOverrides } from './overrides/listSubheaderOverrides';\nimport { menuItemOverrides } from './overrides/menuItemOverrides';\nimport { menuOverrides } from './overrides/menuOverrides';\nimport { ratingOverride } from './overrides/ratingOverride';\nimport { selectOverrides } from './overrides/selectOverrides';\nimport { tabOverrides } from './overrides/tabOverrides';\nimport { tabsOverrides } from './overrides/tabsOverrides';\nimport { textFieldOverrides } from './overrides/textFieldOverrides';\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 { 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 themeOptions: ThemeOptions = {\n typography,\n palette: mode === 'light' ? lightColours : darkColours,\n radius,\n breakpoints: {\n values: breakpointValues,\n },\n customShadows: {\n ...shadows,\n },\n };\n const baseTheme = createTheme(themeOptions);\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 const typographyKey = key as keyof typeof typography;\n baseTheme.typography[typographyKey] = {\n ...baseTheme.typography[typographyKey],\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({\n ...themeOptions,\n typography: baseTheme.typography,\n shape: {\n borderRadius: 4,\n },\n customShadows: baseTheme.customShadows,\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: buttonStyleOverrides(baseTheme),\n MuiIconButton: iconButtonOverrides(),\n MuiCard: {\n styleOverrides: {\n root: {\n boxShadow: 'none',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: baseTheme.palette.divider,\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 MuiAutocomplete: autocompleteOverrides(baseTheme),\n MuiButtonBase: buttonBaseOverrides(baseTheme),\n MuiCheckbox: checkboxOverrides(baseTheme),\n MuiChip: chipOverrides(baseTheme),\n MuiFormControlLabel: formControlLabelOverrides(baseTheme),\n MuiFormHelperText: formHelperTextOverrides(baseTheme),\n MuiFormLabel: formLabelOverrides(baseTheme),\n MuiInputBase: inputBaseOverrides(baseTheme),\n MuiInputLabel: inputLabelOverrides(baseTheme),\n MuiListItemText: listItemTextOverrides(baseTheme),\n MuiListSubheader: listSubheaderOverrides(baseTheme),\n MuiMenu: menuOverrides(baseTheme),\n MuiMenuItem: menuItemOverrides(baseTheme),\n MuiRating: ratingOverride(),\n MuiSelect: selectOverrides(baseTheme),\n MuiTab: tabOverrides(baseTheme),\n MuiTabs: tabsOverrides(baseTheme),\n MuiTextField: textFieldOverrides(baseTheme),\n },\n });\n};\n\nexport const lightTheme = createFlipdishThemeFactory('light');\nexport const darkTheme = createFlipdishThemeFactory('dark');\n"],"names":["createFlipdishThemeFactory","mode","themeOptions","typography","palette","lightColours","darkColours","radius","breakpoints","values","breakpointValues","customShadows","shadows","baseTheme","createTheme","Object","keys","forEach","key","keyWithoutVariantSuffix","split","typographyKey","down","getMobileTextStyle","shape","borderRadius","components","MuiAlert","defaultProps","CloseIcon","CancelIcon","styleOverrides","root","padding","icon","marginRight","action","marginTop","message","MuiButton","buttonStyleOverrides","MuiIconButton","iconButtonOverrides","MuiCard","boxShadow","borderWidth","borderStyle","borderColor","divider","MuiListItemButton","backgroundColor","semantic","fill","borderBottom","stroke","MuiTableRow","cursor","MuiTypography","variantMapping","typographyVariantMapping","MuiAutocomplete","autocompleteOverrides","MuiButtonBase","buttonBaseOverrides","MuiCheckbox","checkboxOverrides","MuiChip","chipOverrides","MuiFormControlLabel","formControlLabelOverrides","MuiFormHelperText","formHelperTextOverrides","MuiFormLabel","formLabelOverrides","MuiInputBase","inputBaseOverrides","MuiInputLabel","inputLabelOverrides","MuiListItemText","listItemTextOverrides","MuiListSubheader","listSubheaderOverrides","MuiMenu","menuOverrides","MuiMenuItem","menuItemOverrides","MuiRating","ratingOverride","MuiSelect","selectOverrides","MuiTab","tabOverrides","MuiTabs","tabsOverrides","MuiTextField","textFieldOverrides","lightTheme","darkTheme"],"mappings":"i4DA+BA,MAAMA,EAA8BC,IAClC,MAAMC,EAA6B,CACjCC,aACAC,QAAkB,UAATH,EAAmBI,EAAeC,EAC3CC,SACAC,YAAa,CACXC,OAAQC,GAEVC,cAAe,IACVC,IAGDC,EAAYC,EAAYZ,GAoB9B,OAbAa,OAAOC,KAAKb,GAAYc,SAASC,IAE/B,MAAMC,EAA0BD,EAAIE,MAAM,aAAa,GACjDC,EAAgBH,EACtBL,EAAUV,WAAWkB,GAAiB,IACjCR,EAAUV,WAAWkB,GACxB,CAACR,EAAUL,YAAYc,KAAK,WAAY,IACnCC,EAAmBJ,QAMrBL,EAAY,IACdZ,EACHC,WAAYU,EAAUV,WACtBqB,MAAO,CACLC,aAAc,GAEhBd,cAAeE,EAAUF,cACzBe,WAAY,CACVC,SAAU,CACRC,aAAc,CACZF,WAAY,CACVG,UAAWC,IAGfC,eAAgB,CACdC,KAAM,CAEJP,aAAc,MAEdQ,QAAS,QAEXC,KAAM,CAEJC,YAAa,OACbF,QAAS,GAEXG,OAAQ,CACNH,QAAS,EACT,WAAY,CACVI,UAAW,SAGfC,QAAS,CACPL,QAAS,KAIfM,UAAWC,EAAqB3B,GAChC4B,cAAeC,IACfC,QAAS,CACPZ,eAAgB,CACdC,KAAM,CACJY,UAAW,OACXC,YAAa,MACbC,YAAa,QACbC,YAAalC,EAAUT,QAAQ4C,WAIrCC,kBAAmB,CACjBlB,eAAgB,CACdC,KAAM,CACJ,UAAW,CACTkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,sBAEnD,qBAAsB,CACpBC,aAAc,aAAaxC,EAAUT,QAAQ+C,SAASG,OAAO,qBAKrEC,YAAa,CACXxB,eAAgB,CACdC,KAAM,CACJ,4BAA6B,CAC3BkB,gBAAiBrC,EAAUT,QAAQ+C,SAASC,KAAK,kBACjDI,OAAQ,cAKhBC,cAAe,CACb7B,aAAc,CACZ8B,eAAgBC,IAGpBC,gBAAiBC,EAAsBhD,GACvCiD,cAAeC,IACfC,YAAaC,EAAkBpD,GAC/BqD,QAASC,EAActD,GACvBuD,oBAAqBC,EAA0BxD,GAC/CyD,kBAAmBC,EAAwB1D,GAC3C2D,aAAcC,EAAmB5D,GACjC6D,aAAcC,EAAmB9D,GACjC+D,cAAeC,EAAoBhE,GACnCiE,gBAAiBC,EAAsBlE,GACvCmE,iBAAkBC,EAAuBpE,GACzCqE,QAASC,EAActE,GACvBuE,YAAaC,EAAkBxE,GAC/ByE,UAAWC,IACXC,UAAWC,EAAgB5E,GAC3B6E,OAAQC,EAAa9E,GACrB+E,QAASC,EAAchF,GACvBiF,aAAcC,EAAmBlF,OAK1BmF,EAAahG,EAA2B,SACxCiG,EAAYjG,EAA2B"}
@@ -0,0 +1,2 @@
1
+ "use strict";require("@mui/material/styles");exports.iconButtonOverrides=()=>({styleOverrides:{root:{color:"inherit",verticalAlign:"middle","&.Mui-focusVisible":{outline:"2px solid",outlineOffset:"2px"},"&.MuiIconButton-sizeSmall":{height:"32px",width:"32px"},"&.MuiIconButton-sizeMedium":{height:"48px",width:"48px"},"&.MuiIconButton-sizeSmall > div > svg":{height:"16px",width:"16px"},"&.MuiIconButton-sizeMedium > div > svg":{height:"24px",width:"24px"}}}});
2
+ //# sourceMappingURL=iconButtonOverrides.cjs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"iconButtonOverrides.cjs.js","sources":["../../../src/themes/overrides/iconButtonOverrides.ts"],"sourcesContent":["import { type Components, type Theme } from '@mui/material/styles';\n\nexport const iconButtonOverrides = (): Components<Theme>['MuiIconButton'] => ({\n styleOverrides: {\n root: {\n color: 'inherit',\n verticalAlign: 'middle',\n '&.Mui-focusVisible': {\n outline: '2px solid',\n outlineOffset: '2px',\n },\n '&.MuiIconButton-sizeSmall': {\n height: '32px',\n width: '32px',\n },\n '&.MuiIconButton-sizeMedium': {\n height: '48px',\n width: '48px',\n },\n '&.MuiIconButton-sizeSmall > div > svg': {\n height: '16px',\n width: '16px',\n },\n '&.MuiIconButton-sizeMedium > div > svg': {\n height: '24px',\n width: '24px',\n },\n },\n },\n});\n"],"names":["styleOverrides","root","color","verticalAlign","outline","outlineOffset","height","width"],"mappings":"yEAEmC,KAAA,CACjCA,eAAgB,CACdC,KAAM,CACJC,MAAO,UACPC,cAAe,SACf,qBAAsB,CACpBC,QAAS,YACTC,cAAe,OAEjB,4BAA6B,CAC3BC,OAAQ,OACRC,MAAO,QAET,6BAA8B,CAC5BD,OAAQ,OACRC,MAAO,QAET,wCAAyC,CACvCD,OAAQ,OACRC,MAAO,QAET,yCAA0C,CACxCD,OAAQ,OACRC,MAAO"}
@@ -0,0 +1,5 @@
1
+ import { Components, Theme } from '@mui/material/styles';
2
+
3
+ declare const iconButtonOverrides: () => Components<Theme>['MuiIconButton'];
4
+
5
+ export { iconButtonOverrides };
@@ -0,0 +1,2 @@
1
+ import"@mui/material/styles";const i=()=>({styleOverrides:{root:{color:"inherit",verticalAlign:"middle","&.Mui-focusVisible":{outline:"2px solid",outlineOffset:"2px"},"&.MuiIconButton-sizeSmall":{height:"32px",width:"32px"},"&.MuiIconButton-sizeMedium":{height:"48px",width:"48px"},"&.MuiIconButton-sizeSmall > div > svg":{height:"16px",width:"16px"},"&.MuiIconButton-sizeMedium > div > svg":{height:"24px",width:"24px"}}}});export{i as iconButtonOverrides};
2
+ //# sourceMappingURL=iconButtonOverrides.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"iconButtonOverrides.js","sources":["../../../src/themes/overrides/iconButtonOverrides.ts"],"sourcesContent":["import { type Components, type Theme } from '@mui/material/styles';\n\nexport const iconButtonOverrides = (): Components<Theme>['MuiIconButton'] => ({\n styleOverrides: {\n root: {\n color: 'inherit',\n verticalAlign: 'middle',\n '&.Mui-focusVisible': {\n outline: '2px solid',\n outlineOffset: '2px',\n },\n '&.MuiIconButton-sizeSmall': {\n height: '32px',\n width: '32px',\n },\n '&.MuiIconButton-sizeMedium': {\n height: '48px',\n width: '48px',\n },\n '&.MuiIconButton-sizeSmall > div > svg': {\n height: '16px',\n width: '16px',\n },\n '&.MuiIconButton-sizeMedium > div > svg': {\n height: '24px',\n width: '24px',\n },\n },\n },\n});\n"],"names":["iconButtonOverrides","styleOverrides","root","color","verticalAlign","outline","outlineOffset","height","width"],"mappings":"6BAEO,MAAMA,EAAsB,KAAA,CACjCC,eAAgB,CACdC,KAAM,CACJC,MAAO,UACPC,cAAe,SACf,qBAAsB,CACpBC,QAAS,YACTC,cAAe,OAEjB,4BAA6B,CAC3BC,OAAQ,OACRC,MAAO,QAET,6BAA8B,CAC5BD,OAAQ,OACRC,MAAO,QAET,wCAAyC,CACvCD,OAAQ,OACRC,MAAO,QAET,yCAA0C,CACxCD,OAAQ,OACRC,MAAO"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flipdish/portal-library",
3
- "version": "8.0.0",
3
+ "version": "8.0.1",
4
4
  "files": [
5
5
  "dist"
6
6
  ],
@@ -1,2 +0,0 @@
1
- "use strict";exports.iconButtonStyleOverrides=()=>({styleOverrides:{sizeSmall:{height:"32px",width:"32px"},sizeMedium:{height:"48px",width:"48px"}}});
2
- //# sourceMappingURL=iconButtonThemeOverrides.cjs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"iconButtonThemeOverrides.cjs.js","sources":["../../../../src/components/atoms/IconButton/iconButtonThemeOverrides.ts"],"sourcesContent":["interface IconButtonStyleOverrides {\n styleOverrides: {\n sizeSmall: Record<string, string | { [key: string]: string }>;\n sizeMedium: Record<string, string | { [key: string]: string }>;\n };\n}\n\nexport const iconButtonStyleOverrides = (): IconButtonStyleOverrides => ({\n styleOverrides: {\n sizeSmall: {\n height: '32px',\n width: '32px',\n },\n sizeMedium: {\n height: '48px',\n width: '48px',\n },\n\n },\n});\n"],"names":["styleOverrides","sizeSmall","height","width","sizeMedium"],"mappings":"8CAOwC,KAAA,CACpCA,eAAgB,CACdC,UAAW,CACTC,OAAQ,OACRC,MAAO,QAETC,WAAY,CACVF,OAAQ,OACRC,MAAO"}
@@ -1,13 +0,0 @@
1
- interface IconButtonStyleOverrides {
2
- styleOverrides: {
3
- sizeSmall: Record<string, string | {
4
- [key: string]: string;
5
- }>;
6
- sizeMedium: Record<string, string | {
7
- [key: string]: string;
8
- }>;
9
- };
10
- }
11
- declare const iconButtonStyleOverrides: () => IconButtonStyleOverrides;
12
-
13
- export { iconButtonStyleOverrides };
@@ -1,2 +0,0 @@
1
- const e=()=>({styleOverrides:{sizeSmall:{height:"32px",width:"32px"},sizeMedium:{height:"48px",width:"48px"}}});export{e as iconButtonStyleOverrides};
2
- //# sourceMappingURL=iconButtonThemeOverrides.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"iconButtonThemeOverrides.js","sources":["../../../../src/components/atoms/IconButton/iconButtonThemeOverrides.ts"],"sourcesContent":["interface IconButtonStyleOverrides {\n styleOverrides: {\n sizeSmall: Record<string, string | { [key: string]: string }>;\n sizeMedium: Record<string, string | { [key: string]: string }>;\n };\n}\n\nexport const iconButtonStyleOverrides = (): IconButtonStyleOverrides => ({\n styleOverrides: {\n sizeSmall: {\n height: '32px',\n width: '32px',\n },\n sizeMedium: {\n height: '48px',\n width: '48px',\n },\n\n },\n});\n"],"names":["iconButtonStyleOverrides","styleOverrides","sizeSmall","height","width","sizeMedium"],"mappings":"AAOO,MAAMA,EAA2B,KAAA,CACpCC,eAAgB,CACdC,UAAW,CACTC,OAAQ,OACRC,MAAO,QAETC,WAAY,CACVF,OAAQ,OACRC,MAAO"}