npm - @skodaflow/web-library - Versions diffs - 8.2.0 → 8.3.1 - Mend

@skodaflow/web-library 8.2.0 → 8.3.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 (285) hide show

package/cjs/components/advancedTable/agGrid.d.ts CHANGED Viewed

@@ -1,6 +1,21 @@
 import { BoxProps, CSSObject, Theme } from '@mui/material';
 import React from 'react';
 export declare const agGridStyles: (theme: Theme) => CSSObject;
+/**
+ * Pre-configured SkodaFlow AG Grid props.
+ *
+ * Note: the AG Grid `theme` is intentionally NOT provided here. Building the theme requires
+ * imports from `ag-grid-community` (`themeQuartz`, `iconOverrides`), which we do not want to pull
+ * in as a direct dependency of the library. The consuming project should build the theme with the
+ * exported `skodaAgThemeParams` and `skodaAgGridIconOverrides` helpers and pass it to `AgGridReact`.
+ */
+export declare const useSkodaAgGridProps: () => {
+    domLayout: "autoHeight";
+    animateRows: boolean;
+    suppressDragLeaveHidesColumns: boolean;
+    enableRtl: boolean;
+    enableCellTextSelection: boolean;
+};
 interface SkodaAgGridProviderProps extends BoxProps {
 }
 /**

package/cjs/components/advancedTable/agGrid.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var a=require("react/jsx-runtime"),e=require("@mui/material"),i=require("react"),r=require("./agGridVariables.js"),o=require("./agGridSkodaTheme.js"),n=require("./agGridIcons.js"),g=require("../../utils/sxOverride/sxOverride.js");const t=a=>{const e=o.skodaAgThemeParams(a);return{width:"100%","*":{maxWidth:"none"},'&:not(:has([class*="ag-theme-params-"])),&.ag-theme-material':{...r.agGridVariables(a)},".ag-row-last":{borderBottom:"none"},".ag-column-last .ag-header-cell-resize":{display:"none"},".ag-center-cols-container":{minWidth:"100%"},".ag-center-cols-viewport":{minHeight:"56px"},"& .ag-header-cell .ag-header-cell-text":{fontWeight:`${e.headerFontWeight}`},"& .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden":{display:"block !important",cursor:"initial"},"& .ag-body-horizontal-scroll":{alignItems:"center",px:"22px",borderTop:"1px solid",borderTopColor:a.palette.surface.secondary,maxHeight:"none !important",height:"auto !important"},"& .ag-body-horizontal-scroll .ag-body-horizontal-scroll-viewport":{mt:"16px",mb:"23px"},"& .ag-body-horizontal-scroll.ag-invisible .ag-body-horizontal-scroll-viewport":{my:0},"& .ag-paging-panel":{justifyContent:"center",px:"24px"},"& .ag-paging-panel .ag-paging-page-size":{position:"absolute"},"& .ag-paging-panel .ag-paging-page-summary-panel":{marginLeft:"auto"},"& .ag-paging-row-summary-panel":{display:"none"},"& .ag-paging-description":{fontSize:"18px",px:"18px"},"& .ag-paging-panel .ag-paging-description span":{color:"text.primary",px:"2px"},"& .ag-paging-panel .ag-paging-description .ag-paging-number":{fontWeight:"700"},"& .ag-paging-panel .ag-paging-description span:last-child":{fontWeight:"300"},"& .ag-paging-panel .ag-icon-first, & .ag-paging-panel .ag-icon-last":{display:"none"},"& .ag-paging-panel .ag-picker-field-wrapper":{border:"none",px:"0",cursor:"pointer",minWidth:"auto"},"& .ag-paging-panel .ag-picker-field-display":{minWidth:"28px",width:"auto",pr:"6px",fontSize:"18px",fontWeight:"700",textAlign:"center"},"& .ag-paging-panel .ag-label":{mr:"6px",fontSize:"18px"},"& .ag-popup > *":{backgroundColor:"onSurface.os0",cursor:"pointer",borderRadius:"0px"},"& .skoda-ag-row-pointer .ag-row:hover":{cursor:"pointer"},...n.agGridCssIcons,"& .ag-icon-asc, & .ag-icon-desc":{color:a.palette.onSurface.os600},"& .ag-icon-asc:hover, & .ag-icon-desc:hover":{color:a.palette.text.primary},"& .ag-header-cell-sortable .ag-sort-indicator-container:has(.ag-sort-descending-icon.ag-hidden) .ag-hidden:has(.ag-icon-asc)":{display:"inline-block !important"},"& .ag-header-cell-sortable .ag-hidden .ag-icon-asc::before":{content:'""',display:"flex",width:"17px",height:"17px",maskSize:"contain",maskRepeat:"no-repeat",maskPosition:"center",verticalAlign:"middle",maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(n.agGridIconsDefinition.ascHover.svg)})`},"& .ag-header-cell-sortable .ag-hidden .ag-icon-asc:hover::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(n.agGridIconsDefinition.asc.svg)})`},fontFamily:e.fontFamily}},s=i.forwardRef(({sx:i,children:r,...o},n)=>a.jsx(e.Box,{sx:g.sxOverride(a=>({...t(a)}),i),ref:n,...o,children:r}));exports.SkodaAgGridProvider=s,exports.agGridStyles=t;
+"use strict";var a=require("react/jsx-runtime"),e=require("@mui/material"),r=require("react"),o=require("./agGridVariables.js"),i=require("./agGridSkodaTheme.js"),t=require("./agGridIcons.js"),n=require("../../utils/sxOverride/sxOverride.js");const g=a=>{const e=i.skodaAgThemeParams(a);return{width:"100%","*":{maxWidth:"none"},'&:not(:has([class*="ag-theme-params-"])),&.ag-theme-material':{...o.agGridVariables(a)},".ag-row-last":{borderBottom:"none"},".ag-column-last .ag-header-cell-resize":{display:"none"},..."ltr"===a.direction&&{".ag-center-cols-container":{minWidth:"100%"}},".ag-center-cols-viewport":{minHeight:"56px"},"& .ag-header-cell .ag-header-cell-text":{fontWeight:`${e.headerFontWeight}`},"& .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden":{display:"block !important",cursor:"initial"},"& .ag-pinned-left-header .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden, & .ag-pinned-right-header .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden":{display:"none !important"},"@supports selector(::-webkit-scrollbar)":{"& .ag-body-horizontal-scroll":{alignItems:"center",borderTop:"1px solid",borderTopColor:a.palette.surface.secondary,maxHeight:"none !important",height:"auto !important"},"& .ag-body-horizontal-scroll .ag-body-horizontal-scroll-viewport":{height:"48px !important",maxHeight:"48px !important",minHeight:"48px !important"},"& .ag-body-horizontal-scroll-viewport::-webkit-scrollbar:horizontal":{height:"48px"},"& .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:horizontal, & .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track:horizontal":{borderWidth:"22px"},"& .ag-body-horizontal-scroll.ag-invisible .ag-body-horizontal-scroll-viewport":{height:"0 !important",maxHeight:"0 !important",minHeight:"0 !important",overflow:"hidden"},"& .ag-body-horizontal-scroll .ag-horizontal-left-spacer, & .ag-body-horizontal-scroll .ag-horizontal-right-spacer":{overflow:"hidden"}},"& .ag-paging-panel":{justifyContent:"center",px:"24px"},"& .ag-paging-panel .ag-paging-page-size":{position:"absolute"},"& .ag-paging-panel .ag-paging-page-summary-panel":{marginLeft:"auto"},"& .ag-paging-row-summary-panel":{display:"none"},"& .ag-paging-description":{fontSize:"18px",px:"18px"},"& .ag-paging-panel .ag-paging-description span":{color:"text.primary",px:"2px"},"& .ag-paging-panel .ag-paging-description .ag-paging-number":{fontWeight:"700"},"& .ag-paging-panel .ag-paging-description span:last-child":{fontWeight:"300"},"& .ag-paging-panel .ag-icon-first, & .ag-paging-panel .ag-icon-last":{display:"none"},"& .ag-paging-panel .ag-picker-field-wrapper":{border:"none",px:"0",cursor:"pointer",minWidth:"auto"},"& .ag-paging-panel .ag-picker-field-display":{minWidth:"28px",width:"auto",pr:"6px",fontSize:"18px",fontWeight:"700",textAlign:"center"},"& .ag-paging-panel .ag-label":{mr:"6px",fontSize:"18px"},"& .ag-popup > *":{backgroundColor:"onSurface.os0",cursor:"pointer",borderRadius:"0px"},"& .ag-selectable .ag-cell":{cursor:"auto"},"& .skoda-ag-row-pointer .ag-row:hover, & .skoda-ag-row-pointer .ag-row:hover .ag-cell":{cursor:"pointer"},...t.agGridCssIcons,"& .ag-icon-asc, & .ag-icon-desc":{color:a.palette.onSurface.os600},"& .ag-icon-asc:hover, & .ag-icon-desc:hover":{color:a.palette.text.primary},"& .ag-header-cell-sortable .ag-sort-indicator-container:has(.ag-sort-descending-icon.ag-hidden) .ag-hidden:has(.ag-icon-asc)":{display:"inline-block !important"},fontFamily:e.fontFamily}},l=r.forwardRef(({sx:r,children:o,...i},t)=>a.jsx(e.Box,{sx:n.sxOverride(a=>({...g(a)}),r),ref:t,...i,children:o}));exports.SkodaAgGridProvider=l,exports.agGridStyles=g,exports.useSkodaAgGridProps=()=>({domLayout:"autoHeight",animateRows:!1,suppressDragLeaveHidesColumns:!0,enableRtl:"rtl"===e.useTheme().direction,enableCellTextSelection:!0});
 //# sourceMappingURL=agGrid.js.map

package/cjs/components/advancedTable/agGrid.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"agGrid.js","sources":["../../../../../src/components/advancedTable/agGrid.tsx"],"sourcesContent":["import { Box, BoxProps, CSSObject, Theme } from '@mui/material';\nimport React, { forwardRef } from 'react';\nimport { agGridVariables } from './agGridVariables';\nimport { skodaAgThemeParams } from './agGridSkodaTheme';\nimport { agGridCssIcons, agGridIconsDefinition } from './agGridIcons';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\nexport const agGridStyles = (theme: Theme): CSSObject => {\n const agTheme = skodaAgThemeParams(theme);\n\n return {\n width: '100%',\n // support applying global style on all elements maxWidth: '100%'\n '': {\n maxWidth: 'none',\n },\n // Apply CSS variables only for non-themed tables of the old versions of ag grid (old versions of ag-grid, <v33, themes does not have ag-theme-params- class)\n '&:not(:has([class=\"ag-theme-params-\"])),&.ag-theme-material': {\n ...agGridVariables(theme),\n },\n\n '.ag-row-last': { borderBottom: 'none' },\n '.ag-column-last .ag-header-cell-resize': { display: 'none' },\n\n // Row lines full width\n '.ag-center-cols-container': {\n minWidth: '100%',\n },\n\n '.ag-center-cols-viewport': {\n // reduce to 1 row from default 150px\n minHeight: '56px',\n },\n\n // # Header styles\n '& .ag-header-cell .ag-header-cell-text': {\n fontWeight: `${agTheme.headerFontWeight}`,\n },\n\n // # Header Separators (only when column resizing is not activated and not for the last column)\n '& .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden': {\n display: 'block !important',\n cursor: 'initial',\n },\n\n // # Horizontal Scrollbar\n '& .ag-body-horizontal-scroll': {\n alignItems: 'center',\n px: '22px',\n borderTop: '1px solid',\n borderTopColor: theme.palette.surface.secondary,\n maxHeight: 'none !important',\n height: 'auto !important',\n },\n '& .ag-body-horizontal-scroll .ag-body-horizontal-scroll-viewport': {\n mt: '16px',\n mb: '23px',\n },\n '& .ag-body-horizontal-scroll.ag-invisible .ag-body-horizontal-scroll-viewport': {\n my: 0,\n },\n\n // # Pagination styles\n '& .ag-paging-panel': {\n justifyContent: 'center',\n px: '24px',\n },\n\n // Pagination layout - rows per page centered, arrows right-aligned\n '& .ag-paging-panel .ag-paging-page-size': {\n position: 'absolute',\n },\n '& .ag-paging-panel .ag-paging-page-summary-panel': {\n marginLeft: 'auto',\n },\n\n // Disable pagination summary\n '& .ag-paging-row-summary-panel': {\n display: 'none',\n },\n\n // Text styling within pagination arrows\n '& .ag-paging-description': {\n fontSize: '18px',\n px: '18px',\n },\n '& .ag-paging-panel .ag-paging-description span': {\n color: 'text.primary',\n px: '2px',\n },\n '& .ag-paging-panel .ag-paging-description .ag-paging-number': {\n fontWeight: '700',\n },\n '& .ag-paging-panel .ag-paging-description span:last-child': {\n fontWeight: '300',\n },\n\n // Disable AG-grid pagination icons - start, end\n '& .ag-paging-panel .ag-icon-first, & .ag-paging-panel .ag-icon-last': {\n display: 'none',\n },\n\n // Pagination - rows per page\n '& .ag-paging-panel .ag-picker-field-wrapper': {\n border: 'none',\n px: '0',\n cursor: 'pointer',\n minWidth: 'auto',\n },\n '& .ag-paging-panel .ag-picker-field-display': {\n minWidth: '28px',\n width: 'auto',\n pr: '6px',\n fontSize: '18px',\n fontWeight: '700',\n textAlign: 'center',\n },\n '& .ag-paging-panel .ag-label': {\n mr: '6px',\n fontSize: '18px',\n },\n\n '& .ag-popup > ': {\n backgroundColor: 'onSurface.os0',\n cursor: 'pointer',\n borderRadius: '0px',\n },\n\n // # Opt-in className=\"skoda-ag-pointer\"\n '& .skoda-ag-row-pointer .ag-row:hover': {\n cursor: 'pointer',\n },\n\n // Additional icons\n ...agGridCssIcons,\n\n // Show icons according to the SkodaFlow design\n '& .ag-icon-asc, & .ag-icon-desc': {\n color: theme.palette.onSurface.os600,\n },\n '& .ag-icon-asc:hover, & .ag-icon-desc:hover': {\n color: theme.palette.text.primary,\n },\n '& .ag-header-cell-sortable .ag-sort-indicator-container:has(.ag-sort-descending-icon.ag-hidden) .ag-hidden:has(.ag-icon-asc)':\n {\n display: 'inline-block !important', // Ag grid also uses !important so we have to override it\n },\n\n '& .ag-header-cell-sortable .ag-hidden .ag-icon-asc::before': {\n content: '\"\"',\n display: 'flex',\n width: '17px',\n height: '17px',\n maskSize: 'contain',\n maskRepeat: 'no-repeat',\n maskPosition: 'center',\n verticalAlign: 'middle',\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.ascHover.svg)})`,\n },\n '& .ag-header-cell-sortable .ag-hidden .ag-icon-asc:hover::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.asc.svg)})`,\n },\n\n // Legacy class approach, no theme\n fontFamily: agTheme.fontFamily,\n };\n};\n\ninterface SkodaAgGridProviderProps extends BoxProps {}\n\n/*\n A provider wrapper that applies Skoda AG Grid theming via sx.\n */\nexport const SkodaAgGridProvider: React.FC<SkodaAgGridProviderProps> = forwardRef(({ sx, children, ...rest }, ref) => {\n return (\n <Box\n sx={sxOverride(\n (theme) => ({\n ...agGridStyles(theme),\n }),\n sx,\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </Box>\n );\n});\n"],"names":["agGridStyles","theme","agTheme","skodaAgThemeParams","width","maxWidth","agGridVariables","borderBottom","display","minWidth","minHeight","fontWeight","headerFontWeight","cursor","alignItems","px","borderTop","borderTopColor","palette","surface","secondary","maxHeight","height","mt","mb","my","justifyContent","position","marginLeft","fontSize","color","border","pr","textAlign","mr","backgroundColor","borderRadius","agGridCssIcons","onSurface","os600","text","primary","content","maskSize","maskRepeat","maskPosition","verticalAlign","maskImage","encodeURIComponent","agGridIconsDefinition","ascHover","svg","asc","fontFamily","SkodaAgGridProvider","forwardRef","sx","children","rest","ref","_jsx","Box","sxOverride"],"mappings":"mPAOO,MAAMA,EAAgBC,IAC3B,MAAMC,EAAUC,EAAAA,mBAAmBF,GAEnC,MAAO,CACLG,MAAO,OAEP,IAAK,CACHC,SAAU,QAGZ,+DAAgE,IAC3DC,EAAAA,gBAAgBL,IAGrB,eAAgB,CAAEM,aAAc,QAChC,yCAA0C,CAAEC,QAAS,QAGrD,4BAA6B,CAC3BC,SAAU,QAGZ,2BAA4B,CAE1BC,UAAW,QAIb,yCAA0C,CACxCC,WAAY,GAAGT,EAAQU,oBAIzB,4EAA6E,CAC3EJ,QAAS,mBACTK,OAAQ,WAIV,+BAAgC,CAC9BC,WAAY,SACZC,GAAI,OACJC,UAAW,YACXC,eAAgBhB,EAAMiB,QAAQC,QAAQC,UACtCC,UAAW,kBACXC,OAAQ,mBAEV,mEAAoE,CAClEC,GAAI,OACJC,GAAI,QAEN,gFAAiF,CAC/EC,GAAI,GAIN,qBAAsB,CACpBC,eAAgB,SAChBX,GAAI,QAIN,0CAA2C,CACzCY,SAAU,YAEZ,mDAAoD,CAClDC,WAAY,QAId,iCAAkC,CAChCpB,QAAS,QAIX,2BAA4B,CAC1BqB,SAAU,OACVd,GAAI,QAEN,iDAAkD,CAChDe,MAAO,eACPf,GAAI,OAEN,8DAA+D,CAC7DJ,WAAY,OAEd,4DAA6D,CAC3DA,WAAY,OAId,sEAAuE,CACrEH,QAAS,QAIX,8CAA+C,CAC7CuB,OAAQ,OACRhB,GAAI,IACJF,OAAQ,UACRJ,SAAU,QAEZ,8CAA+C,CAC7CA,SAAU,OACVL,MAAO,OACP4B,GAAI,MACJH,SAAU,OACVlB,WAAY,MACZsB,UAAW,UAEb,+BAAgC,CAC9BC,GAAI,MACJL,SAAU,QAGZ,kBAAmB,CACjBM,gBAAiB,gBACjBtB,OAAQ,UACRuB,aAAc,OAIhB,wCAAyC,CACvCvB,OAAQ,cAIPwB,EAAAA,eAGH,kCAAmC,CACjCP,MAAO7B,EAAMiB,QAAQoB,UAAUC,OAEjC,8CAA+C,CAC7CT,MAAO7B,EAAMiB,QAAQsB,KAAKC,SAE5B,+HACE,CACEjC,QAAS,2BAGb,6DAA8D,CAC5DkC,QAAS,KACTlC,QAAS,OACTJ,MAAO,OACPkB,OAAQ,OACRqB,SAAU,UACVC,WAAY,YACZC,aAAc,SACdC,cAAe,SACfC,UAAW,+BAA+BC,mBAAmBC,EAAAA,sBAAsBC,SAASC,SAE9F,mEAAoE,CAClEJ,UAAW,+BAA+BC,mBAAmBC,EAAAA,sBAAsBG,IAAID,SAIzFE,WAAYnD,EAAQmD,aASXC,EAA0DC,EAAAA,WAAW,EAAGC,KAAIC,cAAaC,GAAQC,IAE1GC,EAAAA,IAACC,EAAAA,IAAG,CACFL,GAAIM,EAAAA,WACD7D,IAAK,IACDD,EAAaC,KAElBuD,GAEFG,IAAKA,KACDD,EAAID,SAEPA"}
1	+ {"version":3,"file":"agGrid.js","sources":["../../../../../src/components/advancedTable/agGrid.tsx"],"sourcesContent":["import { Box, BoxProps, CSSObject, Theme, useTheme } from '@mui/material';\nimport React, { forwardRef } from 'react';\nimport { agGridVariables } from './agGridVariables';\nimport { skodaAgThemeParams } from './agGridSkodaTheme';\nimport { agGridCssIcons } from './agGridIcons';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\nexport const agGridStyles = (theme: Theme): CSSObject => {\n const agTheme = skodaAgThemeParams(theme);\n\n return {\n width: '100%',\n // support applying global style on all elements maxWidth: '100%'\n '': {\n maxWidth: 'none',\n },\n // Apply CSS variables only for non-themed tables of the old versions of ag grid (old versions of ag-grid, <v33, themes does not have ag-theme-params- class)\n '&:not(:has([class=\"ag-theme-params-\"])),&.ag-theme-material': {\n ...agGridVariables(theme),\n },\n\n '.ag-row-last': { borderBottom: 'none' },\n '.ag-column-last .ag-header-cell-resize': { display: 'none' },\n\n // Row lines full width (not in RTL where it causes layout issues)\n ...(theme.direction === 'ltr' && {\n '.ag-center-cols-container': {\n minWidth: '100%',\n },\n }),\n\n '.ag-center-cols-viewport': {\n // reduce to 1 row from default 150px\n minHeight: '56px',\n },\n\n // # Header styles\n '& .ag-header-cell .ag-header-cell-text': {\n fontWeight: `${agTheme.headerFontWeight}`,\n },\n\n // # Header Separators (only when column resizing is not activated and not for the last column)\n '& .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden': {\n display: 'block !important', // beats AG Grid's .ag-hidden display: none !important\n cursor: 'initial',\n },\n // No separator on pinned columns - ag-column-last only marks the grid's last column, so the rule\n // above would otherwise force one onto them. The pinned section already has its own divider.\n '& .ag-pinned-left-header .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden, & .ag-pinned-right-header .ag-header-cell:not(.ag-column-last) > .ag-header-cell-resize.ag-hidden':\n {\n display: 'none !important',\n },\n\n // # Horizontal Scrollbar\n // Webkit only: relies on ::-webkit-scrollbar. Firefox falls back to the baseline thin scrollbar.\n '@supports selector(::-webkit-scrollbar)': {\n '& .ag-body-horizontal-scroll': {\n alignItems: 'center',\n borderTop: '1px solid',\n borderTopColor: theme.palette.surface.secondary,\n maxHeight: 'none !important',\n height: 'auto !important',\n },\n // Tall scrollbar inset via the thumb/track border (like MuiTableContainer), so the viewport\n // keeps full width and the proxy stays in sync with the grid body. !important beats AG Grid's\n // inline height, which it pins to the ~8px scrollbar width.\n '& .ag-body-horizontal-scroll .ag-body-horizontal-scroll-viewport': {\n // 4px visible bar + 2x 22px transparent margin\n height: '48px !important',\n maxHeight: '48px !important',\n minHeight: '48px !important',\n },\n '& .ag-body-horizontal-scroll-viewport::-webkit-scrollbar:horizontal': {\n height: '48px',\n },\n '& .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:horizontal, & .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track:horizontal':\n {\n borderWidth: '22px',\n },\n // No overflow: re-collapse the viewport, otherwise our !important height keeps a tall empty band.\n '& .ag-body-horizontal-scroll.ag-invisible .ag-body-horizontal-scroll-viewport': {\n height: '0 !important',\n maxHeight: '0 !important',\n minHeight: '0 !important',\n overflow: 'hidden',\n },\n // Hide the stray scrollbar the pinned spacers render via their own overflow-x: scroll.\n '& .ag-body-horizontal-scroll .ag-horizontal-left-spacer, & .ag-body-horizontal-scroll .ag-horizontal-right-spacer':\n {\n overflow: 'hidden',\n },\n },\n\n // # Pagination styles\n '& .ag-paging-panel': {\n justifyContent: 'center',\n px: '24px',\n },\n\n // Pagination layout - rows per page centered, arrows right-aligned\n '& .ag-paging-panel .ag-paging-page-size': {\n position: 'absolute',\n },\n '& .ag-paging-panel .ag-paging-page-summary-panel': {\n marginLeft: 'auto',\n },\n\n // Disable pagination summary\n '& .ag-paging-row-summary-panel': {\n display: 'none',\n },\n\n // Text styling within pagination arrows\n '& .ag-paging-description': {\n fontSize: '18px',\n px: '18px',\n },\n '& .ag-paging-panel .ag-paging-description span': {\n color: 'text.primary',\n px: '2px',\n },\n '& .ag-paging-panel .ag-paging-description .ag-paging-number': {\n fontWeight: '700',\n },\n '& .ag-paging-panel .ag-paging-description span:last-child': {\n fontWeight: '300',\n },\n\n // Disable AG-grid pagination icons - start, end\n '& .ag-paging-panel .ag-icon-first, & .ag-paging-panel .ag-icon-last': {\n display: 'none',\n },\n\n // Pagination - rows per page\n '& .ag-paging-panel .ag-picker-field-wrapper': {\n border: 'none',\n px: '0',\n cursor: 'pointer',\n minWidth: 'auto',\n },\n '& .ag-paging-panel .ag-picker-field-display': {\n minWidth: '28px',\n width: 'auto',\n pr: '6px',\n fontSize: '18px',\n fontWeight: '700',\n textAlign: 'center',\n },\n '& .ag-paging-panel .ag-label': {\n mr: '6px',\n fontSize: '18px',\n },\n\n '& .ag-popup > ': {\n backgroundColor: 'onSurface.os0',\n cursor: 'pointer',\n borderRadius: '0px',\n },\n\n // Let the cursor reflect content (I-beam over text, default elsewhere) - AG Grid forces\n // cursor: default on the root. ag-selectable is present only when enableCellTextSelection is on.\n '& .ag-selectable .ag-cell': {\n cursor: 'auto',\n },\n\n // # Opt-in className=\"skoda-ag-pointer\"\n // Cell-level so it wins over the .ag-cell text cursor above (the cell sets its own cursor).\n '& .skoda-ag-row-pointer .ag-row:hover, & .skoda-ag-row-pointer .ag-row:hover .ag-cell': {\n cursor: 'pointer',\n },\n\n // Additional icons\n ...agGridCssIcons,\n\n // Show icons according to the SkodaFlow design\n '& .ag-icon-asc, & .ag-icon-desc': {\n color: theme.palette.onSurface.os600,\n },\n '& .ag-icon-asc:hover, & .ag-icon-desc:hover': {\n color: theme.palette.text.primary,\n },\n '& .ag-header-cell-sortable .ag-sort-indicator-container:has(.ag-sort-descending-icon.ag-hidden) .ag-hidden:has(.ag-icon-asc)':\n {\n display: 'inline-block !important', // Ag grid also uses !important so we have to override it\n },\n\n // Legacy class approach, no theme\n fontFamily: agTheme.fontFamily,\n };\n};\n\n/*\n Pre-configured SkodaFlow AG Grid props.\n \n Note: the AG Grid `theme` is intentionally NOT provided here. Building the theme requires\n * imports from `ag-grid-community` (`themeQuartz`, `iconOverrides`), which we do not want to pull\n * in as a direct dependency of the library. The consuming project should build the theme with the\n * exported `skodaAgThemeParams` and `skodaAgGridIconOverrides` helpers and pass it to `AgGridReact`.\n /\nexport const useSkodaAgGridProps = () => {\n const theme = useTheme();\n\n return {\n domLayout: 'autoHeight' as const,\n animateRows: false,\n suppressDragLeaveHidesColumns: true,\n enableRtl: theme.direction === 'rtl',\n // allow selecting/copying cell text (off in AG Grid by default)\n enableCellTextSelection: true,\n };\n};\n\ninterface SkodaAgGridProviderProps extends BoxProps {}\n\n/\n A provider wrapper that applies Skoda AG Grid theming via sx.\n */\nexport const SkodaAgGridProvider: React.FC<SkodaAgGridProviderProps> = forwardRef(({ sx, children, ...rest }, ref) => {\n return (\n <Box\n sx={sxOverride(\n (theme) => ({\n ...agGridStyles(theme),\n }),\n sx,\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </Box>\n );\n});\n"],"names":["agGridStyles","theme","agTheme","skodaAgThemeParams","width","maxWidth","agGridVariables","borderBottom","display","direction","minWidth","minHeight","fontWeight","headerFontWeight","cursor","alignItems","borderTop","borderTopColor","palette","surface","secondary","maxHeight","height","borderWidth","overflow","justifyContent","px","position","marginLeft","fontSize","color","border","pr","textAlign","mr","backgroundColor","borderRadius","agGridCssIcons","onSurface","os600","text","primary","fontFamily","SkodaAgGridProvider","forwardRef","sx","children","rest","ref","_jsx","Box","sxOverride","domLayout","animateRows","suppressDragLeaveHidesColumns","enableRtl","useTheme","enableCellTextSelection"],"mappings":"mPAOO,MAAMA,EAAgBC,IAC3B,MAAMC,EAAUC,EAAAA,mBAAmBF,GAEnC,MAAO,CACLG,MAAO,OAEP,IAAK,CACHC,SAAU,QAGZ,+DAAgE,IAC3DC,EAAAA,gBAAgBL,IAGrB,eAAgB,CAAEM,aAAc,QAChC,yCAA0C,CAAEC,QAAS,WAG7B,QAApBP,EAAMQ,WAAuB,CAC/B,4BAA6B,CAC3BC,SAAU,SAId,2BAA4B,CAE1BC,UAAW,QAIb,yCAA0C,CACxCC,WAAY,GAAGV,EAAQW,oBAIzB,4EAA6E,CAC3EL,QAAS,mBACTM,OAAQ,WAIV,sMACE,CACEN,QAAS,mBAKb,0CAA2C,CACzC,+BAAgC,CAC9BO,WAAY,SACZC,UAAW,YACXC,eAAgBhB,EAAMiB,QAAQC,QAAQC,UACtCC,UAAW,kBACXC,OAAQ,mBAKV,mEAAoE,CAElEA,OAAQ,kBACRD,UAAW,kBACXV,UAAW,mBAEb,sEAAuE,CACrEW,OAAQ,QAEV,uJACE,CACEC,YAAa,QAGjB,gFAAiF,CAC/ED,OAAQ,eACRD,UAAW,eACXV,UAAW,eACXa,SAAU,UAGZ,oHACE,CACEA,SAAU,WAKhB,qBAAsB,CACpBC,eAAgB,SAChBC,GAAI,QAIN,0CAA2C,CACzCC,SAAU,YAEZ,mDAAoD,CAClDC,WAAY,QAId,iCAAkC,CAChCpB,QAAS,QAIX,2BAA4B,CAC1BqB,SAAU,OACVH,GAAI,QAEN,iDAAkD,CAChDI,MAAO,eACPJ,GAAI,OAEN,8DAA+D,CAC7Dd,WAAY,OAEd,4DAA6D,CAC3DA,WAAY,OAId,sEAAuE,CACrEJ,QAAS,QAIX,8CAA+C,CAC7CuB,OAAQ,OACRL,GAAI,IACJZ,OAAQ,UACRJ,SAAU,QAEZ,8CAA+C,CAC7CA,SAAU,OACVN,MAAO,OACP4B,GAAI,MACJH,SAAU,OACVjB,WAAY,MACZqB,UAAW,UAEb,+BAAgC,CAC9BC,GAAI,MACJL,SAAU,QAGZ,kBAAmB,CACjBM,gBAAiB,gBACjBrB,OAAQ,UACRsB,aAAc,OAKhB,4BAA6B,CAC3BtB,OAAQ,QAKV,wFAAyF,CACvFA,OAAQ,cAIPuB,EAAAA,eAGH,kCAAmC,CACjCP,MAAO7B,EAAMiB,QAAQoB,UAAUC,OAEjC,8CAA+C,CAC7CT,MAAO7B,EAAMiB,QAAQsB,KAAKC,SAE5B,+HACE,CACEjC,QAAS,2BAIbkC,WAAYxC,EAAQwC,aA8BXC,EAA0DC,EAAAA,WAAW,EAAGC,KAAIC,cAAaC,GAAQC,IAE1GC,EAAAA,IAACC,EAAAA,IAAG,CACFL,GAAIM,EAAAA,WACDlD,IAAK,IACDD,EAAaC,KAElB4C,GAEFG,IAAKA,KACDD,EAAID,SAEPA,sFA9B4B,KAG1B,CACLM,UAAW,aACXC,aAAa,EACbC,+BAA+B,EAC/BC,UAA+B,QANnBC,EAAAA,WAMK/C,UAEjBgD,yBAAyB"}

package/cjs/components/advancedTable/agGridIcons.d.ts CHANGED Viewed

@@ -65,10 +65,16 @@ export declare const skodaAgGridIconOverrides: (customIcons?: {
     };
 };
 export declare const agGridCssIcons: {
-    '.ag-icon-desc:hover::before': {
+    '.ag-icon-desc::before, .ag-header-cell-sortable .ag-hidden .ag-icon-desc:hover::before': {
         maskImage: string;
     };
-    '.ag-icon-asc:hover::before': {
+    '.ag-icon-asc::before, .ag-header-cell-sortable .ag-hidden .ag-icon-asc:hover::before': {
+        maskImage: string;
+    };
+    '.ag-icon-desc:hover::before, .ag-header-cell-sortable .ag-hidden .ag-icon-desc::before': {
+        maskImage: string;
+    };
+    '.ag-icon-asc:hover::before, .ag-header-cell-sortable .ag-hidden .ag-icon-asc::before': {
         maskImage: string;
     };
 };

package/cjs/components/advancedTable/agGridIcons.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const s={previous:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.86 18.24L11.58 19.52L4.02 11.96L11.58 4.4L12.86 5.68L7.56 10.92H19.58V13H7.56L12.86 18.24Z"></path></svg>'},next:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M4.42 10.92H16.44L11.14 5.68L12.42 4.4L19.98 11.96L12.42 19.52L11.14 18.24L16.44 13H4.42V10.92Z"></path></svg>'},first:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M9.3 11.96L17.36 5L18.64 6.44L12.1 11.96L18.64 17.48L17.36 18.92L9.3 11.96ZM6.3 5.32H8.26V18.6H6.3V5.32Z"></path></svg>'},last:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M14.7 11.96L6.64 18.92L5.36 17.48L11.9 11.96L5.36 6.44L6.64 5L14.7 11.96ZM17.7 18.6H15.74V5.32H17.7V18.6Z"></path></svg>'},"small-down":{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 16.42L4.64 9.06L6.12 7.58L12 13.46L17.88 7.58L19.36 9.06L12 16.42Z"></path></svg>'},asc:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM11.22 15.92H12.78V10.4L15.34 13.04L16.3 12.1L11.96 7.76L7.7 12.1L8.66 13.04L11.22 10.34V15.92Z"></path></svg>'},ascHover:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98ZM11.22 15.92V10.36L8.66 13.04L7.7 12.1L12 7.76L16.3 12.1L15.34 13.04L12.78 10.36V15.92H11.22Z"></path></svg>'},desc:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12.78 8H11.22V13.52L8.66 10.88L7.7 11.82L12.04 16.16L16.3 11.82L15.34 10.88L12.78 13.58V8Z"></path></svg>'},descHover:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94ZM12.78 8V13.56L15.34 10.88L16.3 11.82L12 16.16L7.7 11.82L8.66 10.88L11.22 13.56V8H12.78Z"></path></svg>'}},o={".ag-icon-desc:hover::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(s.descHover.svg)})`},".ag-icon-asc:hover::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(s.ascHover.svg)})`}};exports.agGridCssIcons=o,exports.agGridIconsDefinition=s,exports.skodaAgGridIconOverrides=o=>({type:"image",mask:!0,icons:{...s,...Object.fromEntries((o??[]).map(s=>[s.name,{svg:s.svg}]))}});
+"use strict";const o={previous:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.86 18.24L11.58 19.52L4.02 11.96L11.58 4.4L12.86 5.68L7.56 10.92H19.58V13H7.56L12.86 18.24Z"></path></svg>'},next:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M4.42 10.92H16.44L11.14 5.68L12.42 4.4L19.98 11.96L12.42 19.52L11.14 18.24L16.44 13H4.42V10.92Z"></path></svg>'},first:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M9.3 11.96L17.36 5L18.64 6.44L12.1 11.96L18.64 17.48L17.36 18.92L9.3 11.96ZM6.3 5.32H8.26V18.6H6.3V5.32Z"></path></svg>'},last:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M14.7 11.96L6.64 18.92L5.36 17.48L11.9 11.96L5.36 6.44L6.64 5L14.7 11.96ZM17.7 18.6H15.74V5.32H17.7V18.6Z"></path></svg>'},"small-down":{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 16.42L4.64 9.06L6.12 7.58L12 13.46L17.88 7.58L19.36 9.06L12 16.42Z"></path></svg>'},asc:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM11.22 15.92H12.78V10.4L15.34 13.04L16.3 12.1L11.96 7.76L7.7 12.1L8.66 13.04L11.22 10.34V15.92Z"></path></svg>'},ascHover:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98ZM11.22 15.92V10.36L8.66 13.04L7.7 12.1L12 7.76L16.3 12.1L15.34 13.04L12.78 10.36V15.92H11.22Z"></path></svg>'},desc:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12.78 8H11.22V13.52L8.66 10.88L7.7 11.82L12.04 16.16L16.3 11.82L15.34 10.88L12.78 13.58V8Z"></path></svg>'},descHover:{svg:'<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" focusable="false" aria-hidden="true" viewBox="2 2 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94ZM12.78 8V13.56L15.34 10.88L16.3 11.82L12 16.16L7.7 11.82L8.66 10.88L11.22 13.56V8H12.78Z"></path></svg>'}},s={".ag-icon-desc::before, .ag-header-cell-sortable .ag-hidden .ag-icon-desc:hover::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(o.desc.svg)})`},".ag-icon-asc::before, .ag-header-cell-sortable .ag-hidden .ag-icon-asc:hover::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(o.asc.svg)})`},".ag-icon-desc:hover::before, .ag-header-cell-sortable .ag-hidden .ag-icon-desc::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(o.descHover.svg)})`},".ag-icon-asc:hover::before, .ag-header-cell-sortable .ag-hidden .ag-icon-asc::before":{maskImage:`url(data:image/svg+xml;utf8,${encodeURIComponent(o.ascHover.svg)})`}};exports.agGridCssIcons=s,exports.agGridIconsDefinition=o,exports.skodaAgGridIconOverrides=s=>({type:"image",mask:!0,icons:{...o,...Object.fromEntries((s??[]).map(o=>[o.name,{svg:o.svg}]))}});
 //# sourceMappingURL=agGridIcons.js.map

package/cjs/components/advancedTable/agGridIcons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"agGridIcons.js","sources":["../../../../../src/components/advancedTable/agGridIcons.tsx"],"sourcesContent":["// hotfix to avoid using react-dom/server which can cause issues in Next\n// later the source of flow-icons2 should be used instead\nexport const agGridIconsDefinition = {\n previous: {\n // ArrowLeftIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.86 18.24L11.58 19.52L4.02 11.96L11.58 4.4L12.86 5.68L7.56 10.92H19.58V13H7.56L12.86 18.24Z\"></path></svg>',\n },\n next: {\n // ArrowRightIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M4.42 10.92H16.44L11.14 5.68L12.42 4.4L19.98 11.96L12.42 19.52L11.14 18.24L16.44 13H4.42V10.92Z\"></path></svg>',\n },\n first: {\n // ChevronPreviousIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.3 11.96L17.36 5L18.64 6.44L12.1 11.96L18.64 17.48L17.36 18.92L9.3 11.96ZM6.3 5.32H8.26V18.6H6.3V5.32Z\"></path></svg>',\n },\n last: {\n // ChevronNextIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M14.7 11.96L6.64 18.92L5.36 17.48L11.9 11.96L5.36 6.44L6.64 5L14.7 11.96ZM17.7 18.6H15.74V5.32H17.7V18.6Z\"></path></svg>',\n },\n 'small-down': {\n // ChevronDownIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 16.42L4.64 9.06L6.12 7.58L12 13.46L17.88 7.58L19.36 9.06L12 16.42Z\"></path></svg>',\n },\n asc: {\n // ArrowCircleUpFilledIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM11.22 15.92H12.78V10.4L15.34 13.04L16.3 12.1L11.96 7.76L7.7 12.1L8.66 13.04L11.22 10.34V15.92Z\"></path></svg>',\n },\n ascHover: {\n // ArrowCircleUpIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98ZM11.22 15.92V10.36L8.66 13.04L7.7 12.1L12 7.76L16.3 12.1L15.34 13.04L12.78 10.36V15.92H11.22Z\"></path></svg>',\n },\n desc: {\n // ArrowCircleDownFilledIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12.78 8H11.22V13.52L8.66 10.88L7.7 11.82L12.04 16.16L16.3 11.82L15.34 10.88L12.78 13.58V8Z\"></path></svg>',\n },\n descHover: {\n // ArrowCircleDownIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94ZM12.78 8V13.56L15.34 10.88L16.3 11.82L12 16.16L7.7 11.82L8.66 10.88L11.22 13.56V8H12.78Z\"></path></svg>',\n },\n};\n\n/** Maps AG Grid icons to Skoda Flow library icons, overrides icons in AG Grid Theme */\nexport const skodaAgGridIconOverrides = (customIcons?: { name: string; svg: string }[]) => {\n return {\n type: 'image' as const,\n mask: true, // for icons to use AG Grid currentColor\n icons: {\n ...agGridIconsDefinition,\n ...Object.fromEntries((customIcons ?? []).map((icon) => [icon.name, { svg: icon.svg }])),\n },\n };\n};\n\nexport const agGridCssIcons = {\n '.ag-icon-desc:hover::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.descHover.svg)})`,\n },\n '.ag-icon-asc:hover::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.ascHover.svg)})`,\n },\n};\n"],"names":["agGridIconsDefinition","previous","svg","next","first","last","asc","ascHover","desc","descHover","agGridCssIcons","maskImage","encodeURIComponent","customIcons","type","mask","icons","Object","fromEntries","map","icon","name"],"mappings":"aAEO,MAAMA,EAAwB,CACnCC,SAAU,CAERC,IAAK,ySAEPC,KAAM,CAEJD,IAAK,0SAEPE,MAAO,CAELF,IAAK,mTAEPG,KAAM,CAEJH,IAAK,oTAEP,aAAc,CAEZA,IAAK,iRAEPI,IAAK,CAEHJ,IAAK,obAEPK,SAAU,CAERL,IAAK,ujBAEPM,KAAM,CAEJN,IAAK,+aAEPO,UAAW,CAETP,IAAK,mjBAgBIQ,EAAiB,CAC5B,~~8BAA~~+B,~~CAC7BC~~,UAAW,+BAA+BC,mBAAmBZ,EAAsBS,UAAUP,SAE/F,~~6BAA8B~~,~~CAC5BS~~,UAAW,+BAA+BC,mBAAmBZ,EAAsBO,SAASL,~~oGAhBvDW~~,IAChC,CACLC,KAAM,QACNC,MAAM,EACNC,MAAO,IACFhB,KACAiB,OAAOC,aAAaL,GAAe,IAAIM,IAAKC,GAAS,CAACA,EAAKC,KAAM,CAAEnB,IAAKkB,EAAKlB"}
1	+ {"version":3,"file":"agGridIcons.js","sources":["../../../../../src/components/advancedTable/agGridIcons.tsx"],"sourcesContent":["// hotfix to avoid using react-dom/server which can cause issues in Next\n// later the source of flow-icons2 should be used instead\nexport const agGridIconsDefinition = {\n previous: {\n // ArrowLeftIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.86 18.24L11.58 19.52L4.02 11.96L11.58 4.4L12.86 5.68L7.56 10.92H19.58V13H7.56L12.86 18.24Z\"></path></svg>',\n },\n next: {\n // ArrowRightIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M4.42 10.92H16.44L11.14 5.68L12.42 4.4L19.98 11.96L12.42 19.52L11.14 18.24L16.44 13H4.42V10.92Z\"></path></svg>',\n },\n first: {\n // ChevronPreviousIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.3 11.96L17.36 5L18.64 6.44L12.1 11.96L18.64 17.48L17.36 18.92L9.3 11.96ZM6.3 5.32H8.26V18.6H6.3V5.32Z\"></path></svg>',\n },\n last: {\n // ChevronNextIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M14.7 11.96L6.64 18.92L5.36 17.48L11.9 11.96L5.36 6.44L6.64 5L14.7 11.96ZM17.7 18.6H15.74V5.32H17.7V18.6Z\"></path></svg>',\n },\n 'small-down': {\n // ChevronDownIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 16.42L4.64 9.06L6.12 7.58L12 13.46L17.88 7.58L19.36 9.06L12 16.42Z\"></path></svg>',\n },\n asc: {\n // ArrowCircleUpFilledIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM11.22 15.92H12.78V10.4L15.34 13.04L16.3 12.1L11.96 7.76L7.7 12.1L8.66 13.04L11.22 10.34V15.92Z\"></path></svg>',\n },\n ascHover: {\n // ArrowCircleUpIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98ZM11.22 15.92V10.36L8.66 13.04L7.7 12.1L12 7.76L16.3 12.1L15.34 13.04L12.78 10.36V15.92H11.22Z\"></path></svg>',\n },\n desc: {\n // ArrowCircleDownFilledIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12.78 8H11.22V13.52L8.66 10.88L7.7 11.82L12.04 16.16L16.3 11.82L15.34 10.88L12.78 13.58V8Z\"></path></svg>',\n },\n descHover: {\n // ArrowCircleDownIcon\n svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94ZM12.78 8V13.56L15.34 10.88L16.3 11.82L12 16.16L7.7 11.82L8.66 10.88L11.22 13.56V8H12.78Z\"></path></svg>',\n },\n};\n\n/** Maps AG Grid icons to Skoda Flow library icons, overrides icons in AG Grid Theme */\nexport const skodaAgGridIconOverrides = (customIcons?: { name: string; svg: string }[]) => {\n return {\n type: 'image' as const,\n mask: true, // for icons to use AG Grid currentColor\n icons: {\n ...agGridIconsDefinition,\n ...Object.fromEntries((customIcons ?? []).map((icon) => [icon.name, { svg: icon.svg }])),\n },\n };\n};\n\nexport const agGridCssIcons = {\n '.ag-icon-desc::before, .ag-header-cell-sortable .ag-hidden .ag-icon-desc:hover::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.desc.svg)})`,\n },\n '.ag-icon-asc::before, .ag-header-cell-sortable .ag-hidden .ag-icon-asc:hover::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.asc.svg)})`,\n },\n '.ag-icon-desc:hover::before, .ag-header-cell-sortable .ag-hidden .ag-icon-desc::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.descHover.svg)})`,\n },\n '.ag-icon-asc:hover::before, .ag-header-cell-sortable .ag-hidden .ag-icon-asc::before': {\n maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.ascHover.svg)})`,\n },\n};\n"],"names":["agGridIconsDefinition","previous","svg","next","first","last","asc","ascHover","desc","descHover","agGridCssIcons","maskImage","encodeURIComponent","customIcons","type","mask","icons","Object","fromEntries","map","icon","name"],"mappings":"aAEO,MAAMA,EAAwB,CACnCC,SAAU,CAERC,IAAK,ySAEPC,KAAM,CAEJD,IAAK,0SAEPE,MAAO,CAELF,IAAK,mTAEPG,KAAM,CAEJH,IAAK,oTAEP,aAAc,CAEZA,IAAK,iRAEPI,IAAK,CAEHJ,IAAK,obAEPK,SAAU,CAERL,IAAK,ujBAEPM,KAAM,CAEJN,IAAK,+aAEPO,UAAW,CAETP,IAAK,mjBAgBIQ,EAAiB,CAC5B,yFAA0F,CACxFC,UAAW,+BAA+BC,mBAAmBZ,EAAsBQ,KAAKN,SAE1F,uFAAwF,CACtFS,UAAW,+BAA+BC,mBAAmBZ,EAAsBM,IAAIJ,SAEzF,yFAA0F,CACxFS,UAAW,+BAA+BC,mBAAmBZ,EAAsBS,UAAUP,SAE/F,uFAAwF,CACtFS,UAAW,+BAA+BC,mBAAmBZ,EAAsBO,SAASL,oGAtBvDW,IAChC,CACLC,KAAM,QACNC,MAAM,EACNC,MAAO,IACFhB,KACAiB,OAAOC,aAAaL,GAAe,IAAIM,IAAKC,GAAS,CAACA,EAAKC,KAAM,CAAEnB,IAAKkB,EAAKlB"}

package/cjs/components/advancedTable/agGridSkodaTheme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";exports.skodaAgThemeParams=e=>({fontFamily:"rtl"===e.direction?"SKODA Next R2L":"SKODA Next",fontSize:14,iconSize:17,backgroundColor:"transparent",foregroundColor:e.palette.text.primary,dataColor:e.palette.text.primary,headerForegroundColor:e.palette.text.primary,headerBackgroundColor:"transparent",subHeaderBackgroundColor:"transparent",subHeaderToolbarBackgroundColor:"transparent",secondaryForegroundColor:e.palette.onSurface.os500,disabledForegroundColor:e.palette.disabled.tertiary,checkboxCheckedColor:e.palette.brand.primary,checkboxIndeterminateColor:e.palette.brand.primary,rowHoverColor:e.palette.surface.primary,oddRowBackgroundColor:"transparent",rowBorderColor:e.palette.surface.secondary,selectedRowBackgroundColor:e.palette.surface.primary,headerFontSize:14,headerFontWeight:700,headerHeight:54,rowHeight:56,paginationPanelHeight:70,cellHorizontalPadding:16,cellVerticalPadding:4,rowVerticalPaddingScale:.04,borderRadius:8,headerColumnSeparatorColor:e.palette.surface.secondary,headerColumnResizeHandleColor:e.palette.surface.secondary,headerColumnSeparatorDisplay:"block",headerColumnResizeHandleDisplay:"block"});
+"use strict";var e=require("../../materialui/typography/typography.theme.js");exports.skodaAgThemeParams=r=>({fontFamily:e.getFontFamily("rtl"===r.direction),fontSize:14,iconSize:17,backgroundColor:"transparent",foregroundColor:r.palette.text.primary,dataColor:r.palette.text.primary,headerForegroundColor:r.palette.text.primary,headerBackgroundColor:"transparent",subHeaderBackgroundColor:"transparent",subHeaderToolbarBackgroundColor:"transparent",secondaryForegroundColor:r.palette.onSurface.os500,disabledForegroundColor:r.palette.disabled.tertiary,checkboxCheckedColor:r.palette.brand.primary,checkboxIndeterminateColor:r.palette.brand.primary,rowHoverColor:r.palette.surface.primary,oddRowBackgroundColor:"transparent",rowBorderColor:r.palette.surface.secondary,selectedRowBackgroundColor:r.palette.surface.primary,headerFontSize:14,headerFontWeight:700,headerHeight:54,rowHeight:56,paginationPanelHeight:70,cellHorizontalPadding:16,cellVerticalPadding:4,rowVerticalPaddingScale:.04,borderRadius:8,headerColumnSeparatorColor:r.palette.surface.secondary,headerColumnResizeHandleColor:r.palette.surface.secondary,headerColumnSeparatorDisplay:"block",headerColumnResizeHandleDisplay:"block"});
 //# sourceMappingURL=agGridSkodaTheme.js.map

package/cjs/components/advancedTable/agGridSkodaTheme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"agGridSkodaTheme.js","sources":["../../../../../src/components/advancedTable/agGridSkodaTheme.ts"],"sourcesContent":["import { Theme } from '@mui/material';\n\n/** AG Grid Theme parameters (replaces variables since AG Grid v32) */\nexport const skodaAgThemeParams = (theme: Theme) => ({\n // typography\n fontFamily: theme.direction === 'rtl' ~~? 'SKODA Next R2L' : 'SKODA Next'~~,\n fontSize: 14,\n iconSize: 17,\n\n // colors\n backgroundColor: 'transparent',\n foregroundColor: theme.palette.text.primary,\n dataColor: theme.palette.text.primary,\n headerForegroundColor: theme.palette.text.primary,\n headerBackgroundColor: 'transparent',\n subHeaderBackgroundColor: 'transparent',\n subHeaderToolbarBackgroundColor: 'transparent',\n secondaryForegroundColor: theme.palette.onSurface.os500,\n disabledForegroundColor: theme.palette.disabled.tertiary,\n checkboxCheckedColor: theme.palette.brand.primary,\n checkboxIndeterminateColor: theme.palette.brand.primary,\n\n // rows / hover / borders\n rowHoverColor: theme.palette.surface.primary,\n oddRowBackgroundColor: 'transparent',\n rowBorderColor: theme.palette.surface.secondary,\n selectedRowBackgroundColor: theme.palette.surface.primary,\n\n // sizing / spacing\n headerFontSize: 14,\n headerFontWeight: 700,\n headerHeight: 54,\n rowHeight: 56,\n paginationPanelHeight: 70,\n cellHorizontalPadding: 16,\n cellVerticalPadding: 4,\n rowVerticalPaddingScale: 0.04,\n borderRadius: 8,\n\n // header separators\n headerColumnSeparatorColor: theme.palette.surface.secondary,\n headerColumnResizeHandleColor: theme.palette.surface.secondary,\n headerColumnSeparatorDisplay: 'block',\n headerColumnResizeHandleDisplay: 'block',\n});\n"],"names":["theme","fontFamily","direction","fontSize","iconSize","backgroundColor","foregroundColor","palette","text","primary","dataColor","headerForegroundColor","headerBackgroundColor","subHeaderBackgroundColor","subHeaderToolbarBackgroundColor","secondaryForegroundColor","onSurface","os500","disabledForegroundColor","disabled","tertiary","checkboxCheckedColor","brand","checkboxIndeterminateColor","rowHoverColor","surface","oddRowBackgroundColor","rowBorderColor","secondary","selectedRowBackgroundColor","headerFontSize","headerFontWeight","headerHeight","rowHeight","paginationPanelHeight","cellHorizontalPadding","cellVerticalPadding","rowVerticalPaddingScale","borderRadius","headerColumnSeparatorColor","headerColumnResizeHandleColor","headerColumnSeparatorDisplay","headerColumnResizeHandleDisplay"],"mappings":"~~wCAGmCA~~,IAAY,CAE7CC,~~WAAgC~~,~~QAApBD~~,~~EAAME~~,~~UAAsB~~,~~iBAAmB~~,~~aAC3DC~~,SAAU,GACVC,SAAU,GAGVC,gBAAiB,cACjBC,~~gBAAiBN~~,~~EAAMO~~,QAAQC,KAAKC,QACpCC,~~UAAWV~~,~~EAAMO~~,QAAQC,KAAKC,QAC9BE,~~sBAAuBX~~,~~EAAMO~~,QAAQC,KAAKC,QAC1CG,sBAAuB,cACvBC,yBAA0B,cAC1BC,gCAAiC,cACjCC,~~yBAA0Bf~~,~~EAAMO~~,QAAQS,UAAUC,MAClDC,~~wBAAyBlB~~,~~EAAMO~~,QAAQY,SAASC,SAChDC,~~qBAAsBrB~~,~~EAAMO~~,QAAQe,MAAMb,QAC1Cc,~~2BAA4BvB~~,~~EAAMO~~,QAAQe,MAAMb,QAGhDe,~~cAAexB~~,~~EAAMO~~,QAAQkB,QAAQhB,QACrCiB,sBAAuB,cACvBC,~~eAAgB3B~~,~~EAAMO~~,QAAQkB,QAAQG,UACtCC,~~2BAA4B7B~~,~~EAAMO~~,QAAQkB,QAAQhB,QAGlDqB,eAAgB,GAChBC,iBAAkB,IAClBC,aAAc,GACdC,UAAW,GACXC,sBAAuB,GACvBC,sBAAuB,GACvBC,oBAAqB,EACrBC,wBAAyB,IACzBC,aAAc,EAGdC,~~2BAA4BvC~~,~~EAAMO~~,QAAQkB,QAAQG,UAClDY,8BAA+~~BxC~~,~~EAAMO~~,QAAQkB,QAAQG,UACrDa,6BAA8B,QAC9BC,gCAAiC"}
1	+ {"version":3,"file":"agGridSkodaTheme.js","sources":["../../../../../src/components/advancedTable/agGridSkodaTheme.ts"],"sourcesContent":["import { Theme } from '@mui/material';\nimport { getFontFamily } from '@/src/materialui/typography/typography.theme';\n\n/** AG Grid Theme parameters (replaces variables since AG Grid v32) */\nexport const skodaAgThemeParams = (theme: Theme) => ({\n // typography\n fontFamily: getFontFamily(theme.direction === 'rtl'),\n fontSize: 14,\n iconSize: 17,\n\n // colors\n backgroundColor: 'transparent',\n foregroundColor: theme.palette.text.primary,\n dataColor: theme.palette.text.primary,\n headerForegroundColor: theme.palette.text.primary,\n headerBackgroundColor: 'transparent',\n subHeaderBackgroundColor: 'transparent',\n subHeaderToolbarBackgroundColor: 'transparent',\n secondaryForegroundColor: theme.palette.onSurface.os500,\n disabledForegroundColor: theme.palette.disabled.tertiary,\n checkboxCheckedColor: theme.palette.brand.primary,\n checkboxIndeterminateColor: theme.palette.brand.primary,\n\n // rows / hover / borders\n rowHoverColor: theme.palette.surface.primary,\n oddRowBackgroundColor: 'transparent',\n rowBorderColor: theme.palette.surface.secondary,\n selectedRowBackgroundColor: theme.palette.surface.primary,\n\n // sizing / spacing\n headerFontSize: 14,\n headerFontWeight: 700,\n headerHeight: 54,\n rowHeight: 56,\n paginationPanelHeight: 70,\n cellHorizontalPadding: 16,\n cellVerticalPadding: 4,\n rowVerticalPaddingScale: 0.04,\n borderRadius: 8,\n\n // header separators\n headerColumnSeparatorColor: theme.palette.surface.secondary,\n headerColumnResizeHandleColor: theme.palette.surface.secondary,\n headerColumnSeparatorDisplay: 'block',\n headerColumnResizeHandleDisplay: 'block',\n});\n"],"names":["theme","fontFamily","getFontFamily","direction","fontSize","iconSize","backgroundColor","foregroundColor","palette","text","primary","dataColor","headerForegroundColor","headerBackgroundColor","subHeaderBackgroundColor","subHeaderToolbarBackgroundColor","secondaryForegroundColor","onSurface","os500","disabledForegroundColor","disabled","tertiary","checkboxCheckedColor","brand","checkboxIndeterminateColor","rowHoverColor","surface","oddRowBackgroundColor","rowBorderColor","secondary","selectedRowBackgroundColor","headerFontSize","headerFontWeight","headerHeight","rowHeight","paginationPanelHeight","cellHorizontalPadding","cellVerticalPadding","rowVerticalPaddingScale","borderRadius","headerColumnSeparatorColor","headerColumnResizeHandleColor","headerColumnSeparatorDisplay","headerColumnResizeHandleDisplay"],"mappings":"yGAImCA,IAAY,CAE7CC,WAAYC,EAAAA,cAAkC,QAApBF,EAAMG,WAChCC,SAAU,GACVC,SAAU,GAGVC,gBAAiB,cACjBC,gBAAiBP,EAAMQ,QAAQC,KAAKC,QACpCC,UAAWX,EAAMQ,QAAQC,KAAKC,QAC9BE,sBAAuBZ,EAAMQ,QAAQC,KAAKC,QAC1CG,sBAAuB,cACvBC,yBAA0B,cAC1BC,gCAAiC,cACjCC,yBAA0BhB,EAAMQ,QAAQS,UAAUC,MAClDC,wBAAyBnB,EAAMQ,QAAQY,SAASC,SAChDC,qBAAsBtB,EAAMQ,QAAQe,MAAMb,QAC1Cc,2BAA4BxB,EAAMQ,QAAQe,MAAMb,QAGhDe,cAAezB,EAAMQ,QAAQkB,QAAQhB,QACrCiB,sBAAuB,cACvBC,eAAgB5B,EAAMQ,QAAQkB,QAAQG,UACtCC,2BAA4B9B,EAAMQ,QAAQkB,QAAQhB,QAGlDqB,eAAgB,GAChBC,iBAAkB,IAClBC,aAAc,GACdC,UAAW,GACXC,sBAAuB,GACvBC,sBAAuB,GACvBC,oBAAqB,EACrBC,wBAAyB,IACzBC,aAAc,EAGdC,2BAA4BxC,EAAMQ,QAAQkB,QAAQG,UAClDY,8BAA+BzC,EAAMQ,QAAQkB,QAAQG,UACrDa,6BAA8B,QAC9BC,gCAAiC"}

package/cjs/components/bottomSheet/BottomSheet.d.ts CHANGED Viewed

@@ -71,4 +71,7 @@ export interface BottomSheetProps extends Omit<SwipeableDrawerProps, 'onClose' |
      */
     footerWrapper?: BoxProps<ElementType>;
 }
+/**
+ * Implementation of bottom Drawer with preset layout
+ */
 export declare const BottomSheet: React.FC<BottomSheetProps>;

package/cjs/components/bottomSheet/BottomSheet.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BottomSheet.js","sources":["../../../../../src/components/bottomSheet/BottomSheet.tsx"],"sourcesContent":["import React, { ComponentType, ElementType, forwardRef } from 'react';\nimport {\n Box,\n BoxProps,\n IconButtonProps,\n SwipeableDrawer,\n SwipeableDrawerProps,\n IconButton,\n Typography,\n TypographyProps,\n useTheme,\n SvgIconProps,\n PaperProps,\n} from '@mui/material';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { useElementScrollable } from '@/src/utils/useElementScrollable';\nimport { getFocusRingBoxShadow } from '@/src/components/focusring/focusring';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\nexport interface BottomSheetProps extends Omit<SwipeableDrawerProps, 'onClose' \| 'onOpen' \| 'title'> {\n /*\n Open state component flag\n /\n open: boolean;\n /\n Open state component function\n /\n setOpen: React.Dispatch<React.SetStateAction<boolean>>;\n /\n Flag for displaying close button\n /\n closeButton?: boolean;\n /\n Props applied to closeButton IconButton\n /\n closeButtonProps?: Partial<IconButtonProps>;\n /\n Props applied to Icon in closeButton\n /\n closeButtonIconProps?: SvgIconProps;\n /\n Icon node to be used\n /\n CloseButtonIconComponent?: ComponentType<SvgIconProps>;\n /\n Flag for displaying bar that visualizes pulling function\n /\n puller?: boolean;\n /\n Props applied to wrapper of puller\n /\n pullerWrapperProps?: BoxProps<ElementType>;\n /\n Props applied to puller\n /\n pullerProps?: BoxProps<ElementType>;\n /\n Footer children slot\n /\n footerSlot?: React.ReactNode;\n /\n Text in header\n /\n title?: React.ReactNode;\n /\n Text props\n /\n titleProps?: TypographyProps<ElementType>;\n /\n Max height of whole component in percentages\n * @default 60\n /\n maxHeight?: number;\n /\n Wrapper of header\n /\n headerWrapper?: BoxProps<ElementType>;\n /\n Wrapper of title and close button\n /\n titleWrapper?: BoxProps<ElementType>;\n /\n Wrapper of content\n /\n contentWrapper?: BoxProps<ElementType>;\n /\n Wrapper of footer\n */\n footerWrapper?: BoxProps<ElementType>;\n}\n\nexport const BottomSheet: React.FC<BottomSheetProps> = forwardRef(\n (\n {\n children,\n open,\n setOpen,\n slotProps,\n puller,\n pullerWrapperProps,\n pullerProps,\n closeButton,\n closeButtonProps,\n closeButtonIconProps,\n CloseButtonIconComponent,\n footerSlot,\n title,\n titleProps = {},\n headerWrapper,\n titleWrapper,\n contentWrapper,\n footerWrapper,\n maxHeight = 60,\n ...rest\n },\n ref,\n ) => {\n const { sx: headerSx, ...restHeader } = headerWrapper ?? {};\n const { sx: titleWrapperSx, ...restTitleWrapper } = titleWrapper ?? {};\n const { sx: titleSx, ...restTitle } = titleProps ?? {};\n const { sx: pullerWrapperSx, ...restPullerWrapper } = pullerWrapperProps ?? {};\n const { sx: pullerSx, ...restPuller } = pullerProps ?? {};\n const { sx: closeButtonSx, ...restCloseButton } = closeButtonProps ?? {};\n const { sx: contentSx, ...restContent } = contentWrapper ?? {};\n const { sx: footerSx, ...restFooter } = footerWrapper ?? {};\n const theme = useTheme();\n const BottomSheetCloseButtonIcon = CloseButtonIconComponent \|\| CloseIcon;\n\n const { isScrollable, elementRef } = useElementScrollable('y');\n\n return (\n <SwipeableDrawer\n dir={theme.direction}\n anchor=\"bottom\"\n open={open}\n onClose={() => setOpen(false)}\n onOpen={() => setOpen(true)}\n disableSwipeToOpen\n ModalProps={{\n keepMounted: true,\n }}\n data-testid=\"BottomSheet\"\n slotProps={{\n ...slotProps,\n paper: {\n ...slotProps?.paper,\n sx: {\n boxShadow: 'none',\n borderTopLeftRadius: '16px',\n borderTopRightRadius: '16px',\n maxHeight: `${maxHeight}%`,\n ...(slotProps?.paper as PaperProps)?.sx,\n },\n },\n }}\n ref={ref}\n {...rest}\n >\n {(title \|\| closeButton \|\| puller) && (\n <Box sx={sxOverride({ px: 2 }, headerSx)} data-testid=\"BottomSheet-header\" {...restHeader}>\n {puller && (\n <Box\n sx={sxOverride(\n {\n position: 'relative',\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'center',\n alignItems: 'center',\n },\n pullerWrapperSx,\n )}\n {...restPullerWrapper}\n >\n <Box\n data-testid=\"BottomSheet-puller\"\n sx={sxOverride(\n {\n width: '28px',\n height: '4px',\n backgroundColor: 'onSurface.os500',\n mt: 1,\n mb: 1.5,\n borderRadius: '8px',\n },\n pullerSx,\n )}\n {...restPuller}\n />\n </Box>\n )}\n {(title \|\| (closeButton && !puller)) && (\n <Box\n sx={sxOverride(\n {\n display: 'flex',\n justifyContent: title ? 'space-between' : 'flex-end',\n alignItems: 'flex-start',\n gap: 1,\n pt: isScrollable && puller ? 1 : 0,\n },\n titleWrapperSx,\n )}\n {...restTitleWrapper}\n >\n {title && (\n <Typography\n data-testid=\"BottomSheet-title\"\n variant=\"h4\"\n component=\"h2\"\n sx={sxOverride(\n {\n mt: puller ? 0 : 2,\n mb: isScrollable ? 2 : 0,\n overflow: 'hidden',\n },\n titleSx,\n )}\n {...restTitle}\n >\n {title}\n </Typography>\n )}\n {closeButton && !puller && (\n <IconButton\n data-testid=\"BottomSheet-closeButton\"\n size=\"medium\"\n onClick={() => setOpen(false)}\n aria-label=\"Close bottom sheet\"\n sx={sxOverride(\n {\n my: '4px',\n mr: '-6px',\n },\n closeButtonSx,\n )}\n {...restCloseButton}\n >\n <BottomSheetCloseButtonIcon {...closeButtonIconProps} />\n </IconButton>\n )}\n </Box>\n )}\n </Box>\n )}\n <Box\n data-testid=\"BottomSheet-content\"\n ref={elementRef}\n sx={sxOverride(\n {\n overflow: 'auto',\n borderTop: isScrollable ? 1 : 0,\n borderBottom: isScrollable && footerSlot ? 1 : 0,\n borderColor: 'surface.secondary',\n p: 2,\n // can be focused since scrollable\n '&:focus-visible': {\n outline: 'none',\n boxShadow: getFocusRingBoxShadow(theme, true),\n },\n },\n contentSx,\n )}\n {...restContent}\n >\n {children}\n </Box>\n {footerSlot && (\n <Box\n data-testid=\"BottomSheet-footer\"\n sx={sxOverride(\n {\n px: 2,\n pt: 3,\n pb: 2,\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'stretch',\n flexDirection: 'column',\n gap: '16px',\n },\n footerSx,\n )}\n {...restFooter}\n >\n {footerSlot}\n </Box>\n )}\n </SwipeableDrawer>\n );\n },\n);\n"],"names":["BottomSheet","forwardRef","children","open","setOpen","slotProps","puller","pullerWrapperProps","pullerProps","closeButton","closeButtonProps","closeButtonIconProps","CloseButtonIconComponent","footerSlot","title","titleProps","headerWrapper","titleWrapper","contentWrapper","footerWrapper","maxHeight","rest","ref","sx","headerSx","restHeader","titleWrapperSx","restTitleWrapper","titleSx","restTitle","pullerWrapperSx","restPullerWrapper","pullerSx","restPuller","closeButtonSx","restCloseButton","contentSx","restContent","footerSx","restFooter","theme","useTheme","BottomSheetCloseButtonIcon","CloseIcon","isScrollable","elementRef","useElementScrollable","_jsxs","SwipeableDrawer","dir","direction","anchor","onClose","onOpen","disableSwipeToOpen","ModalProps","keepMounted","paper","boxShadow","borderTopLeftRadius","borderTopRightRadius","Box","sxOverride","px","_jsx","position","display","flexDirection","justifyContent","alignItems","width","height","backgroundColor","mt","mb","borderRadius","gap","pt","Typography","variant","component","overflow","IconButton","size","onClick","my","mr","borderTop","borderBottom","borderColor","p","outline","getFocusRingBoxShadow","pb"],"mappings":"sSA2FO,MAAMA,EAA0CC,EAAAA,WACrD,EAEIC,WACAC,OACAC,UACAC,YACAC,SACAC,qBACAC,cACAC,cACAC,mBACAC,uBACAC,2BACAC,aACAC,QACAC,aAAa,CAAA,EACbC,gBACAC,eACAC,iBACAC,gBACAC,YAAY,MACTC,GAELC,KAEA,MAAQC,GAAIC,KAAaC,GAAeT,GAAiB,CAAA,GACjDO,GAAIG,KAAmBC,GAAqBV,GAAgB,CAAA,GAC5DM,GAAIK,KAAYC,GAAcd,GAAc,CAAA,GAC5CQ,GAAIO,KAAoBC,GAAsBxB,GAAsB,CAAA,GACpEgB,GAAIS,KAAaC,GAAezB,GAAe,CAAA,GAC/Ce,GAAIW,KAAkBC,GAAoBzB,GAAoB,CAAA,GAC9Da,GAAIa,KAAcC,GAAgBnB,GAAkB,CAAA,GACpDK,GAAIe,KAAaC,GAAepB,GAAiB,CAAA,EACnDqB,EAAQC,EAAAA,WACRC,EAA6B9B,GAA4B+B,EAAAA,WAEzDC,aAAEA,EAAYC,WAAEA,GAAeC,EAAAA,qBAAqB,KAE1D,OACEC,EAAAA,KAACC,mBACCC,IAAKT,EAAMU,UACXC,OAAO,SACPhD,KAAMA,EACNiD,QAAS,IAAMhD,GAAQ,GACvBiD,OAAQ,IAAMjD,GAAQ,GACtBkD,oBAAkB,EAClBC,WAAY,CACVC,aAAa,GACd,cACW,cACZnD,UAAW,IACNA,EACHoD,MAAO,IACFpD,GAAWoD,MACdlC,GAAI,CACFmC,UAAW,OACXC,oBAAqB,OACrBC,qBAAsB,OACtBxC,UAAW,GAAGA,QACVf,GAAWoD,OAAsBlC,MAI3CD,IAAKA,KACDD,EAAInB,SAAA,EAENY,GAASL,GAAeH,IACxByC,EAAAA,KAACc,EAAAA,IAAG,CAACtC,GAAIuC,EAAAA,WAAW,CAAEC,GAAI,GAAKvC,GAAS,cAAc,wBAAyBC,YAC5EnB,GACC0D,EAAAA,IAACH,EAAAA,KACCtC,GAAIuC,EAAAA,WACF,CACEG,SAAU,WACVC,QAAS,OACTC,cAAe,MACfC,eAAgB,SAChBC,WAAY,UAEdvC,MAEEC,EAAiB7B,SAErB8D,EAAAA,IAACH,EAAAA,IAAG,CAAA,cACU,qBACZtC,GAAIuC,EAAAA,WACF,CACEQ,MAAO,OACPC,OAAQ,MACRC,gBAAiB,kBACjBC,GAAI,EACJC,GAAI,IACJC,aAAc,OAEhB3C,MAEEC,OAIRnB,GAAUL,IAAgBH,IAC1ByC,EAAAA,KAACc,EAAAA,IAAG,CACFtC,GAAIuC,aACF,CACEI,QAAS,OACTE,eAAgBtD,EAAQ,gBAAkB,WAC1CuD,WAAY,aACZO,IAAK,EACLC,GAAIjC,GAAgBtC,EAAS,EAAI,GAEnCoB,MAEEC,EAAgBzB,SAAA,CAEnBY,GACCkD,EAAAA,IAACc,EAAAA,WAAU,CAAA,cACG,oBACZC,QAAQ,KACRC,UAAU,KACVzD,GAAIuC,aACF,CACEW,GAAInE,EAAS,EAAI,EACjBoE,GAAI9B,EAAe,EAAI,EACvBqC,SAAU,UAEZrD,MAEEC,EAAS3B,SAEZY,IAGJL,IAAgBH,GACf0D,EAAAA,IAACkB,EAAAA,WAAU,CAAA,cACG,0BACZC,KAAK,SACLC,QAAS,IAAMhF,GAAQ,GAAM,aAClB,qBACXmB,GAAIuC,EAAAA,WACF,CACEuB,GAAI,MACJC,GAAI,QAENpD,MAEEC,EAAejC,SAEnB8D,EAAAA,IAACtB,EAA0B,IAAK/B,YAO5CqD,EAAAA,IAACH,MAAG,CAAA,cACU,sBACZvC,IAAKuB,EACLtB,GAAIuC,EAAAA,WACF,CACEmB,SAAU,OACVM,UAAW3C,EAAe,EAAI,EAC9B4C,aAAc5C,GAAgB/B,EAAa,EAAI,EAC/C4E,YAAa,oBACbC,EAAG,EAEH,kBAAmB,CACjBC,QAAS,OACTjC,UAAWkC,EAAAA,sBAAsBpD,GAAO,KAG5CJ,MAEEC,EAAWnC,SAEdA,IAEFW,GACCmD,EAAAA,IAACH,EAAAA,IAAG,CAAA,cACU,qBACZtC,GAAIuC,EAAAA,WACF,CACEC,GAAI,EACJc,GAAI,EACJgB,GAAI,EACJ3B,QAAS,OACTE,eAAgB,aAChBC,WAAY,UACZF,cAAe,SACfS,IAAK,QAEPtC,MAEEC,EAAUrC,SAEbW"}
1	+ {"version":3,"file":"BottomSheet.js","sources":["../../../../../src/components/bottomSheet/BottomSheet.tsx"],"sourcesContent":["import React, { ComponentType, ElementType, forwardRef } from 'react';\nimport {\n Box,\n BoxProps,\n IconButtonProps,\n SwipeableDrawer,\n SwipeableDrawerProps,\n IconButton,\n Typography,\n TypographyProps,\n useTheme,\n SvgIconProps,\n PaperProps,\n} from '@mui/material';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { useElementScrollable } from '@/src/utils/useElementScrollable';\nimport { getFocusRingBoxShadow } from '@/src/components/focusring/focusring';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\nexport interface BottomSheetProps extends Omit<SwipeableDrawerProps, 'onClose' \| 'onOpen' \| 'title'> {\n /*\n Open state component flag\n /\n open: boolean;\n /\n Open state component function\n /\n setOpen: React.Dispatch<React.SetStateAction<boolean>>;\n /\n Flag for displaying close button\n /\n closeButton?: boolean;\n /\n Props applied to closeButton IconButton\n /\n closeButtonProps?: Partial<IconButtonProps>;\n /\n Props applied to Icon in closeButton\n /\n closeButtonIconProps?: SvgIconProps;\n /\n Icon node to be used\n /\n CloseButtonIconComponent?: ComponentType<SvgIconProps>;\n /\n Flag for displaying bar that visualizes pulling function\n /\n puller?: boolean;\n /\n Props applied to wrapper of puller\n /\n pullerWrapperProps?: BoxProps<ElementType>;\n /\n Props applied to puller\n /\n pullerProps?: BoxProps<ElementType>;\n /\n Footer children slot\n /\n footerSlot?: React.ReactNode;\n /\n Text in header\n /\n title?: React.ReactNode;\n /\n Text props\n /\n titleProps?: TypographyProps<ElementType>;\n /\n Max height of whole component in percentages\n * @default 60\n /\n maxHeight?: number;\n /\n Wrapper of header\n /\n headerWrapper?: BoxProps<ElementType>;\n /\n Wrapper of title and close button\n /\n titleWrapper?: BoxProps<ElementType>;\n /\n Wrapper of content\n /\n contentWrapper?: BoxProps<ElementType>;\n /\n Wrapper of footer\n /\n footerWrapper?: BoxProps<ElementType>;\n}\n\n/\n Implementation of bottom Drawer with preset layout\n */\nexport const BottomSheet: React.FC<BottomSheetProps> = forwardRef(\n (\n {\n children,\n open,\n setOpen,\n slotProps,\n puller,\n pullerWrapperProps,\n pullerProps,\n closeButton,\n closeButtonProps,\n closeButtonIconProps,\n CloseButtonIconComponent,\n footerSlot,\n title,\n titleProps = {},\n headerWrapper,\n titleWrapper,\n contentWrapper,\n footerWrapper,\n maxHeight = 60,\n ...rest\n },\n ref,\n ) => {\n const { sx: headerSx, ...restHeader } = headerWrapper ?? {};\n const { sx: titleWrapperSx, ...restTitleWrapper } = titleWrapper ?? {};\n const { sx: titleSx, ...restTitle } = titleProps ?? {};\n const { sx: pullerWrapperSx, ...restPullerWrapper } = pullerWrapperProps ?? {};\n const { sx: pullerSx, ...restPuller } = pullerProps ?? {};\n const { sx: closeButtonSx, ...restCloseButton } = closeButtonProps ?? {};\n const { sx: contentSx, ...restContent } = contentWrapper ?? {};\n const { sx: footerSx, ...restFooter } = footerWrapper ?? {};\n const theme = useTheme();\n const BottomSheetCloseButtonIcon = CloseButtonIconComponent \|\| CloseIcon;\n\n const { isScrollable, elementRef } = useElementScrollable('y');\n\n return (\n <SwipeableDrawer\n dir={theme.direction}\n anchor=\"bottom\"\n open={open}\n onClose={() => setOpen(false)}\n onOpen={() => setOpen(true)}\n disableSwipeToOpen\n ModalProps={{\n keepMounted: true,\n }}\n data-testid=\"BottomSheet\"\n slotProps={{\n ...slotProps,\n paper: {\n ...slotProps?.paper,\n sx: {\n boxShadow: 'none',\n borderTopLeftRadius: '16px',\n borderTopRightRadius: '16px',\n maxHeight: `${maxHeight}%`,\n ...(slotProps?.paper as PaperProps)?.sx,\n },\n },\n }}\n ref={ref}\n {...rest}\n >\n {(title \|\| closeButton \|\| puller) && (\n <Box sx={sxOverride({ px: 2 }, headerSx)} data-testid=\"BottomSheet-header\" {...restHeader}>\n {puller && (\n <Box\n sx={sxOverride(\n {\n position: 'relative',\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'center',\n alignItems: 'center',\n },\n pullerWrapperSx,\n )}\n {...restPullerWrapper}\n >\n <Box\n data-testid=\"BottomSheet-puller\"\n sx={sxOverride(\n {\n width: '28px',\n height: '4px',\n backgroundColor: 'onSurface.os500',\n mt: 1,\n mb: 1.5,\n borderRadius: '8px',\n },\n pullerSx,\n )}\n {...restPuller}\n />\n </Box>\n )}\n {(title \|\| (closeButton && !puller)) && (\n <Box\n sx={sxOverride(\n {\n display: 'flex',\n justifyContent: title ? 'space-between' : 'flex-end',\n alignItems: 'flex-start',\n gap: 1,\n pt: isScrollable && puller ? 1 : 0,\n },\n titleWrapperSx,\n )}\n {...restTitleWrapper}\n >\n {title && (\n <Typography\n data-testid=\"BottomSheet-title\"\n variant=\"h4\"\n component=\"h2\"\n sx={sxOverride(\n {\n mt: puller ? 0 : 2,\n mb: isScrollable ? 2 : 0,\n overflow: 'hidden',\n },\n titleSx,\n )}\n {...restTitle}\n >\n {title}\n </Typography>\n )}\n {closeButton && !puller && (\n <IconButton\n data-testid=\"BottomSheet-closeButton\"\n size=\"medium\"\n onClick={() => setOpen(false)}\n aria-label=\"Close bottom sheet\"\n sx={sxOverride(\n {\n my: '4px',\n mr: '-6px',\n },\n closeButtonSx,\n )}\n {...restCloseButton}\n >\n <BottomSheetCloseButtonIcon {...closeButtonIconProps} />\n </IconButton>\n )}\n </Box>\n )}\n </Box>\n )}\n <Box\n data-testid=\"BottomSheet-content\"\n ref={elementRef}\n sx={sxOverride(\n {\n overflow: 'auto',\n borderTop: isScrollable ? 1 : 0,\n borderBottom: isScrollable && footerSlot ? 1 : 0,\n borderColor: 'surface.secondary',\n p: 2,\n // can be focused since scrollable\n '&:focus-visible': {\n outline: 'none',\n boxShadow: getFocusRingBoxShadow(theme, true),\n },\n },\n contentSx,\n )}\n {...restContent}\n >\n {children}\n </Box>\n {footerSlot && (\n <Box\n data-testid=\"BottomSheet-footer\"\n sx={sxOverride(\n {\n px: 2,\n pt: 3,\n pb: 2,\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'stretch',\n flexDirection: 'column',\n gap: '16px',\n },\n footerSx,\n )}\n {...restFooter}\n >\n {footerSlot}\n </Box>\n )}\n </SwipeableDrawer>\n );\n },\n);\n"],"names":["BottomSheet","forwardRef","children","open","setOpen","slotProps","puller","pullerWrapperProps","pullerProps","closeButton","closeButtonProps","closeButtonIconProps","CloseButtonIconComponent","footerSlot","title","titleProps","headerWrapper","titleWrapper","contentWrapper","footerWrapper","maxHeight","rest","ref","sx","headerSx","restHeader","titleWrapperSx","restTitleWrapper","titleSx","restTitle","pullerWrapperSx","restPullerWrapper","pullerSx","restPuller","closeButtonSx","restCloseButton","contentSx","restContent","footerSx","restFooter","theme","useTheme","BottomSheetCloseButtonIcon","CloseIcon","isScrollable","elementRef","useElementScrollable","_jsxs","SwipeableDrawer","dir","direction","anchor","onClose","onOpen","disableSwipeToOpen","ModalProps","keepMounted","paper","boxShadow","borderTopLeftRadius","borderTopRightRadius","Box","sxOverride","px","_jsx","position","display","flexDirection","justifyContent","alignItems","width","height","backgroundColor","mt","mb","borderRadius","gap","pt","Typography","variant","component","overflow","IconButton","size","onClick","my","mr","borderTop","borderBottom","borderColor","p","outline","getFocusRingBoxShadow","pb"],"mappings":"sSA8FO,MAAMA,EAA0CC,EAAAA,WACrD,EAEIC,WACAC,OACAC,UACAC,YACAC,SACAC,qBACAC,cACAC,cACAC,mBACAC,uBACAC,2BACAC,aACAC,QACAC,aAAa,CAAA,EACbC,gBACAC,eACAC,iBACAC,gBACAC,YAAY,MACTC,GAELC,KAEA,MAAQC,GAAIC,KAAaC,GAAeT,GAAiB,CAAA,GACjDO,GAAIG,KAAmBC,GAAqBV,GAAgB,CAAA,GAC5DM,GAAIK,KAAYC,GAAcd,GAAc,CAAA,GAC5CQ,GAAIO,KAAoBC,GAAsBxB,GAAsB,CAAA,GACpEgB,GAAIS,KAAaC,GAAezB,GAAe,CAAA,GAC/Ce,GAAIW,KAAkBC,GAAoBzB,GAAoB,CAAA,GAC9Da,GAAIa,KAAcC,GAAgBnB,GAAkB,CAAA,GACpDK,GAAIe,KAAaC,GAAepB,GAAiB,CAAA,EACnDqB,EAAQC,EAAAA,WACRC,EAA6B9B,GAA4B+B,EAAAA,WAEzDC,aAAEA,EAAYC,WAAEA,GAAeC,EAAAA,qBAAqB,KAE1D,OACEC,EAAAA,KAACC,mBACCC,IAAKT,EAAMU,UACXC,OAAO,SACPhD,KAAMA,EACNiD,QAAS,IAAMhD,GAAQ,GACvBiD,OAAQ,IAAMjD,GAAQ,GACtBkD,oBAAkB,EAClBC,WAAY,CACVC,aAAa,GACd,cACW,cACZnD,UAAW,IACNA,EACHoD,MAAO,IACFpD,GAAWoD,MACdlC,GAAI,CACFmC,UAAW,OACXC,oBAAqB,OACrBC,qBAAsB,OACtBxC,UAAW,GAAGA,QACVf,GAAWoD,OAAsBlC,MAI3CD,IAAKA,KACDD,EAAInB,SAAA,EAENY,GAASL,GAAeH,IACxByC,EAAAA,KAACc,EAAAA,IAAG,CAACtC,GAAIuC,EAAAA,WAAW,CAAEC,GAAI,GAAKvC,GAAS,cAAc,wBAAyBC,YAC5EnB,GACC0D,EAAAA,IAACH,EAAAA,KACCtC,GAAIuC,EAAAA,WACF,CACEG,SAAU,WACVC,QAAS,OACTC,cAAe,MACfC,eAAgB,SAChBC,WAAY,UAEdvC,MAEEC,EAAiB7B,SAErB8D,EAAAA,IAACH,EAAAA,IAAG,CAAA,cACU,qBACZtC,GAAIuC,EAAAA,WACF,CACEQ,MAAO,OACPC,OAAQ,MACRC,gBAAiB,kBACjBC,GAAI,EACJC,GAAI,IACJC,aAAc,OAEhB3C,MAEEC,OAIRnB,GAAUL,IAAgBH,IAC1ByC,EAAAA,KAACc,EAAAA,IAAG,CACFtC,GAAIuC,aACF,CACEI,QAAS,OACTE,eAAgBtD,EAAQ,gBAAkB,WAC1CuD,WAAY,aACZO,IAAK,EACLC,GAAIjC,GAAgBtC,EAAS,EAAI,GAEnCoB,MAEEC,EAAgBzB,SAAA,CAEnBY,GACCkD,EAAAA,IAACc,EAAAA,WAAU,CAAA,cACG,oBACZC,QAAQ,KACRC,UAAU,KACVzD,GAAIuC,aACF,CACEW,GAAInE,EAAS,EAAI,EACjBoE,GAAI9B,EAAe,EAAI,EACvBqC,SAAU,UAEZrD,MAEEC,EAAS3B,SAEZY,IAGJL,IAAgBH,GACf0D,EAAAA,IAACkB,EAAAA,WAAU,CAAA,cACG,0BACZC,KAAK,SACLC,QAAS,IAAMhF,GAAQ,GAAM,aAClB,qBACXmB,GAAIuC,EAAAA,WACF,CACEuB,GAAI,MACJC,GAAI,QAENpD,MAEEC,EAAejC,SAEnB8D,EAAAA,IAACtB,EAA0B,IAAK/B,YAO5CqD,EAAAA,IAACH,MAAG,CAAA,cACU,sBACZvC,IAAKuB,EACLtB,GAAIuC,EAAAA,WACF,CACEmB,SAAU,OACVM,UAAW3C,EAAe,EAAI,EAC9B4C,aAAc5C,GAAgB/B,EAAa,EAAI,EAC/C4E,YAAa,oBACbC,EAAG,EAEH,kBAAmB,CACjBC,QAAS,OACTjC,UAAWkC,EAAAA,sBAAsBpD,GAAO,KAG5CJ,MAEEC,EAAWnC,SAEdA,IAEFW,GACCmD,EAAAA,IAACH,EAAAA,IAAG,CAAA,cACU,qBACZtC,GAAIuC,EAAAA,WACF,CACEC,GAAI,EACJc,GAAI,EACJgB,GAAI,EACJ3B,QAAS,OACTE,eAAgB,aAChBC,WAAY,UACZF,cAAe,SACfS,IAAK,QAEPtC,MAEEC,EAAUrC,SAEbW"}

package/cjs/components/carousel/Autoplay.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import { BoxProps } from '@mui/material';
 import { Swiper as CarouselInstance } from 'swiper';
-import { PlayPauseButtonProps } from '@/src/components/playPauseButton/PlayPauseButton';
-import { SpinnerProps } from '@/src/components/progress/Spinner';
+import { PlayPauseButtonProps } from '../playPauseButton/PlayPauseButton';
+import { SpinnerProps } from '../progress/Spinner';
 export interface CarouselAutoplayProgressProps extends Omit<BoxProps, 'children' | 'position'> {
     /**
      * Optional Carousel instance from useCarouselInstance hook
@@ -19,14 +19,19 @@ export interface CarouselAutoplayProgressProps extends Omit<BoxProps, 'children'
 /**
  * Spinner with autoplay progress value
  */
-export declare const CarouselAutoplayProgress: ({ carousel: carouselProp, sx, spinnerProps, position, ...rest }: CarouselAutoplayProgressProps) => import("react/jsx-runtime").JSX.Element;
-export interface CarouselAutoplayIconButtonProps extends Partial<PlayPauseButtonProps> {
+export declare const CarouselAutoplayProgress: ({ carousel: carouselProp, sx, spinnerProps, position, ...rest }: CarouselAutoplayProgressProps) => import("react").JSX.Element;
+export interface CarouselAutoplayIconButtonProps extends Omit<Partial<PlayPauseButtonProps>, 'aria-label'> {
     /**
      * Optional Carousel instance from useCarouselInstance hook
      */
     carousel?: CarouselInstance;
+    /**
+     * Accessible label for the button. Accepts a plain string or a function called with the current playing state.
+     * @default (isPlaying) => isPlaying ? 'Pause carousel autoplay' : 'Play carousel autoplay'
+     */
+    'aria-label'?: string | ((isPlaying: boolean) => string);
 }
 /**
  * IconButton controlling play/paused state of the autoplay
  */
-export declare function CarouselAutoplayIconButton({ carousel: carouselProp, ...rest }: CarouselAutoplayIconButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function CarouselAutoplayIconButton({ carousel: carouselProp, 'aria-label': ariaLabel, ...rest }: CarouselAutoplayIconButtonProps): import("react").JSX.Element;

package/cjs/components/carousel/Autoplay.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),a=require("../../utils/sxOverride/sxOverride.js"),s=require("./hooks.js"),t=require("../../node_modules/swiper/swiper-react.js"),u=require("react"),o=require("../playPauseButton/PlayPauseButton.js"),i=require("../progress/Spinner.js");exports.CarouselAutoplayIconButton=function({carousel:r,...a}){const t=s.useCarousel(),i=r||t,[l,n]=u.useState(0);return u.useEffect(()=>{i?.autoplay&&i.on("autoplayTimeLeft",(e,r,a)=>{n(e.autoplay.paused?0:Math.round(100-100*a))})},[!!i]),e.jsx(o.PlayPauseButton,{"aria-label":i?.autoplay?.running?"Pause carousel autoplay":"Play carousel autoplay",isPlaying:!!i?.autoplay?.running,progress:l,onClick:()=>{i?.autoplay?.[i?.autoplay?.running?"stop":"start"]()},...a})},exports.CarouselAutoplayProgress=({carousel:s,sx:o,spinnerProps:l,position:n="outside",...p})=>{const[y,c]=u.useState(0),d=t.useSwiper(),x=s||d;return u.useEffect(()=>{x?.autoplay&&x.on("autoplayTimeLeft",(e,r,a)=>{c(e.autoplay.paused?0:Math.round(100-100*a))})},[!!x]),e.jsx(r.Box,{sx:a.sxOverride({position:"relative",display:"flex",m:2,..."inside"===n&&{position:"absolute",zIndex:"90",bottom:"0",left:"0",right:"0",m:2}},o),"data-testid":"CarouselAutoplayProgress",...p,children:e.jsx(i.Spinner,{value:y,...l})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),a=require("../../utils/sxOverride/sxOverride.js"),s=require("./hooks.js"),t=require("../../node_modules/swiper/swiper-react.js"),u=require("react"),o=require("../playPauseButton/PlayPauseButton.js"),i=require("../progress/Spinner.js");exports.CarouselAutoplayIconButton=function({carousel:r,"aria-label":a=e=>e?"Pause carousel autoplay":"Play carousel autoplay",...t}){const i=s.useCarousel(),l=r||i,[n,p]=u.useState(0),y=!!l?.autoplay?.running;return u.useEffect(()=>{l?.autoplay&&l.on("autoplayTimeLeft",(e,r,a)=>{p(e.autoplay.paused?0:Math.round(100-100*a))})},[!!l]),e.jsx(o.PlayPauseButton,{"aria-label":"function"==typeof a?a(y):a,isPlaying:y,progress:n,onClick:()=>{l?.autoplay?.[l?.autoplay?.running?"stop":"start"]()},...t})},exports.CarouselAutoplayProgress=({carousel:s,sx:o,spinnerProps:l,position:n="outside",...p})=>{const[y,c]=u.useState(0),d=t.useSwiper(),x=s||d;return u.useEffect(()=>{x?.autoplay&&x.on("autoplayTimeLeft",(e,r,a)=>{c(e.autoplay.paused?0:Math.round(100-100*a))})},[!!x]),e.jsx(r.Box,{sx:a.sxOverride({position:"relative",display:"flex",m:2,..."inside"===n&&{position:"absolute",zIndex:"90",bottom:"0",left:"0",right:"0",m:2}},o),"data-testid":"CarouselAutoplayProgress",...p,children:e.jsx(i.Spinner,{value:y,...l})})};
 //# sourceMappingURL=Autoplay.js.map

package/cjs/components/carousel/Autoplay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Autoplay.js","sources":["../../../../../src/components/carousel/Autoplay.tsx"],"sourcesContent":["import { Box, BoxProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { useCarousel } from './hooks';\nimport { Swiper as CarouselInstance } from 'swiper';\nimport { useSwiper } from 'swiper/react';\nimport { useEffect, useState } from 'react';\nimport { PlayPauseButton, PlayPauseButtonProps } from '@/src/components/playPauseButton/PlayPauseButton';\nimport { Spinner, SpinnerProps } from '@/src/components/progress/Spinner';\n\nexport interface CarouselAutoplayProgressProps extends Omit<BoxProps, 'children' \| 'position'> {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Progress Props\n /\n spinnerProps?: Omit<SpinnerProps, 'value'>;\n /\n Append style to wrapper box to change position of component\n /\n position?: 'outside' \| 'inside';\n}\n\n/\n Spinner with autoplay progress value\n /\nexport const CarouselAutoplayProgress = ({\n carousel: carouselProp,\n sx,\n spinnerProps,\n position = 'outside',\n ...rest\n}: CarouselAutoplayProgressProps) => {\n const [value, setValue] = useState<number>(0);\n const carouselHook = useSwiper();\n const carousel = carouselProp \|\| carouselHook;\n\n useEffect(() => {\n // attach listener that controls progress value based on swiper special event\n if (carousel?.autoplay) {\n carousel.on('autoplayTimeLeft', (instance, _timeLeft, percentage) => {\n setValue(instance.autoplay.paused ? 0 : Math.round(100 - percentage 100));\n });\n }\n }, [!!carousel]);\n\n return (\n <Box\n sx={sxOverride(\n {\n position: 'relative',\n display: 'flex',\n m: 2,\n ...(position === 'inside' && {\n position: 'absolute',\n zIndex: '90',\n bottom: '0',\n left: '0',\n right: '0',\n m: 2,\n }),\n },\n sx,\n )}\n data-testid=\"CarouselAutoplayProgress\"\n {...rest}\n >\n <Spinner value={value} {...spinnerProps} />\n </Box>\n );\n};\n\nexport interface CarouselAutoplayIconButtonProps extends Partial<PlayPauseButtonProps> {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n}\n\n/\n IconButton controlling play/paused state of the autoplay\n /\nexport function CarouselAutoplayIconButton({ carousel: carouselProp, ...rest }: CarouselAutoplayIconButtonProps) {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n const [value, setValue] = useState<number>(0);\n\n useEffect(() => {\n // attach listener that controls progress value based on swiper special event\n if (carousel?.autoplay) {\n carousel.on('autoplayTimeLeft', (instance, _timeLeft, percentage) => {\n setValue(instance.autoplay.paused ? 0 : Math.round(100 - percentage 100));\n });\n }\n }, [!!carousel]);\n\n return (\n <PlayPauseButton\n aria-label={~~carousel?.autoplay?.running~~ ? '~~Pause~~ ~~carousel~~ ~~autoplay'~~ : ~~'Play carousel autoplay'~~}\n isPlaying={~~!!carousel?.autoplay?.running~~}\n progress={value}\n onClick={() => {\n carousel?.autoplay?.[carousel?.autoplay?.running ? 'stop' : 'start']();\n }}\n {...rest}\n />\n );\n}\n"],"names":["carousel","carouselProp","rest","carouselHook","useCarousel","value","setValue","useState","~~useEffect~~","~~autoplay~~","on","instance","_timeLeft","percentage","paused","Math","round","_jsx","PlayPauseButton","~~running","isPlaying","~~progress","onClick","sx","spinnerProps","position","useSwiper","Box","sxOverride","display","m","zIndex","bottom","left","right","Spinner"],"mappings":"~~yVAmFM~~,~~UAAuCA~~,SAAUC,~~KAAiBC~~,~~IACtE~~,MAAMC,EAAeC,EAAAA,~~cACfJ~~,EAAWC,~~GAAgBE~~,GAC1BE,EAAOC,GAAYC,EAAAA,SAAiB,~~GAW3C~~,OATAC,EAAAA,UAAU,~~KAEJR~~,~~GAAUS~~,~~UACZT~~,~~EAASU~~,GAAG,mBAAoB,CAACC,EAAUC,EAAWC,~~KACpDP~~,~~EAASK~~,~~EAASF~~,~~SAASK~~,OAAS,EAAIC,KAAKC,MAAM,IAAmB,IAAbH,OAG5D,~~GAAGb~~,~~IAGJiB~~,EAAAA,IAACC,EAAAA,gBAAe,CAAA,~~aACFlB~~,~~GAAUS~~,~~UAAUU~~,~~QAAU~~,~~0BAA4B~~,~~yBACtEC~~,~~YAAapB~~,~~GAAUS~~,~~UAAUU~~,~~QACjCE~~,~~SAAUhB,EACViB,~~QAAS,~~KACPtB~~,~~GAAUS~~,~~WAAWT~~,~~GAAUS~~,~~UAAUU~~,QAAU,OAAS,~~eAE1DjB~~,GAGV,~~mCAjFwC~~,~~EACtCF~~,SAAUC,~~EACVsB~~,KACAC,eACAC,WAAW,~~aACRvB~~,MAEH,MAAOG,EAAOC,GAAYC,EAAAA,SAAiB,GACrCJ,~~EAAeuB~~,EAAAA,~~YACf1B~~,EAAWC,~~GAAgBE~~,EAWjC,~~OATAK~~,EAAAA,UAAU,~~KAEJR~~,~~GAAUS~~,~~UACZT~~,~~EAASU~~,GAAG,mBAAoB,CAACC,EAAUC,EAAWC,~~KACpDP~~,~~EAASK~~,~~EAASF~~,~~SAASK~~,OAAS,EAAIC,KAAKC,MAAM,IAAmB,IAAbH,OAG5D,~~GAAGb~~,~~IAGJiB~~,~~MAACU~~,EAAAA,KACCJ,GAAIK,EAAAA,WACF,CACEH,SAAU,WACVI,QAAS,OACTC,EAAG,KACc,WAAbL,GAAyB,CAC3BA,SAAU,WACVM,OAAQ,KACRC,OAAQ,IACRC,KAAM,IACNC,MAAO,IACPJ,EAAG,IAGPP,GACD,cACW,~~8BACRrB~~,~~WAEJe~~,EAAAA,~~IAACkB~~,EAAAA,QAAO,~~CAAC9B~~,MAAOA,~~KAAWmB~~"}
1	+ {"version":3,"file":"Autoplay.js","sources":["../../../../../src/components/carousel/Autoplay.tsx"],"sourcesContent":["import { Box, BoxProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { useCarousel } from './hooks';\nimport { Swiper as CarouselInstance } from 'swiper';\nimport { useSwiper } from 'swiper/react';\nimport { useEffect, useState } from 'react';\nimport { PlayPauseButton, PlayPauseButtonProps } from '@/src/components/playPauseButton/PlayPauseButton';\nimport { Spinner, SpinnerProps } from '@/src/components/progress/Spinner';\n\nexport interface CarouselAutoplayProgressProps extends Omit<BoxProps, 'children' \| 'position'> {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Progress Props\n /\n spinnerProps?: Omit<SpinnerProps, 'value'>;\n /\n Append style to wrapper box to change position of component\n /\n position?: 'outside' \| 'inside';\n}\n\n/\n Spinner with autoplay progress value\n /\nexport const CarouselAutoplayProgress = ({\n carousel: carouselProp,\n sx,\n spinnerProps,\n position = 'outside',\n ...rest\n}: CarouselAutoplayProgressProps) => {\n const [value, setValue] = useState<number>(0);\n const carouselHook = useSwiper();\n const carousel = carouselProp \|\| carouselHook;\n\n useEffect(() => {\n // attach listener that controls progress value based on swiper special event\n if (carousel?.autoplay) {\n carousel.on('autoplayTimeLeft', (instance, _timeLeft, percentage) => {\n setValue(instance.autoplay.paused ? 0 : Math.round(100 - percentage 100));\n });\n }\n }, [!!carousel]);\n\n return (\n <Box\n sx={sxOverride(\n {\n position: 'relative',\n display: 'flex',\n m: 2,\n ...(position === 'inside' && {\n position: 'absolute',\n zIndex: '90',\n bottom: '0',\n left: '0',\n right: '0',\n m: 2,\n }),\n },\n sx,\n )}\n data-testid=\"CarouselAutoplayProgress\"\n {...rest}\n >\n <Spinner value={value} {...spinnerProps} />\n </Box>\n );\n};\n\nexport interface CarouselAutoplayIconButtonProps extends Omit<Partial<PlayPauseButtonProps>, 'aria-label'> {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Accessible label for the button. Accepts a plain string or a function called with the current playing state.\n * @default (isPlaying) => isPlaying ? 'Pause carousel autoplay' : 'Play carousel autoplay'\n /\n 'aria-label'?: string \| ((isPlaying: boolean) => string);\n}\n\n/\n IconButton controlling play/paused state of the autoplay\n /\nexport function CarouselAutoplayIconButton({\n carousel: carouselProp,\n 'aria-label': ariaLabel = (isPlaying) => isPlaying ? 'Pause carousel autoplay' : 'Play carousel autoplay',\n ...rest\n}: CarouselAutoplayIconButtonProps) {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n const [value, setValue] = useState<number>(0);\n const isPlaying = !!carousel?.autoplay?.running;\n\n useEffect(() => {\n // attach listener that controls progress value based on swiper special event\n if (carousel?.autoplay) {\n carousel.on('autoplayTimeLeft', (instance, _timeLeft, percentage) => {\n setValue(instance.autoplay.paused ? 0 : Math.round(100 - percentage 100));\n });\n }\n }, [!!carousel]);\n\n return (\n <PlayPauseButton\n aria-label={typeof ariaLabel === 'function' ? ariaLabel(isPlaying) : ariaLabel}\n isPlaying={isPlaying}\n progress={value}\n onClick={() => {\n carousel?.autoplay?.[carousel?.autoplay?.running ? 'stop' : 'start']();\n }}\n {...rest}\n />\n );\n}\n"],"names":["carousel","carouselProp","ariaLabel","isPlaying","rest","carouselHook","useCarousel","value","setValue","useState","autoplay","running","useEffect","on","instance","_timeLeft","percentage","paused","Math","round","_jsx","PlayPauseButton","progress","onClick","sx","spinnerProps","position","useSwiper","Box","sxOverride","display","m","zIndex","bottom","left","right","Spinner"],"mappings":"yVAwFM,UACJA,SAAUC,EACV,aAAcC,EAAaC,GAAcA,EAAY,0BAA4B,4BAC9EC,IAEH,MAAMC,EAAeC,EAAAA,cACfN,EAAWC,GAAgBI,GAC1BE,EAAOC,GAAYC,EAAAA,SAAiB,GACrCN,IAAcH,GAAUU,UAAUC,QAWxC,OATAC,EAAAA,UAAU,KAEJZ,GAAUU,UACZV,EAASa,GAAG,mBAAoB,CAACC,EAAUC,EAAWC,KACpDR,EAASM,EAASJ,SAASO,OAAS,EAAIC,KAAKC,MAAM,IAAmB,IAAbH,OAG5D,GAAGhB,IAGJoB,EAAAA,IAACC,EAAAA,gBAAe,CAAA,aACmB,mBAAdnB,EAA2BA,EAAUC,GAAaD,EACrEC,UAAWA,EACXmB,SAAUf,EACVgB,QAAS,KACPvB,GAAUU,WAAWV,GAAUU,UAAUC,QAAU,OAAS,eAE1DP,GAGV,mCA3FwC,EACtCJ,SAAUC,EACVuB,KACAC,eACAC,WAAW,aACRtB,MAEH,MAAOG,EAAOC,GAAYC,EAAAA,SAAiB,GACrCJ,EAAesB,EAAAA,YACf3B,EAAWC,GAAgBI,EAWjC,OATAO,EAAAA,UAAU,KAEJZ,GAAUU,UACZV,EAASa,GAAG,mBAAoB,CAACC,EAAUC,EAAWC,KACpDR,EAASM,EAASJ,SAASO,OAAS,EAAIC,KAAKC,MAAM,IAAmB,IAAbH,OAG5D,GAAGhB,IAGJoB,MAACQ,EAAAA,KACCJ,GAAIK,EAAAA,WACF,CACEH,SAAU,WACVI,QAAS,OACTC,EAAG,KACc,WAAbL,GAAyB,CAC3BA,SAAU,WACVM,OAAQ,KACRC,OAAQ,IACRC,KAAM,IACNC,MAAO,IACPJ,EAAG,IAGPP,GACD,cACW,8BACRpB,WAEJgB,EAAAA,IAACgB,EAAAA,QAAO,CAAC7B,MAAOA,KAAWkB"}

package/cjs/components/carousel/Navigation.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ComponentType } from 'react';
+import React, { ComponentType } from 'react';
 import { IconButtonProps, SvgIconProps } from '@mui/material';
 import type { Swiper as CarouselInstance } from 'swiper';
 export interface CarouselNavigationProps {
@@ -54,4 +54,4 @@ export interface CarouselNavigationProps {
 /**
  * Left & Right navigation arrows
  */
-export declare function CarouselNavigation({ carousel: carouselProp, peekEffect: propPeekEffect, prevButtonProps, prevIconProps, PrevIconComponent, nextButtonProps, nextIconProps, NextIconComponent, arrows, onBackground, autoHideNavigation, }: CarouselNavigationProps): import("react/jsx-runtime").JSX.Element;
+export declare function CarouselNavigation({ carousel: carouselProp, peekEffect: propPeekEffect, prevButtonProps, prevIconProps, PrevIconComponent, nextButtonProps, nextIconProps, NextIconComponent, arrows, onBackground, autoHideNavigation, }: CarouselNavigationProps): React.JSX.Element;

package/cjs/components/carousel/Navigation.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("./hooks.js"),s=require("@mui/material"),n=require("../icon/stroke/ChevronLeftIcon.js"),t=require("../icon/stroke/ChevronRightIcon.js"),i=require("../icon/stroke/ArrowLeftIcon.js"),a=require("../icon/stroke/ArrowRightIcon.js"),c=require("../../materialui/button/interactive.js"),u=require("../../utils/sxOverride/sxOverride.js");exports.CarouselNavigation=function({carousel:l,peekEffect:d=!1,prevButtonProps:x,prevIconProps:p,PrevIconComponent:v,nextButtonProps:m,nextIconProps:I,NextIconComponent:f,arrows:b=!0,onBackground:g=!1,autoHideNavigation:h=!1}){const C=o.useCarousel(),j=l||C,k="fade"!==j?.params?.effect&&d,q=s.useTheme(),y=s.useMediaQuery(q.breakpoints.up("md")),{sx:M,...P}=x||{},{sx:L,...w}=m||{},[B,E]=o.useCarouselPeekEffect(j),N=v||(b?i.ArrowLeftIcon:n.ChevronLeftIcon),S=f||(b?a.ArrowRightIcon:t.ChevronRightIcon),A=r.useMemo(()=>({position:"absolute",zIndex:"100",top:"50%",width:{xs:"32px",md:"40px",xl:"44px"},height:{xs:"32px",md:"40px",xl:"44px"},mt:{xs:"-16px",md:"-20px",xl:"-22px"},"& .MuiSvgIcon-root":{fontSize:{xs:"17px",xl:"20px"}},...c.getInteractiveStyle({color:"text.primary",borderColor:g?"transparent.transparent":"onSurface.os100",backgroundColor:g?"transparent.transparent":"surface.primary"},{backgroundColor:"surface.secondary"}),"&.Mui-disabled":{color:"disabled.tertiary",borderColor:g?"transparent.transparent":"disabled.secondary",backgroundColor:g?"transparent.transparent":"disabled.secondary"}}),[]);return h&&j?.isLocked?null:e.jsxs(e.Fragment,{children:[e.jsx(s.IconButton,{disabled:j&&!j.params?.loop&&j.isBeginning,onClick:()=>{j?.slidePrev(),k&&B&&E("reset")},onMouseEnter:()=>y&&k&&E("prev"),onMouseLeave:()=>k&&B&&E("reset"),sx:u.sxOverride({...A,insetInlineStart:"16px"},M),"aria-label":"Previous slide","aria-controls":"carousel",color:"surface",size:"medium",...P,children:"rtl"===q.direction?e.jsx(S,{...p}):e.jsx(N,{...p})}),e.jsx(s.IconButton,{disabled:j&&!j.params?.loop&&j.isEnd,onClick:()=>{j?.slideNext(),k&&B&&E("reset")},onMouseEnter:()=>y&&k&&E("next"),onMouseLeave:()=>k&&B&&E("reset"),sx:u.sxOverride({...A,insetInlineEnd:"16px"},L),"aria-label":"Next slide","aria-controls":"carousel",color:"surface",...w,children:"rtl"===q.direction?e.jsx(N,{...I}):e.jsx(S,{...I})})]})};
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("./hooks.js"),s=require("@mui/material"),n=require("../icon/stroke/ChevronLeftIcon.js"),t=require("../icon/stroke/ChevronRightIcon.js"),i=require("../icon/stroke/ArrowLeftIcon.js"),a=require("../icon/stroke/ArrowRightIcon.js"),c=require("../../materialui/button/interactive.js"),u=require("../../utils/sxOverride/sxOverride.js");exports.CarouselNavigation=function({carousel:l,peekEffect:d=!1,prevButtonProps:x,prevIconProps:p,PrevIconComponent:v,nextButtonProps:m,nextIconProps:I,NextIconComponent:f,arrows:b=!0,onBackground:g=!1,autoHideNavigation:h=!1}){const C=o.useCarousel(),j=l||C,k="fade"!==j?.params?.effect&&d,q=s.useTheme(),y=s.useMediaQuery(q.breakpoints.up("md")),{sx:M,...P}=x||{},{sx:L,...w}=m||{},[B,E]=o.useCarouselPeekEffect(j),N=v||(b?i.ArrowLeftIcon:n.ChevronLeftIcon),S=f||(b?a.ArrowRightIcon:t.ChevronRightIcon),A=r.useMemo(()=>({position:"absolute",zIndex:"100",top:"50%",width:{xs:"32px",md:"40px",xl:"44px"},height:{xs:"32px",md:"40px",xl:"44px"},mt:{xs:"-16px",md:"-20px",xl:"-22px"},"& .MuiSvgIcon-root":{fontSize:{xs:"17px",xl:"20px"}},...c.getInteractiveStyle({color:"text.primary",borderColor:g?"transparent":"onSurface.os100",backgroundColor:g?"transparent":"surface.primary"},{backgroundColor:"surface.secondary"}),"&.Mui-disabled":{color:"disabled.tertiary",borderColor:g?"transparent":"disabled.secondary",backgroundColor:g?"transparent":"disabled.secondary"}}),[]);return h&&j?.isLocked?null:e.jsxs(e.Fragment,{children:[e.jsx(s.IconButton,{disabled:j&&!j.params?.loop&&j.isBeginning,onClick:()=>{j?.slidePrev(),k&&B&&E("reset")},onMouseEnter:()=>y&&k&&E("prev"),onMouseLeave:()=>k&&B&&E("reset"),sx:u.sxOverride({...A,insetInlineStart:"16px"},M),"aria-label":"Previous slide","aria-controls":"carousel",color:"surface",size:"medium",...P,children:"rtl"===q.direction?e.jsx(S,{...p}):e.jsx(N,{...p})}),e.jsx(s.IconButton,{disabled:j&&!j.params?.loop&&j.isEnd,onClick:()=>{j?.slideNext(),k&&B&&E("reset")},onMouseEnter:()=>y&&k&&E("next"),onMouseLeave:()=>k&&B&&E("reset"),sx:u.sxOverride({...A,insetInlineEnd:"16px"},L),"aria-label":"Next slide","aria-controls":"carousel",color:"surface",...w,children:"rtl"===q.direction?e.jsx(N,{...I}):e.jsx(S,{...I})})]})};
 //# sourceMappingURL=Navigation.js.map

package/cjs/components/carousel/Navigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Navigation.js","sources":["../../../../../src/components/carousel/Navigation.tsx"],"sourcesContent":["import React, { useMemo, ComponentType } from 'react';\nimport { useCarousel, useCarouselPeekEffect } from './hooks';\nimport { useTheme, IconButton, IconButtonProps, SvgIconProps, useMediaQuery } from '@mui/material';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\nexport interface CarouselNavigationProps {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Enable/disable peek effect on hover\n * @default: false\n /\n peekEffect?: boolean;\n /\n Previous Slide IconButton\n /\n prevButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n prevIconProps?: SvgIconProps;\n /\n Previous icon node\n /\n PrevIconComponent?: ComponentType<SvgIconProps>;\n /\n Next Slide IconButton\n /\n nextButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n nextIconProps?: SvgIconProps;\n /\n Next icon node\n /\n NextIconComponent?: ComponentType<SvgIconProps>;\n /\n Replaces Chevrons with Arrows\n * @default true\n /\n arrows?: boolean;\n /\n Enable if placing on a plain background (not on top of an image/video)\n * @default false\n /\n onBackground?: boolean;\n /\n Hide navigation buttons on case there are not enough slides for sliding\n * @default false\n /\n autoHideNavigation?: boolean;\n}\n\n/\n Left & Right navigation arrows\n */\nexport function CarouselNavigation({\n carousel: carouselProp,\n peekEffect: propPeekEffect = false,\n prevButtonProps,\n prevIconProps,\n PrevIconComponent,\n nextButtonProps,\n nextIconProps,\n NextIconComponent,\n arrows = true,\n onBackground = false,\n autoHideNavigation = false,\n}: CarouselNavigationProps) {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n const peekEffect = carousel?.params?.effect !== 'fade' && propPeekEffect;\n const theme = useTheme();\n const upMD = useMediaQuery(theme.breakpoints.up('md'));\n const { sx: prevSx, ...restPrev } = prevButtonProps \|\| {};\n const { sx: nextSx, ...restNext } = nextButtonProps \|\| {};\n const [peek, setPeek] = useCarouselPeekEffect(carousel);\n const PrevIcon = PrevIconComponent \|\| (arrows ? ArrowLeftIcon : ChevronLeftIcon);\n const NextIcon = NextIconComponent \|\| (arrows ? ArrowRightIcon : ChevronRightIcon);\n\n // shared style between buttons\n const sharedSx = useMemo(\n () => ({\n // absolute inside the carousel position\n position: 'absolute',\n zIndex: '100',\n top: '50%',\n // responsive\n width: { xs: '32px', md: '40px', xl: '44px' },\n height: { xs: '32px', md: '40px', xl: '44px' },\n // manual v-align, half the icon size\n mt: { xs: '-16px', md: '-20px', xl: '-22px' },\n '& .MuiSvgIcon-root': {\n fontSize: { xs: '17px', xl: '20px' },\n },\n // highlight border\n ...getInteractiveStyle(\n {\n color: 'text.primary',\n borderColor: onBackground ? 'transparent~~.transparent~~' : 'onSurface.os100',\n backgroundColor: onBackground ? 'transparent~~.transparent~~' : 'surface.primary',\n },\n {\n backgroundColor: 'surface.secondary',\n },\n ),\n // disabled state\n '&.Mui-disabled': {\n color: 'disabled.tertiary',\n borderColor: onBackground ? 'transparent~~.transparent~~' : 'disabled.secondary',\n backgroundColor: onBackground ? 'transparent~~.transparent~~' : 'disabled.secondary',\n },\n }),\n [],\n );\n\n // hide navigation when not needed\n if (autoHideNavigation && carousel?.isLocked) {\n return null;\n }\n return (\n <>\n <IconButton\n disabled={carousel && !carousel.params?.loop && carousel.isBeginning}\n onClick={() => {\n carousel?.slidePrev();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('prev')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={sxOverride(\n {\n ...sharedSx,\n insetInlineStart: '16px',\n },\n prevSx,\n )}\n aria-label=\"Previous slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n size=\"medium\"\n {...restPrev}\n >\n {theme.direction === 'rtl' ? <NextIcon {...prevIconProps} /> : <PrevIcon {...prevIconProps} />}\n </IconButton>\n <IconButton\n disabled={carousel && !carousel.params?.loop && carousel.isEnd}\n onClick={() => {\n carousel?.slideNext();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('next')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={sxOverride(\n {\n ...sharedSx,\n insetInlineEnd: '16px',\n },\n nextSx,\n )}\n aria-label=\"Next slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n {...restNext}\n >\n {theme.direction === 'rtl' ? <PrevIcon {...nextIconProps} /> : <NextIcon {...nextIconProps} />}\n </IconButton>\n </>\n );\n}\n"],"names":["carousel","carouselProp","peekEffect","propPeekEffect","prevButtonProps","prevIconProps","PrevIconComponent","nextButtonProps","nextIconProps","NextIconComponent","arrows","onBackground","autoHideNavigation","carouselHook","useCarousel","params","effect","theme","useTheme","upMD","useMediaQuery","breakpoints","up","sx","prevSx","restPrev","nextSx","restNext","peek","setPeek","useCarouselPeekEffect","PrevIcon","ArrowLeftIcon","ChevronLeftIcon","NextIcon","ArrowRightIcon","ChevronRightIcon","sharedSx","useMemo","position","zIndex","top","width","xs","md","xl","height","mt","fontSize","getInteractiveStyle","color","borderColor","backgroundColor","isLocked","_jsxs","_jsx","IconButton","disabled","loop","isBeginning","onClick","slidePrev","onMouseEnter","onMouseLeave","sxOverride","insetInlineStart","size","children","direction","isEnd","slideNext","insetInlineEnd"],"mappings":"2bAkEEA,SAAUC,EACVC,WAAYC,GAAiB,EAAKC,gBAClCA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,gBACjBA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,OACjBA,GAAS,EAAIC,aACbA,GAAe,EAAKC,mBACpBA,GAAqB,IAErB,MAAMC,EAAeC,EAAAA,cACfd,EAAWC,GAAgBY,EAC3BX,EAA0C,SAA7BF,GAAUe,QAAQC,QAAqBb,EACpDc,EAAQC,EAAAA,WACRC,EAAOC,EAAAA,cAAcH,EAAMI,YAAYC,GAAG,QACxCC,GAAIC,KAAWC,GAAarB,GAAmB,CAAA,GAC/CmB,GAAIG,KAAWC,GAAapB,GAAmB,CAAA,GAChDqB,EAAMC,GAAWC,EAAAA,sBAAsB9B,GACxC+B,EAAWzB,IAAsBI,EAASsB,EAAAA,cAAgBC,EAAAA,iBAC1DC,EAAWzB,IAAsBC,EAASyB,EAAAA,eAAiBC,EAAAA,kBAG3DC,EAAWC,EAAAA,QACf,KAAA,CAEEC,SAAU,WACVC,OAAQ,MACRC,IAAK,MAELC,MAAO,CAAEC,GAAI,OAAQC,GAAI,OAAQC,GAAI,QACrCC,OAAQ,CAAEH,GAAI,OAAQC,GAAI,OAAQC,GAAI,QAEtCE,GAAI,CAAEJ,GAAI,QAASC,GAAI,QAASC,GAAI,SACpC,qBAAsB,CACpBG,SAAU,CAAEL,GAAI,OAAQE,GAAI,YAG3BI,sBACD,CACEC,MAAO,eACPC,YAAaxC,EAAe,~~0BAA4B~~,~~kBACxDyC~~,gBAAiBzC,EAAe,~~0BAA4B~~,~~mBAE9D~~,CACEyC,gBAAiB,sBAIrB,iBAAkB,CAChBF,MAAO,oBACPC,YAAaxC,EAAe,~~0BAA4B~~,~~qBACxDyC~~,gBAAiBzC,EAAe,~~0BAA4B~~,~~wBAGhE~~,IAIF,OAAIC,GAAsBZ,GAAUqD,SAC3B,KAGPC,EAAAA,2BACEC,EAAAA,IAACC,EAAAA,YACCC,SAAUzD,IAAaA,EAASe,QAAQ2C,MAAQ1D,EAAS2D,YACzDC,QAAS,KACP5D,GAAU6D,YACV3D,GAAc0B,GAAQC,EAAQ,UAEhCiC,aAAc,IAAM3C,GAAQjB,GAAc2B,EAAQ,QAClDkC,aAAc,IAAM7D,GAAc0B,GAAQC,EAAQ,SAClDN,GAAIyC,aACF,IACK3B,EACH4B,iBAAkB,QAEpBzC,GACD,aACU,iBAAgB,gBACb,WACd0B,MAAM,UACNgB,KAAK,YACDzC,EAAQ0C,SAES,QAApBlD,EAAMmD,UAAsBb,EAAAA,IAACrB,EAAQ,IAAK7B,IAAoBkD,EAAAA,IAACxB,EAAQ,IAAK1B,MAE/EkD,EAAAA,IAACC,EAAAA,WAAU,CACTC,SAAUzD,IAAaA,EAASe,QAAQ2C,MAAQ1D,EAASqE,MACzDT,QAAS,KACP5D,GAAUsE,YACVpE,GAAc0B,GAAQC,EAAQ,UAEhCiC,aAAc,IAAM3C,GAAQjB,GAAc2B,EAAQ,QAClDkC,aAAc,IAAM7D,GAAc0B,GAAQC,EAAQ,SAClDN,GAAIyC,aACF,IACK3B,EACHkC,eAAgB,QAElB7C,GACD,aACU,aAAY,gBACT,WACdwB,MAAM,aACFvB,EAAQwC,SAES,QAApBlD,EAAMmD,UAAsBb,EAAAA,IAACxB,EAAQ,IAAKvB,IAAoB+C,EAAAA,IAACrB,EAAQ,IAAK1B,QAIrF"}
1	+ {"version":3,"file":"Navigation.js","sources":["../../../../../src/components/carousel/Navigation.tsx"],"sourcesContent":["import React, { useMemo, ComponentType } from 'react';\nimport { useCarousel, useCarouselPeekEffect } from './hooks';\nimport { useTheme, IconButton, IconButtonProps, SvgIconProps, useMediaQuery } from '@mui/material';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\nexport interface CarouselNavigationProps {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Enable/disable peek effect on hover\n * @default: false\n /\n peekEffect?: boolean;\n /\n Previous Slide IconButton\n /\n prevButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n prevIconProps?: SvgIconProps;\n /\n Previous icon node\n /\n PrevIconComponent?: ComponentType<SvgIconProps>;\n /\n Next Slide IconButton\n /\n nextButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n nextIconProps?: SvgIconProps;\n /\n Next icon node\n /\n NextIconComponent?: ComponentType<SvgIconProps>;\n /\n Replaces Chevrons with Arrows\n * @default true\n /\n arrows?: boolean;\n /\n Enable if placing on a plain background (not on top of an image/video)\n * @default false\n /\n onBackground?: boolean;\n /\n Hide navigation buttons on case there are not enough slides for sliding\n * @default false\n /\n autoHideNavigation?: boolean;\n}\n\n/\n Left & Right navigation arrows\n */\nexport function CarouselNavigation({\n carousel: carouselProp,\n peekEffect: propPeekEffect = false,\n prevButtonProps,\n prevIconProps,\n PrevIconComponent,\n nextButtonProps,\n nextIconProps,\n NextIconComponent,\n arrows = true,\n onBackground = false,\n autoHideNavigation = false,\n}: CarouselNavigationProps) {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n const peekEffect = carousel?.params?.effect !== 'fade' && propPeekEffect;\n const theme = useTheme();\n const upMD = useMediaQuery(theme.breakpoints.up('md'));\n const { sx: prevSx, ...restPrev } = prevButtonProps \|\| {};\n const { sx: nextSx, ...restNext } = nextButtonProps \|\| {};\n const [peek, setPeek] = useCarouselPeekEffect(carousel);\n const PrevIcon = PrevIconComponent \|\| (arrows ? ArrowLeftIcon : ChevronLeftIcon);\n const NextIcon = NextIconComponent \|\| (arrows ? ArrowRightIcon : ChevronRightIcon);\n\n // shared style between buttons\n const sharedSx = useMemo(\n () => ({\n // absolute inside the carousel position\n position: 'absolute',\n zIndex: '100',\n top: '50%',\n // responsive\n width: { xs: '32px', md: '40px', xl: '44px' },\n height: { xs: '32px', md: '40px', xl: '44px' },\n // manual v-align, half the icon size\n mt: { xs: '-16px', md: '-20px', xl: '-22px' },\n '& .MuiSvgIcon-root': {\n fontSize: { xs: '17px', xl: '20px' },\n },\n // highlight border\n ...getInteractiveStyle(\n {\n color: 'text.primary',\n borderColor: onBackground ? 'transparent' : 'onSurface.os100',\n backgroundColor: onBackground ? 'transparent' : 'surface.primary',\n },\n {\n backgroundColor: 'surface.secondary',\n },\n ),\n // disabled state\n '&.Mui-disabled': {\n color: 'disabled.tertiary',\n borderColor: onBackground ? 'transparent' : 'disabled.secondary',\n backgroundColor: onBackground ? 'transparent' : 'disabled.secondary',\n },\n }),\n [],\n );\n\n // hide navigation when not needed\n if (autoHideNavigation && carousel?.isLocked) {\n return null;\n }\n return (\n <>\n <IconButton\n disabled={carousel && !carousel.params?.loop && carousel.isBeginning}\n onClick={() => {\n carousel?.slidePrev();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('prev')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={sxOverride(\n {\n ...sharedSx,\n insetInlineStart: '16px',\n },\n prevSx,\n )}\n aria-label=\"Previous slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n size=\"medium\"\n {...restPrev}\n >\n {theme.direction === 'rtl' ? <NextIcon {...prevIconProps} /> : <PrevIcon {...prevIconProps} />}\n </IconButton>\n <IconButton\n disabled={carousel && !carousel.params?.loop && carousel.isEnd}\n onClick={() => {\n carousel?.slideNext();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('next')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={sxOverride(\n {\n ...sharedSx,\n insetInlineEnd: '16px',\n },\n nextSx,\n )}\n aria-label=\"Next slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n {...restNext}\n >\n {theme.direction === 'rtl' ? <PrevIcon {...nextIconProps} /> : <NextIcon {...nextIconProps} />}\n </IconButton>\n </>\n );\n}\n"],"names":["carousel","carouselProp","peekEffect","propPeekEffect","prevButtonProps","prevIconProps","PrevIconComponent","nextButtonProps","nextIconProps","NextIconComponent","arrows","onBackground","autoHideNavigation","carouselHook","useCarousel","params","effect","theme","useTheme","upMD","useMediaQuery","breakpoints","up","sx","prevSx","restPrev","nextSx","restNext","peek","setPeek","useCarouselPeekEffect","PrevIcon","ArrowLeftIcon","ChevronLeftIcon","NextIcon","ArrowRightIcon","ChevronRightIcon","sharedSx","useMemo","position","zIndex","top","width","xs","md","xl","height","mt","fontSize","getInteractiveStyle","color","borderColor","backgroundColor","isLocked","_jsxs","_jsx","IconButton","disabled","loop","isBeginning","onClick","slidePrev","onMouseEnter","onMouseLeave","sxOverride","insetInlineStart","size","children","direction","isEnd","slideNext","insetInlineEnd"],"mappings":"2bAkEEA,SAAUC,EACVC,WAAYC,GAAiB,EAAKC,gBAClCA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,gBACjBA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,OACjBA,GAAS,EAAIC,aACbA,GAAe,EAAKC,mBACpBA,GAAqB,IAErB,MAAMC,EAAeC,EAAAA,cACfd,EAAWC,GAAgBY,EAC3BX,EAA0C,SAA7BF,GAAUe,QAAQC,QAAqBb,EACpDc,EAAQC,EAAAA,WACRC,EAAOC,EAAAA,cAAcH,EAAMI,YAAYC,GAAG,QACxCC,GAAIC,KAAWC,GAAarB,GAAmB,CAAA,GAC/CmB,GAAIG,KAAWC,GAAapB,GAAmB,CAAA,GAChDqB,EAAMC,GAAWC,EAAAA,sBAAsB9B,GACxC+B,EAAWzB,IAAsBI,EAASsB,EAAAA,cAAgBC,EAAAA,iBAC1DC,EAAWzB,IAAsBC,EAASyB,EAAAA,eAAiBC,EAAAA,kBAG3DC,EAAWC,EAAAA,QACf,KAAA,CAEEC,SAAU,WACVC,OAAQ,MACRC,IAAK,MAELC,MAAO,CAAEC,GAAI,OAAQC,GAAI,OAAQC,GAAI,QACrCC,OAAQ,CAAEH,GAAI,OAAQC,GAAI,OAAQC,GAAI,QAEtCE,GAAI,CAAEJ,GAAI,QAASC,GAAI,QAASC,GAAI,SACpC,qBAAsB,CACpBG,SAAU,CAAEL,GAAI,OAAQE,GAAI,YAG3BI,sBACD,CACEC,MAAO,eACPC,YAAaxC,EAAe,cAAgB,kBAC5CyC,gBAAiBzC,EAAe,cAAgB,mBAElD,CACEyC,gBAAiB,sBAIrB,iBAAkB,CAChBF,MAAO,oBACPC,YAAaxC,EAAe,cAAgB,qBAC5CyC,gBAAiBzC,EAAe,cAAgB,wBAGpD,IAIF,OAAIC,GAAsBZ,GAAUqD,SAC3B,KAGPC,EAAAA,2BACEC,EAAAA,IAACC,EAAAA,YACCC,SAAUzD,IAAaA,EAASe,QAAQ2C,MAAQ1D,EAAS2D,YACzDC,QAAS,KACP5D,GAAU6D,YACV3D,GAAc0B,GAAQC,EAAQ,UAEhCiC,aAAc,IAAM3C,GAAQjB,GAAc2B,EAAQ,QAClDkC,aAAc,IAAM7D,GAAc0B,GAAQC,EAAQ,SAClDN,GAAIyC,aACF,IACK3B,EACH4B,iBAAkB,QAEpBzC,GACD,aACU,iBAAgB,gBACb,WACd0B,MAAM,UACNgB,KAAK,YACDzC,EAAQ0C,SAES,QAApBlD,EAAMmD,UAAsBb,EAAAA,IAACrB,EAAQ,IAAK7B,IAAoBkD,EAAAA,IAACxB,EAAQ,IAAK1B,MAE/EkD,EAAAA,IAACC,EAAAA,WAAU,CACTC,SAAUzD,IAAaA,EAASe,QAAQ2C,MAAQ1D,EAASqE,MACzDT,QAAS,KACP5D,GAAUsE,YACVpE,GAAc0B,GAAQC,EAAQ,UAEhCiC,aAAc,IAAM3C,GAAQjB,GAAc2B,EAAQ,QAClDkC,aAAc,IAAM7D,GAAc0B,GAAQC,EAAQ,SAClDN,GAAIyC,aACF,IACK3B,EACHkC,eAAgB,QAElB7C,GACD,aACU,aAAY,gBACT,WACdwB,MAAM,aACFvB,EAAQwC,SAES,QAApBlD,EAAMmD,UAAsBb,EAAAA,IAACxB,EAAQ,IAAKvB,IAAoB+C,EAAAA,IAACrB,EAAQ,IAAK1B,QAIrF"}

package/cjs/components/carousel/hooks.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),t=require("../../node_modules/swiper/swiper-react.js");function s(t,s){const[,r]=e.useState({});e.useEffect(()=>{t&&(s??["slideChange","afterInit","reachBeginning","reachEnd","autoplayStart","autoplayStop","lock","unlock"]).forEach(e=>{t.on(e,()=>{r({})})})},[t]),e.useLayoutEffect(()=>{r({})},[])}exports.useCarousel=function(e){const r=t.useSwiper();return s(r,e),r},exports.useCarouselInstance=function(t){const[r,u]=e.useState(null);return s(r,t),[r,u]},exports.useCarouselPeekEffect=function(t){const[s,r]=e.useState(null),u=e.useRef(null),[n,l]=e.useState(!1);return e.useEffect(()=>("reset"===s?(t?.el?.classList.remove("peek-prev"),t?.el?.classList.remove("peek-next"),u.current=setTimeout(()=>{r(null)},+(t?.el?.dataset?.peekspeed??150))):s?n||(t?.slideReset(0),"prev"===s?(t?.slidePrev(0),t?.slideNext(0)):(t?.slideNext(0),t?.slidePrev(0)),t?.el?.classList.add("peeking"),t?.el?.classList.add(`peek-${s}`)):(t?.el?.classList.remove("peeking"),t?.el?.classList.remove("peek-prev"),t?.el?.classList.remove("peek-next")),()=>{u.current&&clearTimeout(u.current)}),[s]),e.useEffect(()=>{t?.on("touchStart",()=>{r("reset"),l(!0)}),t?.on("touchEnd",()=>{r("reset"),l(!1)})},[!!t]),[s,r]};
+"use strict";var e=require("react"),t=require("../../node_modules/swiper/swiper-react.js");function s(t,s){const[r,u]=e.useState(0);return e.useEffect(()=>{t&&(s??["slideChange","afterInit","reachBeginning","reachEnd","fromEdge","autoplayStart","autoplayStop","lock","unlock"]).forEach(e=>{t.on(e,()=>{u(e=>e+1)})})},[t]),e.useLayoutEffect(()=>{u(e=>e+1)},[]),r}exports.useCarousel=function(r){const u=t.useSwiper(),n=s(u,r);return e.useMemo(()=>u?new Proxy(u,{_t:n}):u,[u,n])},exports.useCarouselInstance=function(t){const[r,u]=e.useState(null),n=s(r,t);return[e.useMemo(()=>r?new Proxy(r,{_t:n}):r,[r,n]),u]},exports.useCarouselPeekEffect=function(t){const[s,r]=e.useState(null),u=e.useRef(null),[n,o]=e.useState(!1);return e.useEffect(()=>("reset"===s?(t?.el?.classList.remove("peek-prev"),t?.el?.classList.remove("peek-next"),u.current=setTimeout(()=>{r(null)},+(t?.el?.dataset?.peekspeed??150))):s?n||(t?.slideReset(0),"prev"===s?(t?.slidePrev(0),t?.slideNext(0)):(t?.slideNext(0),t?.slidePrev(0)),t?.el?.classList.add("peeking"),t?.el?.classList.add(`peek-${s}`)):(t?.el?.classList.remove("peeking"),t?.el?.classList.remove("peek-prev"),t?.el?.classList.remove("peek-next")),()=>{u.current&&clearTimeout(u.current)}),[s]),e.useEffect(()=>{t?.on("touchStart",()=>{r("reset"),o(!0)}),t?.on("touchEnd",()=>{r("reset"),o(!1)})},[!!t]),[s,r]};
 //# sourceMappingURL=hooks.js.map

package/cjs/components/carousel/hooks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"hooks.js","sources":["../../../../../src/components/carousel/hooks.ts"],"sourcesContent":["import { useState, useEffect, useLayoutEffect, useRef } from 'react';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { useSwiper } from 'swiper/react';\nimport { SwiperEvents } from 'swiper/types';\n\n/*\n Hook to obtain and manage CarouselInstance\n * /\nexport function useCarouselInstance(events?: (keyof SwiperEvents)[]) {\n const [carousel, setCarousel] = useState<CarouselInstance \| null>(null);\n useRefreshInstance(carousel, events);\n\n ~~return~~ [carousel, setCarousel] as const;\n}\n\n/\n Hook to obtain CarouselInstance inside the Carousel component\n /\nexport function useCarousel(events?: (keyof SwiperEvents)[]) {\n const carousel = useSwiper();\n useRefreshInstance(carousel, events);\n\n return carousel;\n}\n\n/\n Internal hook that forces re-renders on events like slideChange, so the carousel.realIndex is correct\n * https://github.com/nolimits4web/swiper/issues/5577\n /\nfunction useRefreshInstance(carousel: CarouselInstance, events?: (keyof SwiperEvents)[]) {\n // force re-render\n const [, setRerender] = useState({});\n useEffect(() => {\n if (carousel) {\n // subscribe to carousel events to trigger re-render\n (\n events ?? [\n 'slideChange',\n 'afterInit',\n 'reachBeginning',\n 'reachEnd',\n 'autoplayStart',\n 'autoplayStop',\n 'lock',\n 'unlock',\n ]\n ).forEach((evt: keyof SwiperEvents) => {\n carousel.on(evt, () => {\n setRerender({});\n });\n });\n }\n }, [carousel]);\n // once everything is rendered, make sure to re-render to have proper data (initialization)\n useLayoutEffect(() => {\n setRerender({});\n }, []);\n}\n\n/\n Manage peek effect in the Carousel by adding classes to the Carousel instance\n /\nexport function useCarouselPeekEffect(carousel: CarouselInstance) {\n const [peek, setPeek] = useState<'prev' \| 'next' \| 'reset' \| null>(null);\n const peekTimeout = useRef<NodeJS.Timeout \| null>(null);\n const [disabled, setDisabled] = useState<boolean>(false);\n\n useEffect(() => {\n if (peek === 'reset') {\n carousel?.el?.classList.remove('peek-prev');\n carousel?.el?.classList.remove('peek-next');\n peekTimeout.current = setTimeout(\n () => {\n setPeek(null);\n },\n +(carousel?.el?.dataset?.peekspeed ?? 150),\n ); // matches transitionDuration in the Carousel\n } else if (peek) {\n if (!disabled) {\n // make sure prev/next slide is visible (loop)\n carousel?.slideReset(0);\n if (peek === 'prev') {\n carousel?.slidePrev(0);\n carousel?.slideNext(0);\n } else {\n carousel?.slideNext(0);\n carousel?.slidePrev(0);\n }\n carousel?.el?.classList.add('peeking');\n carousel?.el?.classList.add(`peek-${peek}`);\n }\n } else {\n carousel?.el?.classList.remove('peeking');\n carousel?.el?.classList.remove('peek-prev');\n carousel?.el?.classList.remove('peek-next');\n }\n\n return () => {\n if (peekTimeout.current) {\n clearTimeout(peekTimeout.current);\n }\n };\n }, [peek]);\n\n /\n Watch carousel instance\n */\n useEffect(() => {\n // once carousel is being dragged, reset and disable peek effect\n carousel?.on('touchStart', () => {\n setPeek('reset');\n setDisabled(true);\n });\n carousel?.on('touchEnd', () => {\n setPeek('reset');\n setDisabled(false);\n });\n }, [!!carousel]);\n\n return [peek, setPeek] as const;\n}\n"],"names":["useRefreshInstance","carousel","events","setRerender","useState","useEffect","forEach","evt","on","useLayoutEffect","useSwiper","setCarousel","peek","setPeek","peekTimeout","useRef","disabled","setDisabled","el","classList","remove","current","setTimeout","dataset","peekspeed","slideReset","slidePrev","slideNext","add","clearTimeout"],"mappings":"~~2FA6BA~~,SAASA,EAAmBC,EAA4BC,GAEtD,~~OAASC~~,GAAeC,EAAAA,SAAS,~~IACjCC~~,EAAAA,UAAU,~~KACJJ~~,~~IAGAC~~,GAAU,CACR,cACA,YACA,iBACA,WACA,gBACA,eACA,OACA,~~WAEFI~~,QAASC,~~IACTN~~,~~EAASO~~,GAAGD,EAAK,KACfJ,~~EAAY~~,~~CAAA~~,~~QAIjB~~,~~CAACF~~,~~IAEJQ~~,EAAAA,gBAAgB,~~KACdN~~,~~EAAY~~,~~CAAA~~,~~IACX~~,~~GACL~~,~~qBAvCM~~,SAAsBD,GAC1B,MAAMD,~~EAAWS~~,EAAAA,~~YAGjB~~,~~OAFAV~~,EAAmBC,EAAUC,~~GAEtBD~~,~~CACT~~,~~8BAfM~~,~~SAA8BC~~,GAClC,MAAOD,~~EAAUU~~,~~GAAeP~~,EAAAA,SAAkC,~~MAGlE~~,~~OAFAJ~~,EAAmBC,EAAUC,~~GAEtB~~,~~CAACD~~,~~EAAUU~~,~~EACpB~~,~~gCAiDM~~,~~SAAgCV~~,GACpC,~~MAAOW~~,EAAMC,~~GAAWT~~,EAAAA,SAA2C,~~MAC7DU~~,EAAcC,EAAAA,OAA8B,OAC3CC,EAAUC,~~GAAeb~~,EAAAA,UAAkB,GAsDlD,OApDAC,EAAAA,UAAU,KACK,~~UAATO~~,~~GACFX~~,~~GAAUiB~~,IAAIC,UAAUC,OAAO,aAC/~~BnB~~,~~GAAUiB~~,IAAIC,UAAUC,OAAO,aAC/BN,EAAYO,QAAUC,WACpB,KACET,EAAQ,~~SAERZ~~,~~GAAUiB~~,IAAIK,SAASC,WAAa,OAE/BZ,EACJI,~~IAEHf~~,~~GAAUwB~~,WAAW,GACR,SAATb,~~GACFX~~,~~GAAUyB~~,UAAU,~~GACpBzB~~,~~GAAU0B~~,UAAU,~~KAEpB1B~~,~~GAAU0B~~,UAAU,~~GACpB1B~~,~~GAAUyB~~,UAAU,~~IAEtBzB~~,~~GAAUiB~~,IAAIC,UAAUS,IAAI,~~WAC5B3B~~,~~GAAUiB~~,IAAIC,UAAUS,IAAI,QAAQhB,~~OAGtCX~~,~~GAAUiB~~,IAAIC,UAAUC,OAAO,WAC/~~BnB~~,~~GAAUiB~~,IAAIC,UAAUC,OAAO,aAC/~~BnB~~,~~GAAUiB~~,IAAIC,UAAUC,OAAO,cAG1B,KACDN,EAAYO,SACdQ,aAAaf,EAAYO,WAG5B,CAACT,~~IAKJP~~,EAAAA,UAAU,~~KAERJ~~,~~GAAUO~~,GAAG,aAAc,~~KACzBK~~,EAAQ,SACRI,GAAY,~~KAEdhB~~,~~GAAUO~~,GAAG,WAAY,~~KACvBK~~,EAAQ,SACRI,GAAY,MAEb,~~GAAGhB~~,IAEC,~~CAACW~~,EAAMC,EAChB"}
1	+ {"version":3,"file":"hooks.js","sources":["../../../../../src/components/carousel/hooks.ts"],"sourcesContent":["import { useState, useEffect, useLayoutEffect, useMemo, useRef } from 'react';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { useSwiper } from 'swiper/react';\nimport { SwiperEvents } from 'swiper/types';\n\n/*\n Hook to obtain and manage CarouselInstance\n * /\nexport function useCarouselInstance(events?: (keyof SwiperEvents)[]) {\n const [carousel, setCarousel] = useState<CarouselInstance \| null>(null);\n const renderCount = useRefreshInstance(carousel, events);\n\n const proxiedCarousel = useMemo(\n () => (carousel ? new Proxy(carousel, { _t: renderCount } as unknown as ProxyHandler<CarouselInstance>) : carousel),\n [carousel, renderCount],\n );\n\n return [proxiedCarousel, setCarousel] as const;\n}\n\n/\n Hook to obtain CarouselInstance inside the Carousel component\n /\nexport function useCarousel(events?: (keyof SwiperEvents)[]) {\n const carousel = useSwiper();\n const renderCount = useRefreshInstance(carousel, events);\n\n return useMemo(\n () =>\n carousel\n ? (new Proxy(carousel, { _t: renderCount } as unknown as ProxyHandler<CarouselInstance>) as CarouselInstance)\n : carousel,\n [carousel, renderCount],\n );\n}\n\n/\n Internal hook that forces re-renders on events like slideChange, so the carousel.realIndex is correct\n * https://github.com/nolimits4web/swiper/issues/5577\n /\nfunction useRefreshInstance(carousel: CarouselInstance, events?: (keyof SwiperEvents)[]): number {\n // force re-render\n const [renderCount, setRerender] = useState(0);\n useEffect(() => {\n if (carousel) {\n // subscribe to carousel events to trigger re-render\n // https://swiperjs.com/swiper-api#events\n (\n events ?? [\n 'slideChange',\n 'afterInit',\n 'reachBeginning',\n 'reachEnd',\n 'fromEdge',\n 'autoplayStart',\n 'autoplayStop',\n 'lock',\n 'unlock',\n ]\n ).forEach((evt: keyof SwiperEvents) => {\n carousel.on(evt, () => {\n setRerender((t) => t + 1);\n });\n });\n }\n }, [carousel]);\n // once everything is rendered, make sure to re-render to have proper data (initialization)\n useLayoutEffect(() => {\n setRerender((t) => t + 1);\n }, []);\n\n return renderCount;\n}\n\n/\n Manage peek effect in the Carousel by adding classes to the Carousel instance\n /\nexport function useCarouselPeekEffect(carousel: CarouselInstance) {\n const [peek, setPeek] = useState<'prev' \| 'next' \| 'reset' \| null>(null);\n const peekTimeout = useRef<NodeJS.Timeout \| null>(null);\n const [disabled, setDisabled] = useState<boolean>(false);\n\n useEffect(() => {\n if (peek === 'reset') {\n carousel?.el?.classList.remove('peek-prev');\n carousel?.el?.classList.remove('peek-next');\n peekTimeout.current = setTimeout(\n () => {\n setPeek(null);\n },\n +(carousel?.el?.dataset?.peekspeed ?? 150),\n ); // matches transitionDuration in the Carousel\n } else if (peek) {\n if (!disabled) {\n // make sure prev/next slide is visible (loop)\n carousel?.slideReset(0);\n if (peek === 'prev') {\n carousel?.slidePrev(0);\n carousel?.slideNext(0);\n } else {\n carousel?.slideNext(0);\n carousel?.slidePrev(0);\n }\n carousel?.el?.classList.add('peeking');\n carousel?.el?.classList.add(`peek-${peek}`);\n }\n } else {\n carousel?.el?.classList.remove('peeking');\n carousel?.el?.classList.remove('peek-prev');\n carousel?.el?.classList.remove('peek-next');\n }\n\n return () => {\n if (peekTimeout.current) {\n clearTimeout(peekTimeout.current);\n }\n };\n }, [peek]);\n\n /\n Watch carousel instance\n */\n useEffect(() => {\n // once carousel is being dragged, reset and disable peek effect\n carousel?.on('touchStart', () => {\n setPeek('reset');\n setDisabled(true);\n });\n carousel?.on('touchEnd', () => {\n setPeek('reset');\n setDisabled(false);\n });\n }, [!!carousel]);\n\n return [peek, setPeek] as const;\n}\n"],"names":["useRefreshInstance","carousel","events","renderCount","setRerender","useState","useEffect","forEach","evt","on","t","useLayoutEffect","useSwiper","useMemo","Proxy","_t","setCarousel","peek","setPeek","peekTimeout","useRef","disabled","setDisabled","el","classList","remove","current","setTimeout","dataset","peekspeed","slideReset","slidePrev","slideNext","add","clearTimeout"],"mappings":"2FAwCA,SAASA,EAAmBC,EAA4BC,GAEtD,MAAOC,EAAaC,GAAeC,EAAAA,SAAS,GA6B5C,OA5BAC,EAAAA,UAAU,KACJL,IAIAC,GAAU,CACR,cACA,YACA,iBACA,WACA,WACA,gBACA,eACA,OACA,WAEFK,QAASC,IACTP,EAASQ,GAAGD,EAAK,KACfJ,EAAaM,GAAMA,EAAI,QAI5B,CAACT,IAEJU,EAAAA,gBAAgB,KACdP,EAAaM,GAAMA,EAAI,IACtB,IAEIP,CACT,qBAjDM,SAAsBD,GAC1B,MAAMD,EAAWW,EAAAA,YACXT,EAAcH,EAAmBC,EAAUC,GAEjD,OAAOW,EAAAA,QACL,IACEZ,EACK,IAAIa,MAAMb,EAAU,CAAEc,GAAIZ,IAC3BF,EACN,CAACA,EAAUE,GAEf,8BA1BM,SAA8BD,GAClC,MAAOD,EAAUe,GAAeX,EAAAA,SAAkC,MAC5DF,EAAcH,EAAmBC,EAAUC,GAOjD,MAAO,CALiBW,EAAAA,QACtB,IAAOZ,EAAW,IAAIa,MAAMb,EAAU,CAAEc,GAAIZ,IAA8DF,EAC1G,CAACA,EAAUE,IAGYa,EAC3B,gCA2DM,SAAgCf,GACpC,MAAOgB,EAAMC,GAAWb,EAAAA,SAA2C,MAC7Dc,EAAcC,EAAAA,OAA8B,OAC3CC,EAAUC,GAAejB,EAAAA,UAAkB,GAsDlD,OApDAC,EAAAA,UAAU,KACK,UAATW,GACFhB,GAAUsB,IAAIC,UAAUC,OAAO,aAC/BxB,GAAUsB,IAAIC,UAAUC,OAAO,aAC/BN,EAAYO,QAAUC,WACpB,KACET,EAAQ,SAERjB,GAAUsB,IAAIK,SAASC,WAAa,OAE/BZ,EACJI,IAEHpB,GAAU6B,WAAW,GACR,SAATb,GACFhB,GAAU8B,UAAU,GACpB9B,GAAU+B,UAAU,KAEpB/B,GAAU+B,UAAU,GACpB/B,GAAU8B,UAAU,IAEtB9B,GAAUsB,IAAIC,UAAUS,IAAI,WAC5BhC,GAAUsB,IAAIC,UAAUS,IAAI,QAAQhB,OAGtChB,GAAUsB,IAAIC,UAAUC,OAAO,WAC/BxB,GAAUsB,IAAIC,UAAUC,OAAO,aAC/BxB,GAAUsB,IAAIC,UAAUC,OAAO,cAG1B,KACDN,EAAYO,SACdQ,aAAaf,EAAYO,WAG5B,CAACT,IAKJX,EAAAA,UAAU,KAERL,GAAUQ,GAAG,aAAc,KACzBS,EAAQ,SACRI,GAAY,KAEdrB,GAAUQ,GAAG,WAAY,KACvBS,EAAQ,SACRI,GAAY,MAEb,GAAGrB,IAEC,CAACgB,EAAMC,EAChB"}

package/cjs/components/code/Code.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import React from 'react';
+import { BoxProps } from '@mui/material';
+export interface CodeProps extends BoxProps<'code'> {
+}
+/**
+ * Inline or block code rendered as a styled `<code>` element
+ */
+export declare const Code: React.FC<CodeProps>;

package/cjs/components/code/Code.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material");const o=r.forwardRef((r,o)=>e.jsx(t.Box,{ref:o,component:"code",...r}));exports.Code=o;
2	+ //# sourceMappingURL=Code.js.map

package/cjs/components/code/Code.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Code.js","sources":["../../../../../src/components/code/Code.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\n\nexport interface CodeProps extends BoxProps<'code'> {}\n\n/**\n * Inline or block code rendered as a styled `<code>` element\n */\nexport const Code: React.FC<CodeProps> = forwardRef((props, ref) => <Box ref={ref} component=\"code\" {...props} />);\n"],"names":["Code","forwardRef","props","ref","_jsx","Box","component"],"mappings":"8FAQO,MAAMA,EAA4BC,EAAAA,WAAW,CAACC,EAAOC,IAAQC,EAAAA,IAACC,EAAAA,IAAG,CAACF,IAAKA,EAAKG,UAAU,UAAWJ"}

package/cjs/components/code/index.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export * from './Code';

package/cjs/components/errorContent/ErrorContent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material"),r=require("react"),s=require("../../utils/sxOverride/sxOverride.js");const i=r.forwardRef(({sx:r,children:i,status:o,message:n,actions:a,description:c,stacktrace:d,statusProps:x,messageProps:p,descriptionProps:l,actionsProps:m,stacktraceProps:h,...u},g)=>{const{sx:f,...y}=m??{},{sx:j,...v}=h??{};return e.jsxs(t.Box,{sx:s.sxOverride({display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:{xs:2,md:4},textAlign:"center",margin:"0 auto",width:"600px",maxWidth:"100%",p:2},r),ref:g,...u,children:[o&&e.jsx(t.Typography,{component:"h1",variant:"display","data-testid":"ErrorContent.status",...x,children:o}),n&&e.jsx(t.Typography,{component:"h2",variant:"h3","data-testid":"ErrorContent.message",...p,children:n}),c&&e.jsx(t.Typography,{"data-testid":"ErrorContent.description",...l,children:c}),i,a&&e.jsx(t.Box,{sx:s.sxOverride({display:"flex",gap:1,flexDirection:{xs:"column",md:"row"},alignItems:{xs:"stretch",md:"center"},justifyContent:"center"},f),"data-testid":"ErrorContent.actions",...y,children:a}),d&&e.jsx(t.Box,{component:"code",sx:s.sxOverride({display:"block",border:1,borderColor:"divider",whiteSpace:"pre",overflow:"auto",py:1,px:2,borderRadius:"8px",fontFamily:"monospace",fontSize:"11px",lineHeight:"18px",textAlign:"left",alignSelf:"stretch"},j),"data-testid":"ErrorContent.stacktrace",...v,children:d})]})});exports.ErrorContent=i;
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("react"),s=require("../../utils/sxOverride/sxOverride.js");const i=t.forwardRef(({sx:t,children:i,status:o,message:n,actions:a,description:d,stacktrace:c,statusProps:x,messageProps:l,descriptionProps:p,actionsProps:u,stacktraceProps:m,...h},g)=>{const{sx:y,...f}=u??{},{sx:j,...v}=m??{};return e.jsxs(r.Box,{sx:s.sxOverride({display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:{xs:2,md:4},textAlign:"center",margin:"0 auto",width:"600px",maxWidth:"100%",p:2},t),ref:g,...h,children:[o&&e.jsx(r.Typography,{component:"h1",variant:"display","data-testid":"ErrorContent.status",...x,children:o}),n&&e.jsx(r.Typography,{component:"h2",variant:"h3","data-testid":"ErrorContent.message",...l,children:n}),d&&e.jsx(r.Typography,{"data-testid":"ErrorContent.description",...p,children:d}),i,a&&e.jsx(r.Box,{sx:s.sxOverride({display:"flex",gap:1,flexDirection:{xs:"column",md:"row"},alignItems:{xs:"stretch",md:"center"},justifyContent:"center"},y),"data-testid":"ErrorContent.actions",...f,children:a}),c&&e.jsx(r.Box,{component:"code",sx:s.sxOverride({display:"block",border:1,borderColor:"divider",overflow:"auto",py:1,px:2,borderRadius:"8px",textAlign:"left",alignSelf:"stretch"},j),"data-testid":"ErrorContent.stacktrace",...v,children:c})]})});exports.ErrorContent=i;
 //# sourceMappingURL=ErrorContent.js.map