@pautena/react-design-system 0.14.8 → 0.15.0

package/value-rating/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/value-base/value-edit.tsx","../../src/value-content/value-content.tsx","../../src/value-rating/value-rating.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport CheckIcon from \"@mui/icons-material/Check\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\nimport { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport EditIcon from \"@mui/icons-material/Edit\";\n\nexport interface ValueEditButtonsProps {\n  onClickCancel: () => void;\n  onClickSubmit: () => void;\n  sx?: SxProps<Theme>;\n}\n\nexport const ValueEditButtons = ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => {\n  return (\n    <InputAdornment position=\"end\" sx={sx}>\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"error\"\n        aria-label=\"cancel button\"\n        startIcon={<ClearIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickCancel}\n        sx={{ paddingRight: 0, minWidth: 0, marginRight: 1 }}\n      />\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"primary\"\n        aria-label=\"submit button\"\n        startIcon={<CheckIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickSubmit}\n        sx={{ paddingRight: 0, minWidth: 0 }}\n      />\n    </InputAdornment>\n  );\n};\n\n/**\n * Hook to manage the editing behaviour\n */\nexport const useEditableValueDisplay = <T,>(\n  initialValue: T | undefined,\n  onEdit: (value?: T) => void,\n) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [editValue, setEditValue] = useState<T | undefined>(initialValue);\n\n  const cancelEdit = () => {\n    setIsEditing(false);\n    setEditValue(initialValue);\n  };\n  const startEdit = () => {\n    setIsEditing(true);\n  };\n\n  const submitEdit = () => {\n    onEdit(editValue);\n    cancelEdit();\n  };\n\n  return { isEditing, cancelEdit, editValue, setEditValue, startEdit, submitEdit };\n};\n\nexport interface ValueEditButtonProps {\n  dense?: boolean;\n  onClick: () => void;\n}\n\nexport const ValueEditButton = ({ dense, onClick }: ValueEditButtonProps) => {\n  const { typography } = useTheme();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onClick}\n      sx={{ ml: dense ? 0.5 : 1 }}\n      aria-label=\"edit button\"\n    >\n      <EditIcon sx={{ fontSize: typography.pxToRem(dense ? 18 : 24) }} />\n    </IconButton>\n  );\n};\n","import { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Box from \"@mui/material/Box\";\nimport Tooltip from \"@mui/material/Tooltip\";\nimport Typography from \"@mui/material/Typography\";\n\nexport const getValueContentLabelId = (label: string): string =>\n  `label-${label.replace(/ /g, \"-\")}`;\n\nexport interface ValueContentProps {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * If true, the label will not be shown\n   */\n  hideLabel?: boolean;\n\n  /**\n   * If defined, a tooltip is going to be added arround the children;\n   */\n  tooltip?: string;\n\n  /**\n   * Timeout before the tooltip appears when the user hovers the value\n   */\n  tooltipEnterDelay?: number;\n\n  /**\n   * Component that's going to be renderd under the label\n   */\n  children: React.ReactElement<any, any>;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n\n  /**\n   * Custom styles for the root component\n   */\n  sx?: SxProps<Theme>;\n}\n\n/**\n * Displays a string value with a label\n */\nexport const ValueContent = ({\n  label,\n  hideLabel,\n  tooltip,\n  tooltipEnterDelay = 2000,\n  children,\n  dense,\n  sx,\n}: ValueContentProps) => {\n  const { typography } = useTheme();\n  const id = getValueContentLabelId(label);\n\n  return (\n    <Box width={1} lineHeight={dense ? 0 : undefined} sx={sx}>\n      {!hideLabel && (\n        <Typography\n          variant={dense ? \"caption\" : \"subtitle2\"}\n          role=\"label\"\n          id={id}\n          lineHeight={dense ? typography.pxToRem(15) : undefined}\n        >\n          {label}\n        </Typography>\n      )}\n      {tooltip ? (\n        <Tooltip title={tooltip} placement=\"top\" enterDelay={tooltipEnterDelay}>\n          {children}\n        </Tooltip>\n      ) : (\n        children\n      )}\n    </Box>\n  );\n};\n","import Box from \"@mui/material/Box\";\nimport Rating from \"@mui/material/Rating\";\nimport { useEditableValueDisplay, ValueEditButton, ValueEditButtons } from \"../value-base\";\nimport { BaseValueProps, EditableValueProps } from \"../value-base\";\nimport { getValueContentLabelId, ValueContent } from \"../value-content\";\n\nexport type ValueRatingProps = BaseValueProps<number> & {\n  maxRating?: number;\n} & EditableValueProps<number>;\n\n/**\n * Displays a number using stars\n */\nexport const ValueRating = ({\n  label,\n  value = 0,\n  maxRating = 5,\n  editable,\n  dense,\n  onEdit = () => null,\n}: ValueRatingProps) => {\n  const { isEditing, editValue, startEdit, cancelEdit, setEditValue, submitEdit } =\n    useEditableValueDisplay(value, onEdit);\n  const id = getValueContentLabelId(label);\n\n  return (\n    <ValueContent label={label} tooltip={value.toString()} dense={dense}>\n      <Box display=\"flex\" alignItems=\"center\" aria-labelledby={id}>\n        <Rating\n          readOnly={!isEditing}\n          max={maxRating}\n          size={dense ? \"small\" : \"medium\"}\n          value={isEditing ? editValue : value}\n          onChange={(e, newValue) => {\n            if (Number.isNaN(newValue) && (e.currentTarget as any).value) {\n              setEditValue(parseInt((e.currentTarget as any).value, 10));\n            } else if (newValue) {\n              setEditValue(newValue);\n            }\n          }}\n        />\n        {editable && !isEditing && <ValueEditButton dense={dense} onClick={startEdit} />}\n        {isEditing && <ValueEditButtons onClickCancel={cancelEdit} onClickSubmit={submitEdit} />}\n      </Box>\n    </ValueContent>\n  );\n};\n"],"names":["ValueEditButtons","onClickCancel","onClickSubmit","sx","_jsxs","InputAdornment","position","children","_jsx","Button","variant","size","color","startIcon","ClearIcon","fontSize","onClick","paddingRight","minWidth","marginRight","CheckIcon","ValueEditButton","dense","typography","useTheme","IconButton","ml","EditIcon","pxToRem","getValueContentLabelId","label","replace","ValueContent","hideLabel","tooltip","tooltipEnterDelay","id","Box","width","lineHeight","undefined","Typography","role","Tooltip","title","placement","enterDelay","ValueRating","value","maxRating","editable","onEdit","isEditing","editValue","startEdit","cancelEdit","setEditValue","submitEdit","initialValue","setIsEditing","useState","useEditableValueDisplay","toString","display","alignItems","Rating","readOnly","max","onChange","e","newValue","Number","isNaN","currentTarget","parseInt"],"mappings":"ugBAeO,MAAMA,EAAmB,EAAGC,gBAAeC,gBAAeC,QAE7DC,EAACC,EAAe,CAAAC,SAAS,MAAMH,GAAIA,EAAEI,SAAA,CACnCC,EAACC,EAAM,CACLC,QAAQ,YACRC,KAAK,QACLC,MAAM,QAAO,aACF,gBACXC,UAAWL,EAACM,EAAS,CAACX,GAAI,CAAEY,SAAU,MACtCC,QAASf,EACTE,GAAI,CAAEc,aAAc,EAAGC,SAAU,EAAGC,YAAa,KAEnDX,EAACC,EACC,CAAAC,QAAQ,YACRC,KAAK,QACLC,MAAM,UAAS,aACJ,gBACXC,UAAWL,EAACY,GAAUjB,GAAI,CAAEY,SAAU,MACtCC,QAASd,EACTC,GAAI,CAAEc,aAAc,EAAGC,SAAU,QAqC5BG,EAAkB,EAAGC,QAAON,cACvC,MAAMO,WAAEA,GAAeC,IACvB,OACEhB,EAACiB,EACC,CAAAd,KAAK,QACLK,QAASA,EACTb,GAAI,CAAEuB,GAAIJ,EAAQ,GAAM,GAAG,aAChB,cAEXf,SAAAC,EAACmB,EAAQ,CAACxB,GAAI,CAAEY,SAAUQ,EAAWK,QAAQN,EAAQ,GAAK,QAE5D,EC7ESO,EAA0BC,GACrC,SAASA,EAAMC,QAAQ,KAAM,OA2ClBC,EAAe,EAC1BF,QACAG,YACAC,UACAC,oBAAoB,IACpB5B,WACAe,QACAnB,SAEA,MAAMoB,WAAEA,GAAeC,IACjBY,EAAKP,EAAuBC,GAElC,OACE1B,EAACiC,EAAG,CAACC,MAAO,EAAGC,WAAYjB,EAAQ,OAAIkB,EAAWrC,GAAIA,EAAEI,SAAA,EACpD0B,GACAzB,EAACiC,GACC/B,QAASY,EAAQ,UAAY,YAC7BoB,KAAK,QACLN,GAAIA,EACJG,WAAYjB,EAAQC,EAAWK,QAAQ,SAAMY,EAE5CjC,SAAAuB,IAGJI,EACC1B,EAACmC,EAAQ,CAAAC,MAAOV,EAASW,UAAU,MAAMC,WAAYX,WAClD5B,IACO,IAKd,ECpESwC,EAAc,EACzBjB,QACAkB,QAAQ,EACRC,YAAY,EACZC,WACA5B,QACA6B,SAAS,KAAM,UAEf,MAAMC,UAAEA,EAASC,UAAEA,EAASC,UAAEA,EAASC,WAAEA,EAAUC,aAAEA,EAAYC,WAAEA,GFsB9B,EACrCC,EACAP,KAEA,MAAOC,EAAWO,GAAgBC,GAAS,IACpCP,EAAWG,GAAgBI,EAAwBF,GAEpDH,EAAa,KACjBI,GAAa,GACbH,EAAaE,EAAa,EAW5B,MAAO,CAAEN,YAAWG,aAAYF,YAAWG,eAAcF,UATvC,KAChBK,GAAa,EAAK,EAQgDF,WALjD,KACjBN,EAAOE,GACPE,GAAY,EAGkE,EEzC9EM,CAAwBb,EAAOG,GAC3Bf,EAAKP,EAAuBC,GAElC,OACEtB,EAACwB,EAAY,CAACF,MAAOA,EAAOI,QAASc,EAAMc,WAAYxC,MAAOA,EAAKf,SACjEH,EAACiC,EAAG,CAAC0B,QAAQ,OAAOC,WAAW,2BAA0B5B,EAAE7B,SAAA,CACzDC,EAACyD,GACCC,UAAWd,EACXe,IAAKlB,EACLtC,KAAMW,EAAQ,QAAU,SACxB0B,MAAOI,EAAYC,EAAYL,EAC/BoB,SAAU,CAACC,EAAGC,KACRC,OAAOC,MAAMF,IAAcD,EAAEI,cAAsBzB,MACrDQ,EAAakB,SAAUL,EAAEI,cAAsBzB,MAAO,KAC7CsB,GACTd,EAAac,EACd,IAGJpB,IAAaE,GAAa5C,EAACa,GAAgBC,MAAOA,EAAON,QAASsC,IAClEF,GAAa5C,EAACR,EAAgB,CAACC,cAAesD,EAAYrD,cAAeuD,QAG9E"}
+{"version":3,"file":"index.js","sources":["../../src/value-base/value-edit.tsx","../../src/value-content/value-content.tsx","../../src/value-rating/value-rating.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport CheckIcon from \"@mui/icons-material/Check\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\nimport { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport EditIcon from \"@mui/icons-material/Edit\";\n\nexport interface ValueEditButtonsProps {\n  onClickCancel: () => void;\n  onClickSubmit: () => void;\n  sx?: SxProps<Theme>;\n}\n\nexport const ValueEditButtons = ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => {\n  return (\n    <InputAdornment position=\"end\" sx={sx}>\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"error\"\n        aria-label=\"cancel button\"\n        startIcon={<ClearIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickCancel}\n        sx={{ paddingRight: 0, minWidth: 0, marginRight: 1 }}\n      />\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"primary\"\n        aria-label=\"submit button\"\n        startIcon={<CheckIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickSubmit}\n        sx={{ paddingRight: 0, minWidth: 0 }}\n      />\n    </InputAdornment>\n  );\n};\n\n/**\n * Hook to manage the editing behaviour\n */\nexport const useEditableValueDisplay = <T,>(\n  initialValue: T | undefined,\n  onEdit: (value?: T) => void,\n) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [editValue, setEditValue] = useState<T | undefined>(initialValue);\n\n  const cancelEdit = () => {\n    setIsEditing(false);\n    setEditValue(initialValue);\n  };\n  const startEdit = () => {\n    setIsEditing(true);\n  };\n\n  const submitEdit = () => {\n    onEdit(editValue);\n    cancelEdit();\n  };\n\n  return { isEditing, cancelEdit, editValue, setEditValue, startEdit, submitEdit };\n};\n\nexport interface ValueEditButtonProps {\n  dense?: boolean;\n  onClick: () => void;\n}\n\nexport const ValueEditButton = ({ dense, onClick }: ValueEditButtonProps) => {\n  const { typography } = useTheme();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onClick}\n      sx={{ ml: dense ? 0.5 : 1 }}\n      aria-label=\"edit button\"\n    >\n      <EditIcon sx={{ fontSize: typography.pxToRem(dense ? 18 : 24) }} />\n    </IconButton>\n  );\n};\n","import { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Box from \"@mui/material/Box\";\nimport Tooltip from \"@mui/material/Tooltip\";\nimport Typography from \"@mui/material/Typography\";\n\nexport const getValueContentLabelId = (label: string): string =>\n  `label-${label.replace(/ /g, \"-\")}`;\n\nexport interface ValueContentProps {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * If true, the label will not be shown\n   */\n  hideLabel?: boolean;\n\n  /**\n   * If defined, a tooltip is going to be added arround the children;\n   */\n  tooltip?: string;\n\n  /**\n   * Timeout before the tooltip appears when the user hovers the value\n   */\n  tooltipEnterDelay?: number;\n\n  /**\n   * Component that's going to be renderd under the label\n   */\n  children: React.ReactElement<any, any>;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n\n  /**\n   * Custom styles for the root component\n   */\n  sx?: SxProps<Theme>;\n}\n\n/**\n * Displays a string value with a label\n */\nexport const ValueContent = ({\n  label,\n  hideLabel,\n  tooltip,\n  tooltipEnterDelay = 2000,\n  children,\n  dense,\n  sx,\n}: ValueContentProps) => {\n  const { typography } = useTheme();\n  const id = getValueContentLabelId(label);\n\n  return (\n    <Box width={1} lineHeight={dense ? 0 : undefined} sx={sx}>\n      {!hideLabel && (\n        <Typography\n          variant={dense ? \"caption\" : \"subtitle2\"}\n          role=\"label\"\n          id={id}\n          lineHeight={dense ? typography.pxToRem(15) : undefined}\n        >\n          {label}\n        </Typography>\n      )}\n      {tooltip ? (\n        <Tooltip title={tooltip} placement=\"top\" enterDelay={tooltipEnterDelay}>\n          {children}\n        </Tooltip>\n      ) : (\n        children\n      )}\n    </Box>\n  );\n};\n","import Box from \"@mui/material/Box\";\nimport Rating from \"@mui/material/Rating\";\nimport { useEditableValueDisplay, ValueEditButton, ValueEditButtons } from \"../value-base\";\nimport { BaseValueProps, EditableValueProps } from \"../value-base\";\nimport { getValueContentLabelId, ValueContent } from \"../value-content\";\n\nexport type ValueRatingProps = BaseValueProps<number> & {\n  maxRating?: number;\n} & EditableValueProps<number>;\n\n/**\n * Displays a number using stars\n */\nexport const ValueRating = ({\n  label,\n  value = 0,\n  maxRating = 5,\n  editable,\n  dense,\n  onEdit = () => null,\n}: ValueRatingProps) => {\n  const { isEditing, editValue, startEdit, cancelEdit, setEditValue, submitEdit } =\n    useEditableValueDisplay(value, onEdit);\n  const id = getValueContentLabelId(label);\n\n  return (\n    <ValueContent label={label} tooltip={value.toString()} dense={dense}>\n      <Box display=\"flex\" alignItems=\"center\" aria-labelledby={id}>\n        <Rating\n          readOnly={!isEditing}\n          max={maxRating}\n          size={dense ? \"small\" : \"medium\"}\n          value={isEditing ? editValue : value}\n          onChange={(e, newValue) => {\n            if (Number.isNaN(newValue) && (e.currentTarget as any).value) {\n              setEditValue(parseInt((e.currentTarget as any).value, 10));\n            } else if (newValue) {\n              setEditValue(newValue);\n            }\n          }}\n        />\n        {editable && !isEditing && <ValueEditButton dense={dense} onClick={startEdit} />}\n        {isEditing && <ValueEditButtons onClickCancel={cancelEdit} onClickSubmit={submitEdit} />}\n      </Box>\n    </ValueContent>\n  );\n};\n"],"names":["ValueEditButtons","onClickCancel","onClickSubmit","sx","_jsxs","InputAdornment","position","children","_jsx","Button","variant","size","color","startIcon","ClearIcon","fontSize","onClick","paddingRight","minWidth","marginRight","CheckIcon","ValueEditButton","dense","typography","useTheme","IconButton","ml","EditIcon","pxToRem","getValueContentLabelId","label","replace","ValueContent","hideLabel","tooltip","tooltipEnterDelay","id","Box","width","lineHeight","undefined","Typography","role","Tooltip","title","placement","enterDelay","ValueRating","value","maxRating","editable","onEdit","isEditing","editValue","startEdit","cancelEdit","setEditValue","submitEdit","initialValue","setIsEditing","useState","useEditableValueDisplay","toString","display","alignItems","Rating","readOnly","max","onChange","e","newValue","Number","isNaN","currentTarget","parseInt"],"mappings":"ugBAeO,MAAMA,EAAmB,EAAGC,gBAAeC,gBAAeC,QAE7DC,EAACC,EAAe,CAAAC,SAAS,MAAMH,GAAIA,EAAEI,SAAA,CACnCC,EAACC,EAAM,CACLC,QAAQ,YACRC,KAAK,QACLC,MAAM,QAAO,aACF,gBACXC,UAAWL,EAACM,EAAS,CAACX,GAAI,CAAEY,SAAU,MACtCC,QAASf,EACTE,GAAI,CAAEc,aAAc,EAAGC,SAAU,EAAGC,YAAa,KAEnDX,EAACC,EACC,CAAAC,QAAQ,YACRC,KAAK,QACLC,MAAM,UAAS,aACJ,gBACXC,UAAWL,EAACY,GAAUjB,GAAI,CAAEY,SAAU,MACtCC,QAASd,EACTC,GAAI,CAAEc,aAAc,EAAGC,SAAU,QAqC5BG,EAAkB,EAAGC,QAAON,cACvC,MAAMO,WAAEA,GAAeC,IACvB,OACEhB,EAACiB,EACC,CAAAd,KAAK,QACLK,QAASA,EACTb,GAAI,CAAEuB,GAAIJ,EAAQ,GAAM,GAAG,aAChB,cAEXf,SAAAC,EAACmB,EAAQ,CAACxB,GAAI,CAAEY,SAAUQ,EAAWK,QAAQN,EAAQ,GAAK,QAC/C,EC5EJO,EAA0BC,GACrC,SAASA,EAAMC,QAAQ,KAAM,OA2ClBC,EAAe,EAC1BF,QACAG,YACAC,UACAC,oBAAoB,IACpB5B,WACAe,QACAnB,SAEA,MAAMoB,WAAEA,GAAeC,IACjBY,EAAKP,EAAuBC,GAElC,OACE1B,EAACiC,EAAG,CAACC,MAAO,EAAGC,WAAYjB,EAAQ,OAAIkB,EAAWrC,GAAIA,EAAEI,SAAA,EACpD0B,GACAzB,EAACiC,GACC/B,QAASY,EAAQ,UAAY,YAC7BoB,KAAK,QACLN,GAAIA,EACJG,WAAYjB,EAAQC,EAAWK,QAAQ,SAAMY,EAE5CjC,SAAAuB,IAGJI,EACC1B,EAACmC,EAAQ,CAAAC,MAAOV,EAASW,UAAU,MAAMC,WAAYX,WAClD5B,QAKD,ECnEGwC,EAAc,EACzBjB,QACAkB,QAAQ,EACRC,YAAY,EACZC,WACA5B,QACA6B,SAAS,KAAM,UAEf,MAAMC,UAAEA,EAASC,UAAEA,EAASC,UAAEA,EAASC,WAAEA,EAAUC,aAAEA,EAAYC,WAAEA,GFsB9B,EACrCC,EACAP,KAEA,MAAOC,EAAWO,GAAgBC,GAAS,IACpCP,EAAWG,GAAgBI,EAAwBF,GAEpDH,EAAa,KACjBI,GAAa,GACbH,EAAaE,EAAa,EAW5B,MAAO,CAAEN,YAAWG,aAAYF,YAAWG,eAAcF,UATvC,KAChBK,GAAa,EAAK,EAQgDF,WALjD,KACjBN,EAAOE,GACPE,GAAY,EAGkE,EEzC9EM,CAAwBb,EAAOG,GAC3Bf,EAAKP,EAAuBC,GAElC,OACEtB,EAACwB,EAAY,CAACF,MAAOA,EAAOI,QAASc,EAAMc,WAAYxC,MAAOA,EAAKf,SACjEH,EAACiC,EAAG,CAAC0B,QAAQ,OAAOC,WAAW,2BAA0B5B,EAAE7B,SAAA,CACzDC,EAACyD,GACCC,UAAWd,EACXe,IAAKlB,EACLtC,KAAMW,EAAQ,QAAU,SACxB0B,MAAOI,EAAYC,EAAYL,EAC/BoB,SAAU,CAACC,EAAGC,KACRC,OAAOC,MAAMF,IAAcD,EAAEI,cAAsBzB,MACrDQ,EAAakB,SAAUL,EAAEI,cAAsBzB,MAAO,KAC7CsB,GACTd,EAAac,MAIlBpB,IAAaE,GAAa5C,EAACa,GAAgBC,MAAOA,EAAON,QAASsC,IAClEF,GAAa5C,EAACR,EAAgB,CAACC,cAAesD,EAAYrD,cAAeuD,QAE/D"}

package/value-rating/package.json

@@ -5,8 +5,8 @@
   "module": "./index.js",
   "types": "./index.d.ts",
   "dependencies": {
-    "@mui/icons-material": "^5.11.16",
-    "@mui/material": "^5.13.6",
-    "react": "^18.2.0"
+    "@mui/icons-material": "^6.4.5",
+    "@mui/material": "^6.4.5",
+    "react": "^19.0.0"
   }
 }

package/value-rating/value-rating.d.ts

@@ -5,4 +5,4 @@ export type ValueRatingProps = BaseValueProps<number> & {
 /**
  * Displays a number using stars
  */
-export declare const ValueRating: ({ label, value, maxRating, editable, dense, onEdit, }: ValueRatingProps) => JSX.Element;
+export declare const ValueRating: ({ label, value, maxRating, editable, dense, onEdit, }: ValueRatingProps) => import("react/jsx-runtime").JSX.Element;

package/value-text/cjs/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/Typography"),i=require("@mui/material/TextField"),l=require("@mui/material/Box"),a=require("react"),r=require("@mui/icons-material/Check"),n=require("@mui/icons-material/Clear"),s=require("@mui/material/styles"),u=require("@mui/material/Button"),o=require("@mui/material/IconButton"),d=require("@mui/material/InputAdornment"),c=require("@mui/icons-material/Edit"),m=require("@mui/material/Tooltip");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=x(t),h=x(i),b=x(l),f=x(r),g=x(n),j=x(u),y=x(o),E=x(d),v=x(c),C=x(m);const k=({onClickCancel:t,onClickSubmit:i,sx:l})=>e.jsxs(E.default,{position:"end",sx:l,children:[e.jsx(j.default,{variant:"contained",size:"small",color:"error","aria-label":"cancel button",startIcon:e.jsx(g.default,{sx:{fontSize:12}}),onClick:t,sx:{paddingRight:0,minWidth:0,marginRight:1}}),e.jsx(j.default,{variant:"contained",size:"small",color:"primary","aria-label":"submit button",startIcon:e.jsx(f.default,{sx:{fontSize:12}}),onClick:i,sx:{paddingRight:0,minWidth:0}})]}),q=({dense:t,onClick:i})=>{const{typography:l}=s.useTheme();return e.jsx(y.default,{size:"small",onClick:i,sx:{ml:t?.5:1},"aria-label":"edit button",children:e.jsx(v.default,{sx:{fontSize:l.pxToRem(t?18:24)}})})},S=e=>`label-${e.replace(/ /g,"-")}`,T=({label:t,hideLabel:i,tooltip:l,tooltipEnterDelay:a=2e3,children:r,dense:n,sx:u})=>{const{typography:o}=s.useTheme(),d=S(t);return e.jsxs(b.default,{width:1,lineHeight:n?0:void 0,sx:u,children:[!i&&e.jsx(p.default,{variant:n?"caption":"subtitle2",role:"label",id:d,lineHeight:n?o.pxToRem(15):void 0,children:t}),l?e.jsx(C.default,{title:l,placement:"top",enterDelay:a,children:r}):r]})};exports.ValueText=({label:t,value:i,placeholder:l="-",editable:r,dense:n,onEdit:s=(()=>null)})=>{const u=a.useRef(null),{isEditing:o,editValue:d,startEdit:c,cancelEdit:m,setEditValue:x,submitEdit:f}=((e,t)=>{const[i,l]=a.useState(!1),[r,n]=a.useState(e),s=()=>{l(!1),n(e)};return{isEditing:i,cancelEdit:s,editValue:r,setEditValue:n,startEdit:()=>{l(!0)},submitEdit:()=>{t(r),s()}}})(i?.toString(),s),g=S(t),j=i?.toString()||l,y=e=>{"Enter"===e.key&&s(e.target.value)};return a.useEffect((()=>(u.current?.addEventListener("keypress",y),()=>u.current?.removeEventListener("keypress",y))),[u.current]),e.jsx(T,{hideLabel:o,label:t,tooltip:j,dense:n,children:o?e.jsx(h.default,{inputRef:u,value:d,label:t,size:"small",onChange:e=>x(e.target.value),InputProps:{endAdornment:e.jsx(k,{onClickCancel:m,onClickSubmit:f})},sx:{marginY:n?0:1}}):e.jsxs(b.default,{display:"flex","aria-labelledby":g,children:[e.jsx(p.default,{variant:n?"body1":"h5",noWrap:!0,children:j}),r&&e.jsx(q,{dense:n,onClick:c})]})})};
+"use strict";var e=require("react/jsx-runtime"),i=require("@mui/material/Typography"),t=require("@mui/material/TextField"),r=require("@mui/material/Box"),l=require("react"),a=require("@mui/icons-material/Check"),n=require("@mui/icons-material/Clear"),s=require("@mui/material/styles"),o=require("@mui/material/Button"),u=require("@mui/material/IconButton"),d=require("@mui/material/InputAdornment"),c=require("@mui/icons-material/Edit"),m=require("@mui/material/Tooltip");const x=({onClickCancel:i,onClickSubmit:t,sx:r})=>e.jsxs(d,{position:"end",sx:r,children:[e.jsx(o,{variant:"contained",size:"small",color:"error","aria-label":"cancel button",startIcon:e.jsx(n,{sx:{fontSize:12}}),onClick:i,sx:{paddingRight:0,minWidth:0,marginRight:1}}),e.jsx(o,{variant:"contained",size:"small",color:"primary","aria-label":"submit button",startIcon:e.jsx(a,{sx:{fontSize:12}}),onClick:t,sx:{paddingRight:0,minWidth:0}})]}),p=({dense:i,onClick:t})=>{const{typography:r}=s.useTheme();return e.jsx(u,{size:"small",onClick:t,sx:{ml:i?.5:1},"aria-label":"edit button",children:e.jsx(c,{sx:{fontSize:r.pxToRem(i?18:24)}})})},h=e=>`label-${e.replace(/ /g,"-")}`,b=({label:t,hideLabel:l,tooltip:a,tooltipEnterDelay:n=2e3,children:o,dense:u,sx:d})=>{const{typography:c}=s.useTheme(),x=h(t);return e.jsxs(r,{width:1,lineHeight:u?0:void 0,sx:d,children:[!l&&e.jsx(i,{variant:u?"caption":"subtitle2",role:"label",id:x,lineHeight:u?c.pxToRem(15):void 0,children:t}),a?e.jsx(m,{title:a,placement:"top",enterDelay:n,children:o}):o]})};exports.ValueText=({label:a,value:n,placeholder:s="-",editable:o,dense:u,onEdit:d=(()=>null)})=>{const c=l.useRef(null),{isEditing:m,editValue:g,startEdit:j,cancelEdit:E,setEditValue:y,submitEdit:v}=((e,i)=>{const[t,r]=l.useState(!1),[a,n]=l.useState(e),s=()=>{r(!1),n(e)};return{isEditing:t,cancelEdit:s,editValue:a,setEditValue:n,startEdit:()=>{r(!0)},submitEdit:()=>{i(a),s()}}})(n?.toString(),d),C=h(a),k=n?.toString()||s,q=e=>{"Enter"===e.key&&d(e.target.value)};return l.useEffect((()=>(c.current?.addEventListener("keypress",q),()=>c.current?.removeEventListener("keypress",q))),[c.current]),e.jsx(b,{hideLabel:m,label:a,tooltip:k,dense:u,children:m?e.jsx(t,{inputRef:c,value:g,label:a,size:"small",onChange:e=>y(e.target.value),InputProps:{endAdornment:e.jsx(x,{onClickCancel:E,onClickSubmit:v})},sx:{marginY:u?0:1}}):e.jsxs(r,{display:"flex","aria-labelledby":C,children:[e.jsx(i,{variant:u?"body1":"h5",noWrap:!0,children:k}),o&&e.jsx(p,{dense:u,onClick:j})]})})};
 //# sourceMappingURL=index.js.map

package/value-text/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/value-base/value-edit.tsx","../../../src/value-content/value-content.tsx","../../../src/value-text/value-text.tsx","../../../src/value-base/value-displays.types.ts"],"sourcesContent":["import { useState } from \"react\";\nimport CheckIcon from \"@mui/icons-material/Check\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\nimport { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport EditIcon from \"@mui/icons-material/Edit\";\n\nexport interface ValueEditButtonsProps {\n  onClickCancel: () => void;\n  onClickSubmit: () => void;\n  sx?: SxProps<Theme>;\n}\n\nexport const ValueEditButtons = ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => {\n  return (\n    <InputAdornment position=\"end\" sx={sx}>\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"error\"\n        aria-label=\"cancel button\"\n        startIcon={<ClearIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickCancel}\n        sx={{ paddingRight: 0, minWidth: 0, marginRight: 1 }}\n      />\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"primary\"\n        aria-label=\"submit button\"\n        startIcon={<CheckIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickSubmit}\n        sx={{ paddingRight: 0, minWidth: 0 }}\n      />\n    </InputAdornment>\n  );\n};\n\n/**\n * Hook to manage the editing behaviour\n */\nexport const useEditableValueDisplay = <T,>(\n  initialValue: T | undefined,\n  onEdit: (value?: T) => void,\n) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [editValue, setEditValue] = useState<T | undefined>(initialValue);\n\n  const cancelEdit = () => {\n    setIsEditing(false);\n    setEditValue(initialValue);\n  };\n  const startEdit = () => {\n    setIsEditing(true);\n  };\n\n  const submitEdit = () => {\n    onEdit(editValue);\n    cancelEdit();\n  };\n\n  return { isEditing, cancelEdit, editValue, setEditValue, startEdit, submitEdit };\n};\n\nexport interface ValueEditButtonProps {\n  dense?: boolean;\n  onClick: () => void;\n}\n\nexport const ValueEditButton = ({ dense, onClick }: ValueEditButtonProps) => {\n  const { typography } = useTheme();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onClick}\n      sx={{ ml: dense ? 0.5 : 1 }}\n      aria-label=\"edit button\"\n    >\n      <EditIcon sx={{ fontSize: typography.pxToRem(dense ? 18 : 24) }} />\n    </IconButton>\n  );\n};\n","import { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Box from \"@mui/material/Box\";\nimport Tooltip from \"@mui/material/Tooltip\";\nimport Typography from \"@mui/material/Typography\";\n\nexport const getValueContentLabelId = (label: string): string =>\n  `label-${label.replace(/ /g, \"-\")}`;\n\nexport interface ValueContentProps {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * If true, the label will not be shown\n   */\n  hideLabel?: boolean;\n\n  /**\n   * If defined, a tooltip is going to be added arround the children;\n   */\n  tooltip?: string;\n\n  /**\n   * Timeout before the tooltip appears when the user hovers the value\n   */\n  tooltipEnterDelay?: number;\n\n  /**\n   * Component that's going to be renderd under the label\n   */\n  children: React.ReactElement<any, any>;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n\n  /**\n   * Custom styles for the root component\n   */\n  sx?: SxProps<Theme>;\n}\n\n/**\n * Displays a string value with a label\n */\nexport const ValueContent = ({\n  label,\n  hideLabel,\n  tooltip,\n  tooltipEnterDelay = 2000,\n  children,\n  dense,\n  sx,\n}: ValueContentProps) => {\n  const { typography } = useTheme();\n  const id = getValueContentLabelId(label);\n\n  return (\n    <Box width={1} lineHeight={dense ? 0 : undefined} sx={sx}>\n      {!hideLabel && (\n        <Typography\n          variant={dense ? \"caption\" : \"subtitle2\"}\n          role=\"label\"\n          id={id}\n          lineHeight={dense ? typography.pxToRem(15) : undefined}\n        >\n          {label}\n        </Typography>\n      )}\n      {tooltip ? (\n        <Tooltip title={tooltip} placement=\"top\" enterDelay={tooltipEnterDelay}>\n          {children}\n        </Tooltip>\n      ) : (\n        children\n      )}\n    </Box>\n  );\n};\n","import Typography from \"@mui/material/Typography\";\nimport TextField from \"@mui/material/TextField\";\nimport Box from \"@mui/material/Box\";\nimport { useEffect, useRef } from \"react\";\nimport {\n  BaseValueProps,\n  DefaultPlaceholder,\n  EditableValueProps,\n  useEditableValueDisplay,\n  ValueEditButton,\n  ValueEditButtons,\n} from \"../value-base\";\nimport { getValueContentLabelId, ValueContent } from \"../value-content\";\n\nexport type ValueTextProps = BaseValueProps<string | number> & EditableValueProps<string>;\n\n/**\n * Displays a string value with a label\n */\nexport const ValueText = ({\n  label,\n  value: valueProp,\n  placeholder = DefaultPlaceholder,\n  editable,\n  dense,\n  onEdit = () => null,\n}: ValueTextProps) => {\n  const editInputRef = useRef<HTMLInputElement>(null);\n  const { isEditing, editValue, startEdit, cancelEdit, setEditValue, submitEdit } =\n    useEditableValueDisplay(valueProp?.toString(), onEdit);\n  const id = getValueContentLabelId(label);\n  const value = valueProp?.toString() || placeholder;\n\n  const editKeyPressListener = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      onEdit((e.target as any).value);\n    }\n  };\n\n  useEffect(() => {\n    editInputRef.current?.addEventListener(\"keypress\", editKeyPressListener);\n    return () => editInputRef.current?.removeEventListener(\"keypress\", editKeyPressListener);\n  }, [editInputRef.current]);\n\n  return (\n    <ValueContent hideLabel={isEditing} label={label} tooltip={value} dense={dense}>\n      {isEditing ? (\n        <TextField\n          inputRef={editInputRef}\n          value={editValue}\n          label={label}\n          size=\"small\"\n          onChange={(e) => setEditValue(e.target.value)}\n          InputProps={{\n            endAdornment: (\n              <ValueEditButtons onClickCancel={cancelEdit} onClickSubmit={submitEdit} />\n            ),\n          }}\n          sx={{ marginY: !dense ? 1 : 0 }}\n        />\n      ) : (\n        <Box display=\"flex\" aria-labelledby={id}>\n          <Typography variant={dense ? \"body1\" : \"h5\"} noWrap>\n            {value}\n          </Typography>\n          {editable && <ValueEditButton dense={dense} onClick={startEdit} />}\n        </Box>\n      )}\n    </ValueContent>\n  );\n};\n","export interface BaseValueProps<T> {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * Value displayed\n   */\n  value?: T;\n\n  /**\n   * String rendered if value is undefined\n   */\n  placeholder?: string;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n}\n\nexport interface EditableValueProps<T> {\n  /**\n   * This field can be edited or not\n   */\n  editable?: boolean;\n\n  /**\n   * Callback executed when the value is edited\n   */\n  onEdit?: (value?: T) => void;\n}\n\nexport const DefaultPlaceholder = \"-\";\n"],"names":["ValueEditButtons","onClickCancel","onClickSubmit","sx","_jsxs","InputAdornment","position","children","_jsx","Button","variant","size","color","startIcon","jsx","ClearIcon","fontSize","onClick","paddingRight","minWidth","marginRight","CheckIcon","ValueEditButton","dense","typography","useTheme","IconButton","ml","EditIcon","pxToRem","getValueContentLabelId","label","replace","ValueContent","hideLabel","tooltip","tooltipEnterDelay","id","Box","width","lineHeight","undefined","Typography","role","Tooltip","title","placement","enterDelay","value","valueProp","placeholder","editable","onEdit","editInputRef","useRef","isEditing","editValue","startEdit","cancelEdit","setEditValue","submitEdit","initialValue","setIsEditing","useState","useEditableValueDisplay","toString","editKeyPressListener","e","key","target","useEffect","current","addEventListener","removeEventListener","TextField","inputRef","onChange","InputProps","endAdornment","marginY","display","noWrap"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/value-base/value-edit.tsx","../../../src/value-content/value-content.tsx","../../../src/value-text/value-text.tsx","../../../src/value-base/value-displays.types.ts"],"sourcesContent":["import { useState } from \"react\";\nimport CheckIcon from \"@mui/icons-material/Check\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\nimport { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport EditIcon from \"@mui/icons-material/Edit\";\n\nexport interface ValueEditButtonsProps {\n  onClickCancel: () => void;\n  onClickSubmit: () => void;\n  sx?: SxProps<Theme>;\n}\n\nexport const ValueEditButtons = ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => {\n  return (\n    <InputAdornment position=\"end\" sx={sx}>\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"error\"\n        aria-label=\"cancel button\"\n        startIcon={<ClearIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickCancel}\n        sx={{ paddingRight: 0, minWidth: 0, marginRight: 1 }}\n      />\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"primary\"\n        aria-label=\"submit button\"\n        startIcon={<CheckIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickSubmit}\n        sx={{ paddingRight: 0, minWidth: 0 }}\n      />\n    </InputAdornment>\n  );\n};\n\n/**\n * Hook to manage the editing behaviour\n */\nexport const useEditableValueDisplay = <T,>(\n  initialValue: T | undefined,\n  onEdit: (value?: T) => void,\n) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [editValue, setEditValue] = useState<T | undefined>(initialValue);\n\n  const cancelEdit = () => {\n    setIsEditing(false);\n    setEditValue(initialValue);\n  };\n  const startEdit = () => {\n    setIsEditing(true);\n  };\n\n  const submitEdit = () => {\n    onEdit(editValue);\n    cancelEdit();\n  };\n\n  return { isEditing, cancelEdit, editValue, setEditValue, startEdit, submitEdit };\n};\n\nexport interface ValueEditButtonProps {\n  dense?: boolean;\n  onClick: () => void;\n}\n\nexport const ValueEditButton = ({ dense, onClick }: ValueEditButtonProps) => {\n  const { typography } = useTheme();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onClick}\n      sx={{ ml: dense ? 0.5 : 1 }}\n      aria-label=\"edit button\"\n    >\n      <EditIcon sx={{ fontSize: typography.pxToRem(dense ? 18 : 24) }} />\n    </IconButton>\n  );\n};\n","import { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Box from \"@mui/material/Box\";\nimport Tooltip from \"@mui/material/Tooltip\";\nimport Typography from \"@mui/material/Typography\";\n\nexport const getValueContentLabelId = (label: string): string =>\n  `label-${label.replace(/ /g, \"-\")}`;\n\nexport interface ValueContentProps {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * If true, the label will not be shown\n   */\n  hideLabel?: boolean;\n\n  /**\n   * If defined, a tooltip is going to be added arround the children;\n   */\n  tooltip?: string;\n\n  /**\n   * Timeout before the tooltip appears when the user hovers the value\n   */\n  tooltipEnterDelay?: number;\n\n  /**\n   * Component that's going to be renderd under the label\n   */\n  children: React.ReactElement<any, any>;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n\n  /**\n   * Custom styles for the root component\n   */\n  sx?: SxProps<Theme>;\n}\n\n/**\n * Displays a string value with a label\n */\nexport const ValueContent = ({\n  label,\n  hideLabel,\n  tooltip,\n  tooltipEnterDelay = 2000,\n  children,\n  dense,\n  sx,\n}: ValueContentProps) => {\n  const { typography } = useTheme();\n  const id = getValueContentLabelId(label);\n\n  return (\n    <Box width={1} lineHeight={dense ? 0 : undefined} sx={sx}>\n      {!hideLabel && (\n        <Typography\n          variant={dense ? \"caption\" : \"subtitle2\"}\n          role=\"label\"\n          id={id}\n          lineHeight={dense ? typography.pxToRem(15) : undefined}\n        >\n          {label}\n        </Typography>\n      )}\n      {tooltip ? (\n        <Tooltip title={tooltip} placement=\"top\" enterDelay={tooltipEnterDelay}>\n          {children}\n        </Tooltip>\n      ) : (\n        children\n      )}\n    </Box>\n  );\n};\n","import Typography from \"@mui/material/Typography\";\nimport TextField from \"@mui/material/TextField\";\nimport Box from \"@mui/material/Box\";\nimport { useEffect, useRef } from \"react\";\nimport {\n  BaseValueProps,\n  DefaultPlaceholder,\n  EditableValueProps,\n  useEditableValueDisplay,\n  ValueEditButton,\n  ValueEditButtons,\n} from \"../value-base\";\nimport { getValueContentLabelId, ValueContent } from \"../value-content\";\n\nexport type ValueTextProps = BaseValueProps<string | number> & EditableValueProps<string>;\n\n/**\n * Displays a string value with a label\n */\nexport const ValueText = ({\n  label,\n  value: valueProp,\n  placeholder = DefaultPlaceholder,\n  editable,\n  dense,\n  onEdit = () => null,\n}: ValueTextProps) => {\n  const editInputRef = useRef<HTMLInputElement>(null);\n  const { isEditing, editValue, startEdit, cancelEdit, setEditValue, submitEdit } =\n    useEditableValueDisplay(valueProp?.toString(), onEdit);\n  const id = getValueContentLabelId(label);\n  const value = valueProp?.toString() || placeholder;\n\n  const editKeyPressListener = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      onEdit((e.target as any).value);\n    }\n  };\n\n  useEffect(() => {\n    editInputRef.current?.addEventListener(\"keypress\", editKeyPressListener);\n    return () => editInputRef.current?.removeEventListener(\"keypress\", editKeyPressListener);\n  }, [editInputRef.current]);\n\n  return (\n    <ValueContent hideLabel={isEditing} label={label} tooltip={value} dense={dense}>\n      {isEditing ? (\n        <TextField\n          inputRef={editInputRef}\n          value={editValue}\n          label={label}\n          size=\"small\"\n          onChange={(e) => setEditValue(e.target.value)}\n          InputProps={{\n            endAdornment: (\n              <ValueEditButtons onClickCancel={cancelEdit} onClickSubmit={submitEdit} />\n            ),\n          }}\n          sx={{ marginY: !dense ? 1 : 0 }}\n        />\n      ) : (\n        <Box display=\"flex\" aria-labelledby={id}>\n          <Typography variant={dense ? \"body1\" : \"h5\"} noWrap>\n            {value}\n          </Typography>\n          {editable && <ValueEditButton dense={dense} onClick={startEdit} />}\n        </Box>\n      )}\n    </ValueContent>\n  );\n};\n","export interface BaseValueProps<T> {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * Value displayed\n   */\n  value?: T;\n\n  /**\n   * String rendered if value is undefined\n   */\n  placeholder?: string;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n}\n\nexport interface EditableValueProps<T> {\n  /**\n   * This field can be edited or not\n   */\n  editable?: boolean;\n\n  /**\n   * Callback executed when the value is edited\n   */\n  onEdit?: (value?: T) => void;\n}\n\nexport const DefaultPlaceholder = \"-\";\n"],"names":["ValueEditButtons","onClickCancel","onClickSubmit","sx","_jsxs","InputAdornment","position","children","_jsx","Button","variant","size","color","startIcon","jsx","ClearIcon","fontSize","onClick","paddingRight","minWidth","marginRight","CheckIcon","ValueEditButton","dense","typography","useTheme","IconButton","ml","EditIcon","pxToRem","getValueContentLabelId","label","replace","ValueContent","hideLabel","tooltip","tooltipEnterDelay","id","Box","width","lineHeight","undefined","Typography","role","Tooltip","title","placement","enterDelay","value","valueProp","placeholder","editable","onEdit","editInputRef","useRef","isEditing","editValue","startEdit","cancelEdit","setEditValue","submitEdit","initialValue","setIsEditing","useState","useEditableValueDisplay","toString","editKeyPressListener","e","key","target","useEffect","current","addEventListener","removeEventListener","TextField","inputRef","onChange","InputProps","endAdornment","marginY","display","noWrap"],"mappings":"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"}

package/value-text/cjs/package.json

@@ -5,8 +5,8 @@
   "module": "./index.js",
   "types": "./index.d.ts",
   "dependencies": {
-    "@mui/icons-material": "^5.11.16",
-    "@mui/material": "^5.13.6",
-    "react": "^18.2.0"
+    "@mui/icons-material": "^6.4.5",
+    "@mui/material": "^6.4.5",
+    "react": "^19.0.0"
   }
 }

package/value-text/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/value-base/value-edit.tsx","../../src/value-content/value-content.tsx","../../src/value-text/value-text.tsx","../../src/value-base/value-displays.types.ts"],"sourcesContent":["import { useState } from \"react\";\nimport CheckIcon from \"@mui/icons-material/Check\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\nimport { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport EditIcon from \"@mui/icons-material/Edit\";\n\nexport interface ValueEditButtonsProps {\n  onClickCancel: () => void;\n  onClickSubmit: () => void;\n  sx?: SxProps<Theme>;\n}\n\nexport const ValueEditButtons = ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => {\n  return (\n    <InputAdornment position=\"end\" sx={sx}>\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"error\"\n        aria-label=\"cancel button\"\n        startIcon={<ClearIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickCancel}\n        sx={{ paddingRight: 0, minWidth: 0, marginRight: 1 }}\n      />\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"primary\"\n        aria-label=\"submit button\"\n        startIcon={<CheckIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickSubmit}\n        sx={{ paddingRight: 0, minWidth: 0 }}\n      />\n    </InputAdornment>\n  );\n};\n\n/**\n * Hook to manage the editing behaviour\n */\nexport const useEditableValueDisplay = <T,>(\n  initialValue: T | undefined,\n  onEdit: (value?: T) => void,\n) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [editValue, setEditValue] = useState<T | undefined>(initialValue);\n\n  const cancelEdit = () => {\n    setIsEditing(false);\n    setEditValue(initialValue);\n  };\n  const startEdit = () => {\n    setIsEditing(true);\n  };\n\n  const submitEdit = () => {\n    onEdit(editValue);\n    cancelEdit();\n  };\n\n  return { isEditing, cancelEdit, editValue, setEditValue, startEdit, submitEdit };\n};\n\nexport interface ValueEditButtonProps {\n  dense?: boolean;\n  onClick: () => void;\n}\n\nexport const ValueEditButton = ({ dense, onClick }: ValueEditButtonProps) => {\n  const { typography } = useTheme();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onClick}\n      sx={{ ml: dense ? 0.5 : 1 }}\n      aria-label=\"edit button\"\n    >\n      <EditIcon sx={{ fontSize: typography.pxToRem(dense ? 18 : 24) }} />\n    </IconButton>\n  );\n};\n","import { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Box from \"@mui/material/Box\";\nimport Tooltip from \"@mui/material/Tooltip\";\nimport Typography from \"@mui/material/Typography\";\n\nexport const getValueContentLabelId = (label: string): string =>\n  `label-${label.replace(/ /g, \"-\")}`;\n\nexport interface ValueContentProps {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * If true, the label will not be shown\n   */\n  hideLabel?: boolean;\n\n  /**\n   * If defined, a tooltip is going to be added arround the children;\n   */\n  tooltip?: string;\n\n  /**\n   * Timeout before the tooltip appears when the user hovers the value\n   */\n  tooltipEnterDelay?: number;\n\n  /**\n   * Component that's going to be renderd under the label\n   */\n  children: React.ReactElement<any, any>;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n\n  /**\n   * Custom styles for the root component\n   */\n  sx?: SxProps<Theme>;\n}\n\n/**\n * Displays a string value with a label\n */\nexport const ValueContent = ({\n  label,\n  hideLabel,\n  tooltip,\n  tooltipEnterDelay = 2000,\n  children,\n  dense,\n  sx,\n}: ValueContentProps) => {\n  const { typography } = useTheme();\n  const id = getValueContentLabelId(label);\n\n  return (\n    <Box width={1} lineHeight={dense ? 0 : undefined} sx={sx}>\n      {!hideLabel && (\n        <Typography\n          variant={dense ? \"caption\" : \"subtitle2\"}\n          role=\"label\"\n          id={id}\n          lineHeight={dense ? typography.pxToRem(15) : undefined}\n        >\n          {label}\n        </Typography>\n      )}\n      {tooltip ? (\n        <Tooltip title={tooltip} placement=\"top\" enterDelay={tooltipEnterDelay}>\n          {children}\n        </Tooltip>\n      ) : (\n        children\n      )}\n    </Box>\n  );\n};\n","import Typography from \"@mui/material/Typography\";\nimport TextField from \"@mui/material/TextField\";\nimport Box from \"@mui/material/Box\";\nimport { useEffect, useRef } from \"react\";\nimport {\n  BaseValueProps,\n  DefaultPlaceholder,\n  EditableValueProps,\n  useEditableValueDisplay,\n  ValueEditButton,\n  ValueEditButtons,\n} from \"../value-base\";\nimport { getValueContentLabelId, ValueContent } from \"../value-content\";\n\nexport type ValueTextProps = BaseValueProps<string | number> & EditableValueProps<string>;\n\n/**\n * Displays a string value with a label\n */\nexport const ValueText = ({\n  label,\n  value: valueProp,\n  placeholder = DefaultPlaceholder,\n  editable,\n  dense,\n  onEdit = () => null,\n}: ValueTextProps) => {\n  const editInputRef = useRef<HTMLInputElement>(null);\n  const { isEditing, editValue, startEdit, cancelEdit, setEditValue, submitEdit } =\n    useEditableValueDisplay(valueProp?.toString(), onEdit);\n  const id = getValueContentLabelId(label);\n  const value = valueProp?.toString() || placeholder;\n\n  const editKeyPressListener = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      onEdit((e.target as any).value);\n    }\n  };\n\n  useEffect(() => {\n    editInputRef.current?.addEventListener(\"keypress\", editKeyPressListener);\n    return () => editInputRef.current?.removeEventListener(\"keypress\", editKeyPressListener);\n  }, [editInputRef.current]);\n\n  return (\n    <ValueContent hideLabel={isEditing} label={label} tooltip={value} dense={dense}>\n      {isEditing ? (\n        <TextField\n          inputRef={editInputRef}\n          value={editValue}\n          label={label}\n          size=\"small\"\n          onChange={(e) => setEditValue(e.target.value)}\n          InputProps={{\n            endAdornment: (\n              <ValueEditButtons onClickCancel={cancelEdit} onClickSubmit={submitEdit} />\n            ),\n          }}\n          sx={{ marginY: !dense ? 1 : 0 }}\n        />\n      ) : (\n        <Box display=\"flex\" aria-labelledby={id}>\n          <Typography variant={dense ? \"body1\" : \"h5\"} noWrap>\n            {value}\n          </Typography>\n          {editable && <ValueEditButton dense={dense} onClick={startEdit} />}\n        </Box>\n      )}\n    </ValueContent>\n  );\n};\n","export interface BaseValueProps<T> {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * Value displayed\n   */\n  value?: T;\n\n  /**\n   * String rendered if value is undefined\n   */\n  placeholder?: string;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n}\n\nexport interface EditableValueProps<T> {\n  /**\n   * This field can be edited or not\n   */\n  editable?: boolean;\n\n  /**\n   * Callback executed when the value is edited\n   */\n  onEdit?: (value?: T) => void;\n}\n\nexport const DefaultPlaceholder = \"-\";\n"],"names":["ValueEditButtons","onClickCancel","onClickSubmit","sx","_jsxs","InputAdornment","position","children","_jsx","Button","variant","size","color","startIcon","ClearIcon","fontSize","onClick","paddingRight","minWidth","marginRight","CheckIcon","ValueEditButton","dense","typography","useTheme","IconButton","ml","EditIcon","pxToRem","getValueContentLabelId","label","replace","ValueContent","hideLabel","tooltip","tooltipEnterDelay","id","Box","width","lineHeight","undefined","Typography","role","Tooltip","title","placement","enterDelay","ValueText","value","valueProp","placeholder","editable","onEdit","editInputRef","useRef","isEditing","editValue","startEdit","cancelEdit","setEditValue","submitEdit","initialValue","setIsEditing","useState","useEditableValueDisplay","toString","editKeyPressListener","e","key","target","useEffect","current","addEventListener","removeEventListener","TextField","inputRef","onChange","InputProps","endAdornment","marginY","display","noWrap"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/value-base/value-edit.tsx","../../src/value-content/value-content.tsx","../../src/value-text/value-text.tsx","../../src/value-base/value-displays.types.ts"],"sourcesContent":["import { useState } from \"react\";\nimport CheckIcon from \"@mui/icons-material/Check\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\nimport { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport EditIcon from \"@mui/icons-material/Edit\";\n\nexport interface ValueEditButtonsProps {\n  onClickCancel: () => void;\n  onClickSubmit: () => void;\n  sx?: SxProps<Theme>;\n}\n\nexport const ValueEditButtons = ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => {\n  return (\n    <InputAdornment position=\"end\" sx={sx}>\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"error\"\n        aria-label=\"cancel button\"\n        startIcon={<ClearIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickCancel}\n        sx={{ paddingRight: 0, minWidth: 0, marginRight: 1 }}\n      />\n      <Button\n        variant=\"contained\"\n        size=\"small\"\n        color=\"primary\"\n        aria-label=\"submit button\"\n        startIcon={<CheckIcon sx={{ fontSize: 12 }} />}\n        onClick={onClickSubmit}\n        sx={{ paddingRight: 0, minWidth: 0 }}\n      />\n    </InputAdornment>\n  );\n};\n\n/**\n * Hook to manage the editing behaviour\n */\nexport const useEditableValueDisplay = <T,>(\n  initialValue: T | undefined,\n  onEdit: (value?: T) => void,\n) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [editValue, setEditValue] = useState<T | undefined>(initialValue);\n\n  const cancelEdit = () => {\n    setIsEditing(false);\n    setEditValue(initialValue);\n  };\n  const startEdit = () => {\n    setIsEditing(true);\n  };\n\n  const submitEdit = () => {\n    onEdit(editValue);\n    cancelEdit();\n  };\n\n  return { isEditing, cancelEdit, editValue, setEditValue, startEdit, submitEdit };\n};\n\nexport interface ValueEditButtonProps {\n  dense?: boolean;\n  onClick: () => void;\n}\n\nexport const ValueEditButton = ({ dense, onClick }: ValueEditButtonProps) => {\n  const { typography } = useTheme();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onClick}\n      sx={{ ml: dense ? 0.5 : 1 }}\n      aria-label=\"edit button\"\n    >\n      <EditIcon sx={{ fontSize: typography.pxToRem(dense ? 18 : 24) }} />\n    </IconButton>\n  );\n};\n","import { SxProps, Theme, useTheme } from \"@mui/material/styles\";\nimport Box from \"@mui/material/Box\";\nimport Tooltip from \"@mui/material/Tooltip\";\nimport Typography from \"@mui/material/Typography\";\n\nexport const getValueContentLabelId = (label: string): string =>\n  `label-${label.replace(/ /g, \"-\")}`;\n\nexport interface ValueContentProps {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * If true, the label will not be shown\n   */\n  hideLabel?: boolean;\n\n  /**\n   * If defined, a tooltip is going to be added arround the children;\n   */\n  tooltip?: string;\n\n  /**\n   * Timeout before the tooltip appears when the user hovers the value\n   */\n  tooltipEnterDelay?: number;\n\n  /**\n   * Component that's going to be renderd under the label\n   */\n  children: React.ReactElement<any, any>;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n\n  /**\n   * Custom styles for the root component\n   */\n  sx?: SxProps<Theme>;\n}\n\n/**\n * Displays a string value with a label\n */\nexport const ValueContent = ({\n  label,\n  hideLabel,\n  tooltip,\n  tooltipEnterDelay = 2000,\n  children,\n  dense,\n  sx,\n}: ValueContentProps) => {\n  const { typography } = useTheme();\n  const id = getValueContentLabelId(label);\n\n  return (\n    <Box width={1} lineHeight={dense ? 0 : undefined} sx={sx}>\n      {!hideLabel && (\n        <Typography\n          variant={dense ? \"caption\" : \"subtitle2\"}\n          role=\"label\"\n          id={id}\n          lineHeight={dense ? typography.pxToRem(15) : undefined}\n        >\n          {label}\n        </Typography>\n      )}\n      {tooltip ? (\n        <Tooltip title={tooltip} placement=\"top\" enterDelay={tooltipEnterDelay}>\n          {children}\n        </Tooltip>\n      ) : (\n        children\n      )}\n    </Box>\n  );\n};\n","import Typography from \"@mui/material/Typography\";\nimport TextField from \"@mui/material/TextField\";\nimport Box from \"@mui/material/Box\";\nimport { useEffect, useRef } from \"react\";\nimport {\n  BaseValueProps,\n  DefaultPlaceholder,\n  EditableValueProps,\n  useEditableValueDisplay,\n  ValueEditButton,\n  ValueEditButtons,\n} from \"../value-base\";\nimport { getValueContentLabelId, ValueContent } from \"../value-content\";\n\nexport type ValueTextProps = BaseValueProps<string | number> & EditableValueProps<string>;\n\n/**\n * Displays a string value with a label\n */\nexport const ValueText = ({\n  label,\n  value: valueProp,\n  placeholder = DefaultPlaceholder,\n  editable,\n  dense,\n  onEdit = () => null,\n}: ValueTextProps) => {\n  const editInputRef = useRef<HTMLInputElement>(null);\n  const { isEditing, editValue, startEdit, cancelEdit, setEditValue, submitEdit } =\n    useEditableValueDisplay(valueProp?.toString(), onEdit);\n  const id = getValueContentLabelId(label);\n  const value = valueProp?.toString() || placeholder;\n\n  const editKeyPressListener = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      onEdit((e.target as any).value);\n    }\n  };\n\n  useEffect(() => {\n    editInputRef.current?.addEventListener(\"keypress\", editKeyPressListener);\n    return () => editInputRef.current?.removeEventListener(\"keypress\", editKeyPressListener);\n  }, [editInputRef.current]);\n\n  return (\n    <ValueContent hideLabel={isEditing} label={label} tooltip={value} dense={dense}>\n      {isEditing ? (\n        <TextField\n          inputRef={editInputRef}\n          value={editValue}\n          label={label}\n          size=\"small\"\n          onChange={(e) => setEditValue(e.target.value)}\n          InputProps={{\n            endAdornment: (\n              <ValueEditButtons onClickCancel={cancelEdit} onClickSubmit={submitEdit} />\n            ),\n          }}\n          sx={{ marginY: !dense ? 1 : 0 }}\n        />\n      ) : (\n        <Box display=\"flex\" aria-labelledby={id}>\n          <Typography variant={dense ? \"body1\" : \"h5\"} noWrap>\n            {value}\n          </Typography>\n          {editable && <ValueEditButton dense={dense} onClick={startEdit} />}\n        </Box>\n      )}\n    </ValueContent>\n  );\n};\n","export interface BaseValueProps<T> {\n  /**\n   * Name of the displayed value\n   */\n  label: string;\n\n  /**\n   * Value displayed\n   */\n  value?: T;\n\n  /**\n   * String rendered if value is undefined\n   */\n  placeholder?: string;\n\n  /**\n   * The value has to be displayed as compact or not.\n   * False by default\n   */\n  dense?: boolean;\n}\n\nexport interface EditableValueProps<T> {\n  /**\n   * This field can be edited or not\n   */\n  editable?: boolean;\n\n  /**\n   * Callback executed when the value is edited\n   */\n  onEdit?: (value?: T) => void;\n}\n\nexport const DefaultPlaceholder = \"-\";\n"],"names":["ValueEditButtons","onClickCancel","onClickSubmit","sx","_jsxs","InputAdornment","position","children","_jsx","Button","variant","size","color","startIcon","ClearIcon","fontSize","onClick","paddingRight","minWidth","marginRight","CheckIcon","ValueEditButton","dense","typography","useTheme","IconButton","ml","EditIcon","pxToRem","getValueContentLabelId","label","replace","ValueContent","hideLabel","tooltip","tooltipEnterDelay","id","Box","width","lineHeight","undefined","Typography","role","Tooltip","title","placement","enterDelay","ValueText","value","valueProp","placeholder","editable","onEdit","editInputRef","useRef","isEditing","editValue","startEdit","cancelEdit","setEditValue","submitEdit","initialValue","setIsEditing","useState","useEditableValueDisplay","toString","editKeyPressListener","e","key","target","useEffect","current","addEventListener","removeEventListener","TextField","inputRef","onChange","InputProps","endAdornment","marginY","display","noWrap"],"mappings":"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"}

package/value-text/package.json

@@ -5,8 +5,8 @@
   "module": "./index.js",
   "types": "./index.d.ts",
   "dependencies": {
-    "@mui/icons-material": "^5.11.16",
-    "@mui/material": "^5.13.6",
-    "react": "^18.2.0"
+    "@mui/icons-material": "^6.4.5",
+    "@mui/material": "^6.4.5",
+    "react": "^19.0.0"
   }
 }

package/value-text/value-text.d.ts

@@ -3,4 +3,4 @@ export type ValueTextProps = BaseValueProps<string | number> & EditableValueProp
 /**
  * Displays a string value with a label
  */
-export declare const ValueText: ({ label, value: valueProp, placeholder, editable, dense, onEdit, }: ValueTextProps) => JSX.Element;
+export declare const ValueText: ({ label, value: valueProp, placeholder, editable, dense, onEdit, }: ValueTextProps) => import("react/jsx-runtime").JSX.Element;

package/hooks/cjs/index.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-router-dom");exports.useNavigateWhenValueChanges=(r,u,{from:a,to:o})=>{const s=e.useRef(),n=t.useNavigate();e.useEffect((()=>{s.current===a&&u===o&&n(r),s.current=u}),[u])},exports.useRouteMatch=e=>{const{pathname:r}=t.useLocation();for(let u=0;u<e.length;u+=1){const a=e[u],o=t.matchPath(a,r);if(null!==o)return o}return null};
-//# sourceMappingURL=index.js.map

package/hooks/cjs/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/hooks/routing/routing.hooks.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { matchPath, useLocation, useNavigate } from \"react-router-dom\";\n\nexport interface NavigateWhenValueChangesOptions<T> {\n  from: T;\n  to: T;\n}\n\nexport const useNavigateWhenValueChanges = <T>(\n  path: string,\n  value: T | undefined,\n  { from, to }: NavigateWhenValueChangesOptions<T>,\n) => {\n  const prevRef = useRef<T>();\n  const navigate = useNavigate();\n\n  useEffect(() => {\n    if (prevRef.current === from && value === to) {\n      navigate(path);\n    }\n    prevRef.current = value;\n  }, [value]);\n};\n\nexport const useRouteMatch = (patterns: string[]) => {\n  const { pathname } = useLocation();\n\n  for (let i = 0; i < patterns.length; i += 1) {\n    const pattern = patterns[i];\n    const possibleMatch = matchPath(pattern, pathname);\n    if (possibleMatch !== null) {\n      return possibleMatch;\n    }\n  }\n\n  return null;\n};\n"],"names":["path","value","from","to","prevRef","useRef","navigate","useNavigate","useEffect","current","patterns","pathname","useLocation","i","length","pattern","possibleMatch","matchPath"],"mappings":"6JAQ2C,CACzCA,EACAC,GACEC,OAAMC,SAER,MAAMC,EAAUC,EAAAA,SACVC,EAAWC,EAAAA,cAEjBC,EAAAA,WAAU,KACJJ,EAAQK,UAAYP,GAAQD,IAAUE,GACxCG,EAASN,GAEXI,EAAQK,QAAUR,CAAK,GACtB,CAACA,GAAO,wBAGiBS,IAC5B,MAAMC,SAAEA,GAAaC,EAAAA,cAErB,IAAK,IAAIC,EAAI,EAAGA,EAAIH,EAASI,OAAQD,GAAK,EAAG,CAC3C,MAAME,EAAUL,EAASG,GACnBG,EAAgBC,EAAAA,UAAUF,EAASJ,GACzC,GAAsB,OAAlBK,EACF,OAAOA,CAEV,CAED,OAAO,IAAI"}

package/hooks/cjs/package.json

@@ -1,11 +0,0 @@
-{
-  "name": "@pautena/react-design-system/hooks",
-  "private": true,
-  "main": "./cjs/index.js",
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "dependencies": {
-    "react": "^18.2.0",
-    "react-router-dom": "^6.14.0"
-  }
-}

package/hooks/index.d.ts

@@ -1 +0,0 @@
-export * from "./routing";

package/hooks/index.js

@@ -1,2 +0,0 @@
-import{useRef as r,useEffect as t}from"react";import{useNavigate as o,useLocation as n,matchPath as e}from"react-router-dom";const c=(n,e,{from:c,to:m})=>{const u=r(),l=o();t((()=>{u.current===c&&e===m&&l(n),u.current=e}),[e])},m=r=>{const{pathname:t}=n();for(let o=0;o<r.length;o+=1){const n=r[o],c=e(n,t);if(null!==c)return c}return null};export{c as useNavigateWhenValueChanges,m as useRouteMatch};
-//# sourceMappingURL=index.js.map

package/hooks/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../src/hooks/routing/routing.hooks.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { matchPath, useLocation, useNavigate } from \"react-router-dom\";\n\nexport interface NavigateWhenValueChangesOptions<T> {\n  from: T;\n  to: T;\n}\n\nexport const useNavigateWhenValueChanges = <T>(\n  path: string,\n  value: T | undefined,\n  { from, to }: NavigateWhenValueChangesOptions<T>,\n) => {\n  const prevRef = useRef<T>();\n  const navigate = useNavigate();\n\n  useEffect(() => {\n    if (prevRef.current === from && value === to) {\n      navigate(path);\n    }\n    prevRef.current = value;\n  }, [value]);\n};\n\nexport const useRouteMatch = (patterns: string[]) => {\n  const { pathname } = useLocation();\n\n  for (let i = 0; i < patterns.length; i += 1) {\n    const pattern = patterns[i];\n    const possibleMatch = matchPath(pattern, pathname);\n    if (possibleMatch !== null) {\n      return possibleMatch;\n    }\n  }\n\n  return null;\n};\n"],"names":["useNavigateWhenValueChanges","path","value","from","to","prevRef","useRef","navigate","useNavigate","useEffect","current","useRouteMatch","patterns","pathname","useLocation","i","length","pattern","possibleMatch","matchPath"],"mappings":"6HAQO,MAAMA,EAA8B,CACzCC,EACAC,GACEC,OAAMC,SAER,MAAMC,EAAUC,IACVC,EAAWC,IAEjBC,GAAU,KACJJ,EAAQK,UAAYP,GAAQD,IAAUE,GACxCG,EAASN,GAEXI,EAAQK,QAAUR,CAAK,GACtB,CAACA,GAAO,EAGAS,EAAiBC,IAC5B,MAAMC,SAAEA,GAAaC,IAErB,IAAK,IAAIC,EAAI,EAAGA,EAAIH,EAASI,OAAQD,GAAK,EAAG,CAC3C,MAAME,EAAUL,EAASG,GACnBG,EAAgBC,EAAUF,EAASJ,GACzC,GAAsB,OAAlBK,EACF,OAAOA,CAEV,CAED,OAAO,IAAI"}

package/hooks/package.json

@@ -1,11 +0,0 @@
-{
-  "name": "@pautena/react-design-system/hooks",
-  "private": true,
-  "main": "./cjs/index.js",
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "dependencies": {
-    "react": "^18.2.0",
-    "react-router-dom": "^6.14.0"
-  }
-}

package/hooks/routing/index.d.ts

@@ -1 +0,0 @@
-export * from "./routing.hooks";

package/hooks/routing/routing.hooks.d.ts

@@ -1,6 +0,0 @@
-export interface NavigateWhenValueChangesOptions<T> {
-    from: T;
-    to: T;
-}
-export declare const useNavigateWhenValueChanges: <T>(path: string, value: T | undefined, { from, to }: NavigateWhenValueChangesOptions<T>) => void;
-export declare const useRouteMatch: (patterns: string[]) => import("react-router-dom").PathMatch<string> | null;

package/link/cjs/index.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react-router-dom"),t=require("react");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=o(require("@mui/material/Link"));const i=t.forwardRef(((t,o)=>{const{href:u,...i}=t;return e.jsx(r.Link,{ref:o,to:u,...i})})),n=t.forwardRef(((r,t)=>e.jsx(u.default,{...r,component:i})));exports.Link=n,exports.LinkBehaviour=i;
-//# sourceMappingURL=index.js.map

package/link/cjs/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/link/link.tsx"],"sourcesContent":["import { Link as RouterLink, LinkProps as RouterLinkProps } from \"react-router-dom\";\nimport { forwardRef } from \"react\";\nimport MuiLink, { LinkProps } from \"@mui/material/Link\";\n\n/* eslint-disable react/display-name, @typescript-eslint/no-explicit-any */\nexport const LinkBehaviour = forwardRef<\n  any,\n  Omit<RouterLinkProps, \"to\"> & { href: RouterLinkProps[\"to\"] }\n>((props, ref) => {\n  const { href, ...other } = props;\n  return <RouterLink ref={ref} to={href} {...other} />;\n});\n\nexport const Link = forwardRef<any, LinkProps>((props, _1) => {\n  return <MuiLink {...(props as any)} component={LinkBehaviour} />;\n});\n"],"names":["LinkBehaviour","forwardRef","props","ref","href","other","_jsx","jsx","RouterLink","to","Link","_1","MuiLink","component"],"mappings":"uQAKa,MAAAA,EAAgBC,EAAUA,YAGrC,CAACC,EAAOC,KACR,MAAMC,KAAEA,KAASC,GAAUH,EAC3B,OAAOI,EAACC,IAAAC,OAAW,CAAAL,IAAKA,EAAKM,GAAIL,KAAUC,GAAS,IAGzCK,EAAOT,EAAUA,YAAiB,CAACC,EAAOS,IAC9CL,EAAAA,IAACM,EAAAA,QAAa,IAAAV,EAAeW,UAAWb"}

package/link/cjs/package.json

@@ -1,12 +0,0 @@
-{
-  "name": "@pautena/react-design-system/link",
-  "private": true,
-  "main": "./cjs/index.js",
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "dependencies": {
-    "@mui/material": "^5.13.6",
-    "react": "^18.2.0",
-    "react-router-dom": "^6.14.0"
-  }
-}

package/link/index.d.ts

@@ -1 +0,0 @@
-export * from "./link";

package/link/index.js

@@ -1,2 +0,0 @@
-import{jsx as r}from"react/jsx-runtime";import{Link as o}from"react-router-dom";import{forwardRef as t}from"react";import m from"@mui/material/Link";const e=t(((t,m)=>{const{href:e,...i}=t;return r(o,{ref:m,to:e,...i})})),i=t(((o,t)=>r(m,{...o,component:e})));export{i as Link,e as LinkBehaviour};
-//# sourceMappingURL=index.js.map

package/link/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../src/link/link.tsx"],"sourcesContent":["import { Link as RouterLink, LinkProps as RouterLinkProps } from \"react-router-dom\";\nimport { forwardRef } from \"react\";\nimport MuiLink, { LinkProps } from \"@mui/material/Link\";\n\n/* eslint-disable react/display-name, @typescript-eslint/no-explicit-any */\nexport const LinkBehaviour = forwardRef<\n  any,\n  Omit<RouterLinkProps, \"to\"> & { href: RouterLinkProps[\"to\"] }\n>((props, ref) => {\n  const { href, ...other } = props;\n  return <RouterLink ref={ref} to={href} {...other} />;\n});\n\nexport const Link = forwardRef<any, LinkProps>((props, _1) => {\n  return <MuiLink {...(props as any)} component={LinkBehaviour} />;\n});\n"],"names":["LinkBehaviour","forwardRef","props","ref","href","other","_jsx","RouterLink","to","Link","_1","MuiLink","component"],"mappings":"qJAKa,MAAAA,EAAgBC,GAG3B,CAACC,EAAOC,KACR,MAAMC,KAAEA,KAASC,GAAUH,EAC3B,OAAOI,EAACC,EAAW,CAAAJ,IAAKA,EAAKK,GAAIJ,KAAUC,GAAS,IAGzCI,EAAOR,GAA2B,CAACC,EAAOQ,IAC9CJ,EAACK,EAAa,IAAAT,EAAeU,UAAWZ"}

package/link/link.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { LinkProps as RouterLinkProps } from "react-router-dom";
-import { LinkProps } from "@mui/material/Link";
-export declare const LinkBehaviour: import("react").ForwardRefExoticComponent<Omit<RouterLinkProps, "to"> & {
-    href: RouterLinkProps["to"];
-} & import("react").RefAttributes<any>>;
-export declare const Link: import("react").ForwardRefExoticComponent<Omit<LinkProps, "ref"> & import("react").RefAttributes<any>>;

package/link/package.json

@@ -1,12 +0,0 @@
-{
-  "name": "@pautena/react-design-system/link",
-  "private": true,
-  "main": "./cjs/index.js",
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "dependencies": {
-    "@mui/material": "^5.13.6",
-    "react": "^18.2.0",
-    "react-router-dom": "^6.14.0"
-  }
-}

package/model-router/cjs/index.js

@@ -1,24 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react-router-dom"),r=require("react"),n=require("@mui/material/Button"),i=require("@mui/material/Grid"),o=require("@mui/material/Box"),a=require("@mui/material/FormControlLabel"),l=require("@mui/material/Checkbox"),s=require("@mui/material/FormControl"),u=require("@mui/material/InputLabel"),c=require("@mui/material/Select"),d=require("@mui/material/MenuItem"),f=require("@mui/material/ListItemText"),p=require("@mui/material/TextField"),m=require("@mui/x-date-pickers"),y=require("@mui/material"),h=require("@mui/material/Paper"),x=require("@mui/material/Typography"),b=require("@mui/material/styles"),g=require("@mui/material/LinearProgress"),v=require("@mui/material/CircularProgress"),j=require("@mui/icons-material/ReportProblem");require("@mui/material/Snackbar"),require("@mui/material/Alert"),require("@mui/material/AlertTitle");var S=require("@mui/material/Breadcrumbs"),w=require("@mui/material/Container"),$=require("@mui/material/Tabs"),C=require("@mui/material/Tab"),E=require("@mui/material/Link"),k=require("@mui/material/TableRow"),T=require("@mui/material/TableCell"),P=require("@mui/material/IconButton"),q=require("@mui/material/Menu"),O=require("@mui/material/TableContainer"),I=require("@mui/material/TableBody"),R=require("@mui/material/InputAdornment"),N=require("@mui/material/Table"),M=require("@mui/icons-material/Search"),z=require("@mui/material/TableSortLabel"),_=require("@mui/material/TableHead"),D=require("@mui/icons-material/MoreVert"),V=require("@mui/material/Switch"),A=require("@mui/icons-material/Check"),F=require("@mui/icons-material/Close"),L=require("@mui/icons-material/Clear"),W=require("@mui/icons-material/Edit"),B=require("@mui/material/Tooltip"),U=require("date-fns"),Y=require("@mui/x-date-pickers/DatePicker"),H=require("@mui/x-date-pickers/DateTimePicker"),J=require("@mui/x-date-pickers/TimePicker"),G=require("@mui/x-data-grid");function X(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var K=X(n),Q=X(i),Z=X(o),ee=X(a),te=X(l),re=X(s),ne=X(u),ie=X(c),oe=X(d),ae=X(f),le=X(p),se=X(h),ue=X(x),ce=X(g),de=X(v),fe=X(j),pe=X(S),me=X(w),ye=X($),he=X(C),xe=X(E),be=X(k),ge=X(T),ve=X(P),je=X(q),Se=X(O),we=X(I),$e=X(R),Ce=X(N),Ee=X(M),ke=X(z),Te=X(_),Pe=X(D),qe=X(V),Oe=X(A),Ie=X(F),Re=X(L),Ne=X(W),Me=X(B);const ze={string:"",number:0,boolean:!1,enum:"",multienum:[],date:new Date(1970,0,1,0,0),time:new Date(1970,0,1,0,0),datetime:new Date(1970,0,1,0,0),group:{},"group[]":[],"string[]":[],"number[]":[]},_e=(e,t)=>t&&t[e.id]||"default"in e&&e.default||ze[e.type],De=({lightWeight:e=100,darkWeight:t=900}={})=>{const{palette:r}=y.useTheme();return"light"===r.mode?r.grey[e]:r.grey[t]},Ve=(e=12)=>{const t=(t,r,n)=>{const i=t[r];return t[r]+=n,t[r]>e?(t[r]=n,!1):(t[r]==e&&(t[r]=0),i>0)};return{xs:0,sm:0,md:0,lg:0,xl:0,increment:function({xs:e=0,sm:r=0,md:n=0,lg:i=0,xl:o=0}){const a=r||e,l=n||a,s=i||l,u=o||s;return{xs:t(this,"xs",e),sm:t(this,"sm",a),md:t(this,"md",l),lg:t(this,"lg",s),xl:t(this,"xl",u)}}}},Ae=({title:t,subtitle:r,centered:n,children:i,dense:o})=>{const{typography:a}=b.useTheme(),l=De({lightWeight:200,darkWeight:800});return e.jsxs(se.default,{sx:{paddingBottom:o?0:1},children:[e.jsxs(Z.default,{bgcolor:l,px:o?1:2,py:o?.5:1,lineHeight:o?0:void 0,children:[e.jsx(ue.default,{variant:o?"body1":"h6",role:"heading","aria-level":1,children:t}),r&&e.jsx(ue.default,{variant:o?"caption":"body2",role:"heading","aria-level":2,lineHeight:o?a.pxToRem(15):void 0,children:r})]}),e.jsx(Q.default,{container:!0,padding:1,rowSpacing:o?1:2,justifyContent:n?"center":"flex-start",children:i})]})},Fe=({field:t,path:r=[],value:n,dense:i,update:o,onChangeValue:a})=>{const l=e=>{e.preventDefault(),a([...r,e.target.name],e.target.checked)},s=e=>{e.preventDefault(),a([...r,e.target.name],e.target.value)},u=e=>{e.preventDefault();const{value:t}=e.target,n="string"==typeof t?t.split(","):t;a([...r,e.target.name],n)},c=(e,t)=>{e.preventDefault();let n=e.target.value;"number"===t&&"string"==typeof n?n=parseInt(e.target.value,10):t.includes("[]")&&(n=e.target.value.split(",")),a([...r,e.target.name],n)},d=(e,t)=>{a([...r,t],e)};De({lightWeight:200,darkWeight:800});const{id:f,type:p,name:y,description:h,updatable:x=!0,required:b=!0,xs:g,sm:v,md:j,lg:S,xl:w}=t,$=!x&&o;let C;const E=i?"small":"medium";if("group"===p)C=e.jsx(Ae,{title:y,subtitle:h,dense:i,children:e.jsx(Q.default,{container:!0,spacing:2,sx:{p:2},children:t.value.map((t=>e.jsx(Fe,{field:t,dense:i,path:[...r,f],value:n[t.id],update:o,onChangeValue:a},t.id)))})});else if("boolean"===p)C=e.jsx(Z.default,{sx:{height:1,display:"flex",alignItems:"center"},children:e.jsx(ee.default,{control:e.jsx(te.default,{name:f,size:E,onChange:l,checked:n,disabled:$}),label:y})});else if("enum"===p)C=e.jsxs(re.default,{fullWidth:!0,children:[e.jsx(ne.default,{id:`${f}-select-label`,children:y}),e.jsx(ie.default,{labelId:`${f}-select-label`,id:`${f}-select`,value:n,label:y,name:f,size:E,onChange:s,required:b,disabled:$,children:t.value.map((t=>e.jsx(oe.default,{value:t,children:t},t)))})]});else if("multienum"===p)C=e.jsxs(re.default,{fullWidth:!0,children:[e.jsx(ne.default,{id:`${f}-select-label`,children:y}),e.jsx(ie.default,{labelId:`${f}-select-label`,id:`${f}-select`,value:n||[],renderValue:e=>e.join(", "),label:y,name:f,size:E,onChange:u,required:b,disabled:$,multiple:!0,children:t.value.map((t=>e.jsxs(oe.default,{value:t,children:[e.jsx(te.default,{checked:(n||[]).includes(t)}),e.jsx(ae.default,{primary:t})]},t)))})]});else if("date"===p)C=e.jsx(m.DesktopDatePicker,{label:y,format:t.format,value:n,slotProps:{field:{size:E}},disabled:$,onChange:e=>d(e,f)});else if("time"===p)C=e.jsx(m.TimePicker,{label:y,format:t.format,value:n,slotProps:{field:{size:E}},disabled:$,onChange:e=>d(e,f)});else if("datetime"===p)C=e.jsx(m.DateTimePicker,{label:y,format:t.format,value:n,slotProps:{field:{size:E}},disabled:$,onChange:e=>d(e,f)});else{if("group[]"===p)return null;C=p.includes("[]")?e.jsx(le.default,{required:b,type:"text",label:y,name:f,size:E,variant:"outlined",helperText:"Use comas to separate multiple values",fullWidth:!0,disabled:$,value:n.join(","),onChange:e=>c(e,p)}):e.jsx(le.default,{required:b,type:p,label:y,size:E,name:f,variant:"outlined",fullWidth:!0,value:n,disabled:$,onChange:e=>c(e,p)})}return e.jsx(Q.default,{item:!0,xs:g,sm:v,md:j,lg:S,xl:w,children:C},f)};function Le(e){return null!=e&&"object"==typeof e&&!0===e["@@functional/placeholder"]}function We(e){return function t(r){return 0===arguments.length||Le(r)?t:e.apply(this,arguments)}}function Be(e){return function t(r,n){switch(arguments.length){case 0:return t;case 1:return Le(r)?t:We((function(t){return e(r,t)}));default:return Le(r)&&Le(n)?t:Le(r)?We((function(t){return e(t,n)})):Le(n)?We((function(t){return e(r,t)})):e(r,n)}}}function Ue(e){return function t(r,n,i){switch(arguments.length){case 0:return t;case 1:return Le(r)?t:Be((function(t,n){return e(r,t,n)}));case 2:return Le(r)&&Le(n)?t:Le(r)?Be((function(t,r){return e(t,n,r)})):Le(n)?Be((function(t,n){return e(r,t,n)})):We((function(t){return e(r,n,t)}));default:return Le(r)&&Le(n)&&Le(i)?t:Le(r)&&Le(n)?Be((function(t,r){return e(t,r,i)})):Le(r)&&Le(i)?Be((function(t,r){return e(t,n,r)})):Le(n)&&Le(i)?Be((function(t,n){return e(r,t,n)})):Le(r)?We((function(t){return e(t,n,i)})):Le(n)?We((function(t){return e(r,t,i)})):Le(i)?We((function(t){return e(r,n,t)})):e(r,n,i)}}}var Ye=Array.isArray||function(e){return null!=e&&e.length>=0&&"[object Array]"===Object.prototype.toString.call(e)};var He=Number.isInteger||function(e){return e<<0===e};var Je=We((function(e){return null==e})),Ge=Ue((function e(t,r,n){if(0===t.length)return r;var i=t[0];if(t.length>1){var o=!Je(n)&&function(e,t){return Object.prototype.hasOwnProperty.call(t,e)}(i,n)&&"object"==typeof n[i]?n[i]:He(t[1])?[]:{};r=e(Array.prototype.slice.call(t,1),r,o)}return function(e,t,r){if(He(e)&&Ye(r)){var n=[].concat(r);return n[e]=t,n}var i={};for(var o in r)i[o]=r[o];return i[e]=t,i}(i,r,n)}));const Xe=({model:t,saveButtonText:n,dense:i,onSubmit:o,initialValues:a})=>{const l=r.useMemo((()=>((e,t=undefined)=>{const r={};return e.fields.forEach((e=>{if("group"===e.type){const n={};e.value.forEach((r=>{n[r.id]=_e(r,t&&t[e.id])})),r[e.id]=n}else r[e.id]=_e(e,t)})),r})(t,a)),[t,a]),[s,u]=r.useState(l),c=(e,t)=>{u((r=>Ge(e,t,r)))};return e.jsxs(Q.default,{container:!0,component:"form",spacing:2,onSubmit:e=>{e.preventDefault(),o(s)},children:[t.fields.map((t=>e.jsx(Fe,{dense:i,field:t,value:s[t.id],update:!!a,onChangeValue:c},t.id))),e.jsx(Q.default,{item:!0,xs:12,children:e.jsx(K.default,{type:"submit",variant:"contained",size:i?"small":"medium",children:n})})]})},Ke=(e,n,{from:i,to:o})=>{const a=r.useRef(),l=t.useNavigate();r.useEffect((()=>{a.current===i&&n===o&&l(e),a.current=n}),[n])},Qe=()=>e.jsx(Z.default,{width:1,height:1,display:"flex",justifyContent:"center",alignItems:"center",children:e.jsx(de.default,{})}),Ze=r.createContext([0,()=>null]),et=Ze.Provider,tt=({children:t,initialValue:n=0})=>{const i=r.useState(n);return e.jsx(et,{value:i,children:t})},rt=({title:t,subtitle:r,icon:n,iconSize:i=200,actions:o})=>e.jsxs(Z.default,{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",textAlign:"center",children:[n&&n({size:i,color:"primary"}),e.jsx(ue.default,{variant:"h4",role:"heading","aria-level":1,children:t}),e.jsx(ue.default,{variant:"subtitle1",role:"heading","aria-level":2,sx:{mt:2},children:r}),o&&e.jsx(Z.default,{sx:{pt:2},children:o.map((({id:t,text:r,href:n,onClick:i},a)=>e.jsx(K.default,{role:"button",variant:"contained",href:n,onClick:i,sx:{mr:a<o.length-1?2:0},children:r},t)))})]}),nt=()=>e.jsx(fe.default,{color:"error",sx:{width:200,height:200}}),it=({loading:t,children:r,fetching:n,error:i})=>{const[o,a]=r;return e.jsx(tt,{children:e.jsxs(Z.default,{display:"flex",flexDirection:"column",height:1,children:[o,n&&e.jsx(Z.default,{width:1,children:e.jsx(ce.default,{})}),t&&e.jsx(Qe,{}),i&&e.jsx(Z.default,{mt:4,children:e.jsx(rt,{icon:i.icon||nt,title:i.title||"There has been an error",subtitle:i.message})}),!t&&!i&&a]})})},ot=new Error("NotificationCenterContext.Provider is required and was undefined"),at=r.createContext(void 0),lt=(e,t,{from:n,to:i})=>{const o=r.useRef(),{show:a}=(()=>{const e=r.useContext(at);if(void 0===e)throw ot;return e})();r.useEffect((()=>{o.current===n&&t===i&&a(e),o.current=t}),[t])},st=r.forwardRef(((r,n)=>{const{href:i,...o}=r;return e.jsx(t.Link,{ref:n,to:i,...o})})),ut=r.forwardRef(((t,r)=>e.jsx(xe.default,{...t,component:st}))),ct=({loading:t,children:r})=>{const{typography:n}=b.useTheme();return t?e.jsx(de.default,{color:"inherit",size:n.h4.fontSize,"aria-label":"title loading"}):"string"==typeof r?e.jsx(ue.default,{variant:"h4",role:"heading","aria-level":1,children:r}):e.jsx(e.Fragment,{children:r})},dt=({loading:t,children:r})=>{const{typography:n}=b.useTheme();return t?e.jsx(de.default,{color:"inherit",size:n.body1.fontSize,"aria-label":"subtitle loading"}):"string"==typeof r?e.jsx(ue.default,{variant:"body1",role:"heading","aria-level":2,children:r}):e.jsx(e.Fragment,{children:r})},ft=({title:n="",loadingTitle:i,subtitle:o,loadingSubtitle:a,preset:l="default",actionsVariant:s="outlined",breadcrumbs:u,actions:c,tabs:d,tabsMode:f="panel",navigationButton:p})=>{const m=(d||[]).map((e=>e.path)).filter(Boolean),{palette:y}=b.useTheme(),h=De(),[x,g]=r.useContext(Ze),v=(e=>{const{pathname:r}=t.useLocation();for(let n=0;n<e.length;n+=1){const i=e[n],o=t.matchPath(i,r);if(null!==o)return o}return null})(m),j={default:h,primary:y.primary.main,secondary:y.secondary.main,inherit:"inherit",transparent:"transparent"},S=j[l],w={default:y.getContrastText(j.default),primary:y.primary.contrastText,secondary:y.secondary.contrastText,inherit:"inherit",transparent:y.text.primary}[l],$="panel"===f?x:v?.pattern?.path;return e.jsx(Z.default,{bgcolor:S,color:w,children:e.jsxs(me.default,{children:[e.jsxs(Z.default,{sx:{py:3,display:"flex",flexDirection:"row",justifyContent:"space-between"},children:[e.jsxs(Z.default,{children:[p&&e.jsx(K.default,{href:p.href,size:"small",color:"inherit",LinkComponent:ut,startIcon:p.icon,sx:{mb:1},children:p.text}),u?.length&&e.jsx(pe.default,{color:"inherit",separator:"›","aria-label":"breadcrumb",sx:{marginTop:1},children:u.map((({id:t,link:r,text:n})=>e.jsx(ut,{underline:"hover",color:"inherit",href:r,variant:"body2",role:"link",children:n},t)))}),e.jsx(ct,{loading:i,children:n}),(o||a)&&e.jsx(dt,{loading:a,children:o})]}),c&&e.jsx(Z.default,{children:c.map((({disabled:t,id:r,href:n,onClick:i,text:o},a)=>e.jsx(K.default,{component:n?ut:"button",role:"button",color:"inherit",disabled:t,variant:s,size:"small",href:n,onClick:i,sx:{mr:a!=c.length-1?1:0},children:o},r)))})]}),d&&e.jsx(ye.default,{value:$,textColor:"inherit",onChange:"panel"===f?(e,t)=>g(t):void 0,children:d.map((({id:t,label:r,disabled:n,path:i,href:o})=>{const a={label:r,disabled:n};return"panel"===f?e.jsx(he.default,{...a},t):e.jsx(he.default,{...a,component:ut,href:o,value:i},t)}))})]})})},pt=({children:t})=>e.jsx(me.default,{component:"main",sx:{py:3,flexGrow:1},children:t}),mt=({model:n,modelName:i,basePath:o="",submitUpdateItemRequest:a,updateItemRequest:l,updateItem:s,onSubmitUpdateItem:u,onRequestUpdateItem:c})=>{const{id:d=""}=t.useParams(),f=l.loading||a.loading;return r.useEffect((()=>{c(d)}),[d]),lt({title:"Item updated",message:`The item ${d} has been updated successfully`,severity:"success"},!!a.success,{from:!1,to:!0}),Ke(`${o}/`,!!a.success,{from:!1,to:!0}),lt({title:"We had an error",message:a.error||"",severity:"error"},!!a.error,{from:!1,to:!0}),e.jsxs(it,{loading:f,children:[e.jsx(ft,{title:`Edit ${d}`,preset:"default",breadcrumbs:[{id:"list",text:i,link:`${o}/`},{id:"update",text:`Edit ${d}`,link:`${o}/${d}/update`}]}),e.jsx(pt,{children:e.jsx(Xe,{model:n,initialValues:s,saveButtonText:"Save",onSubmit:u})})]})};function yt(e,t){return"production"===process.env.NODE_ENV?()=>null:function(...r){return e(...r)||t(...r)}}var ht,xt={exports:{}},bt={exports:{}},gt={};var vt,jt,St,wt,$t,Ct,Et,kt,Tt,Pt,qt,Ot,It,Rt,Nt={};
-/** @license React v16.13.1
- * react-is.development.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */function Mt(){return jt||(jt=1,e=bt,"production"===process.env.NODE_ENV?e.exports=function(){if(ht)return gt;ht=1;var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,i=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,a=e?Symbol.for("react.provider"):60109,l=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,u=e?Symbol.for("react.concurrent_mode"):60111,c=e?Symbol.for("react.forward_ref"):60112,d=e?Symbol.for("react.suspense"):60113,f=e?Symbol.for("react.suspense_list"):60120,p=e?Symbol.for("react.memo"):60115,m=e?Symbol.for("react.lazy"):60116,y=e?Symbol.for("react.block"):60121,h=e?Symbol.for("react.fundamental"):60117,x=e?Symbol.for("react.responder"):60118,b=e?Symbol.for("react.scope"):60119;function g(e){if("object"==typeof e&&null!==e){var f=e.$$typeof;switch(f){case t:switch(e=e.type){case s:case u:case n:case o:case i:case d:return e;default:switch(e=e&&e.$$typeof){case l:case c:case m:case p:case a:return e;default:return f}}case r:return f}}}function v(e){return g(e)===u}return gt.AsyncMode=s,gt.ConcurrentMode=u,gt.ContextConsumer=l,gt.ContextProvider=a,gt.Element=t,gt.ForwardRef=c,gt.Fragment=n,gt.Lazy=m,gt.Memo=p,gt.Portal=r,gt.Profiler=o,gt.StrictMode=i,gt.Suspense=d,gt.isAsyncMode=function(e){return v(e)||g(e)===s},gt.isConcurrentMode=v,gt.isContextConsumer=function(e){return g(e)===l},gt.isContextProvider=function(e){return g(e)===a},gt.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},gt.isForwardRef=function(e){return g(e)===c},gt.isFragment=function(e){return g(e)===n},gt.isLazy=function(e){return g(e)===m},gt.isMemo=function(e){return g(e)===p},gt.isPortal=function(e){return g(e)===r},gt.isProfiler=function(e){return g(e)===o},gt.isStrictMode=function(e){return g(e)===i},gt.isSuspense=function(e){return g(e)===d},gt.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===u||e===o||e===i||e===d||e===f||"object"==typeof e&&null!==e&&(e.$$typeof===m||e.$$typeof===p||e.$$typeof===a||e.$$typeof===l||e.$$typeof===c||e.$$typeof===h||e.$$typeof===x||e.$$typeof===b||e.$$typeof===y)},gt.typeOf=g,gt}():e.exports=(vt||(vt=1,"production"!==process.env.NODE_ENV&&function(){var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,i=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,a=e?Symbol.for("react.provider"):60109,l=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,u=e?Symbol.for("react.concurrent_mode"):60111,c=e?Symbol.for("react.forward_ref"):60112,d=e?Symbol.for("react.suspense"):60113,f=e?Symbol.for("react.suspense_list"):60120,p=e?Symbol.for("react.memo"):60115,m=e?Symbol.for("react.lazy"):60116,y=e?Symbol.for("react.block"):60121,h=e?Symbol.for("react.fundamental"):60117,x=e?Symbol.for("react.responder"):60118,b=e?Symbol.for("react.scope"):60119;function g(e){if("object"==typeof e&&null!==e){var f=e.$$typeof;switch(f){case t:var y=e.type;switch(y){case s:case u:case n:case o:case i:case d:return y;default:var h=y&&y.$$typeof;switch(h){case l:case c:case m:case p:case a:return h;default:return f}}case r:return f}}}var v=s,j=u,S=l,w=a,$=t,C=c,E=n,k=m,T=p,P=r,q=o,O=i,I=d,R=!1;function N(e){return g(e)===u}Nt.AsyncMode=v,Nt.ConcurrentMode=j,Nt.ContextConsumer=S,Nt.ContextProvider=w,Nt.Element=$,Nt.ForwardRef=C,Nt.Fragment=E,Nt.Lazy=k,Nt.Memo=T,Nt.Portal=P,Nt.Profiler=q,Nt.StrictMode=O,Nt.Suspense=I,Nt.isAsyncMode=function(e){return R||(R=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),N(e)||g(e)===s},Nt.isConcurrentMode=N,Nt.isContextConsumer=function(e){return g(e)===l},Nt.isContextProvider=function(e){return g(e)===a},Nt.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Nt.isForwardRef=function(e){return g(e)===c},Nt.isFragment=function(e){return g(e)===n},Nt.isLazy=function(e){return g(e)===m},Nt.isMemo=function(e){return g(e)===p},Nt.isPortal=function(e){return g(e)===r},Nt.isProfiler=function(e){return g(e)===o},Nt.isStrictMode=function(e){return g(e)===i},Nt.isSuspense=function(e){return g(e)===d},Nt.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===u||e===o||e===i||e===d||e===f||"object"==typeof e&&null!==e&&(e.$$typeof===m||e.$$typeof===p||e.$$typeof===a||e.$$typeof===l||e.$$typeof===c||e.$$typeof===h||e.$$typeof===x||e.$$typeof===b||e.$$typeof===y)},Nt.typeOf=g}()),Nt)),bt.exports;var e}
-/*
-object-assign
-(c) Sindre Sorhus
-@license MIT
-*/function zt(){if(wt)return St;wt=1;var e=Object.getOwnPropertySymbols,t=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;return St=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;r<10;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var n={};return"abcdefghijklmnopqrst".split("").forEach((function(e){n[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},n)).join("")}catch(e){return!1}}()?Object.assign:function(n,i){for(var o,a,l=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(n),s=1;s<arguments.length;s++){for(var u in o=Object(arguments[s]))t.call(o,u)&&(l[u]=o[u]);if(e){a=e(o);for(var c=0;c<a.length;c++)r.call(o,a[c])&&(l[a[c]]=o[a[c]])}}return l},St}function _t(){if(Ct)return $t;Ct=1;return $t="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}function Dt(){return kt?Et:(kt=1,Et=Function.call.bind(Object.prototype.hasOwnProperty))}if("production"!==process.env.NODE_ENV){var Vt=Mt();xt.exports=function(){if(Ot)return qt;Ot=1;var e=Mt(),t=zt(),r=_t(),n=Dt(),i=function(){if(Pt)return Tt;Pt=1;var e=function(){};if("production"!==process.env.NODE_ENV){var t=_t(),r={},n=Dt();e=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}}function i(i,o,a,l,s){if("production"!==process.env.NODE_ENV)for(var u in i)if(n(i,u)){var c;try{if("function"!=typeof i[u]){var d=Error((l||"React class")+": "+a+" type `"+u+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof i[u]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw d.name="Invariant Violation",d}c=i[u](o,u,l,a,null,t)}catch(e){c=e}if(!c||c instanceof Error||e((l||"React class")+": type specification of "+a+" `"+u+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof c+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),c instanceof Error&&!(c.message in r)){r[c.message]=!0;var f=s?s():"";e("Failed "+a+" type: "+c.message+(null!=f?f:""))}}}return i.resetWarningCache=function(){"production"!==process.env.NODE_ENV&&(r={})},Tt=i}(),o=function(){};function a(){return null}return"production"!==process.env.NODE_ENV&&(o=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}),qt=function(l,s){var u="function"==typeof Symbol&&Symbol.iterator,c="@@iterator",d="<<anonymous>>",f={array:h("array"),bigint:h("bigint"),bool:h("boolean"),func:h("function"),number:h("number"),object:h("object"),string:h("string"),symbol:h("symbol"),any:y(a),arrayOf:function(e){return y((function(t,n,i,o,a){if("function"!=typeof e)return new m("Property `"+a+"` of component `"+i+"` has invalid PropType notation inside arrayOf.");var l=t[n];if(!Array.isArray(l))return new m("Invalid "+o+" `"+a+"` of type `"+g(l)+"` supplied to `"+i+"`, expected an array.");for(var s=0;s<l.length;s++){var u=e(l,s,i,o,a+"["+s+"]",r);if(u instanceof Error)return u}return null}))},element:y((function(e,t,r,n,i){var o=e[t];return l(o)?null:new m("Invalid "+n+" `"+i+"` of type `"+g(o)+"` supplied to `"+r+"`, expected a single ReactElement.")})),elementType:y((function(t,r,n,i,o){var a=t[r];return e.isValidElementType(a)?null:new m("Invalid "+i+" `"+o+"` of type `"+g(a)+"` supplied to `"+n+"`, expected a single ReactElement type.")})),instanceOf:function(e){return y((function(t,r,n,i,o){if(!(t[r]instanceof e)){var a=e.name||d;return new m("Invalid "+i+" `"+o+"` of type `"+((l=t[r]).constructor&&l.constructor.name?l.constructor.name:d)+"` supplied to `"+n+"`, expected instance of `"+a+"`.")}var l;return null}))},node:y((function(e,t,r,n,i){return b(e[t])?null:new m("Invalid "+n+" `"+i+"` supplied to `"+r+"`, expected a ReactNode.")})),objectOf:function(e){return y((function(t,i,o,a,l){if("function"!=typeof e)return new m("Property `"+l+"` of component `"+o+"` has invalid PropType notation inside objectOf.");var s=t[i],u=g(s);if("object"!==u)return new m("Invalid "+a+" `"+l+"` of type `"+u+"` supplied to `"+o+"`, expected an object.");for(var c in s)if(n(s,c)){var d=e(s,c,o,a,l+"."+c,r);if(d instanceof Error)return d}return null}))},oneOf:function(e){return Array.isArray(e)?y((function(t,r,n,i,o){for(var a=t[r],l=0;l<e.length;l++)if(p(a,e[l]))return null;var s=JSON.stringify(e,(function(e,t){return"symbol"===v(t)?String(t):t}));return new m("Invalid "+i+" `"+o+"` of value `"+String(a)+"` supplied to `"+n+"`, expected one of "+s+".")})):("production"!==process.env.NODE_ENV&&o(arguments.length>1?"Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).":"Invalid argument supplied to oneOf, expected an array."),a)},oneOfType:function(e){if(!Array.isArray(e))return"production"!==process.env.NODE_ENV&&o("Invalid argument supplied to oneOfType, expected an instance of array."),a;for(var t=0;t<e.length;t++){var i=e[t];if("function"!=typeof i)return o("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+j(i)+" at index "+t+"."),a}return y((function(t,i,o,a,l){for(var s=[],u=0;u<e.length;u++){var c=(0,e[u])(t,i,o,a,l,r);if(null==c)return null;c.data&&n(c.data,"expectedType")&&s.push(c.data.expectedType)}return new m("Invalid "+a+" `"+l+"` supplied to `"+o+"`"+(s.length>0?", expected one of type ["+s.join(", ")+"]":"")+".")}))},shape:function(e){return y((function(t,n,i,o,a){var l=t[n],s=g(l);if("object"!==s)return new m("Invalid "+o+" `"+a+"` of type `"+s+"` supplied to `"+i+"`, expected `object`.");for(var u in e){var c=e[u];if("function"!=typeof c)return x(i,o,a,u,v(c));var d=c(l,u,i,o,a+"."+u,r);if(d)return d}return null}))},exact:function(e){return y((function(i,o,a,l,s){var u=i[o],c=g(u);if("object"!==c)return new m("Invalid "+l+" `"+s+"` of type `"+c+"` supplied to `"+a+"`, expected `object`.");var d=t({},i[o],e);for(var f in d){var p=e[f];if(n(e,f)&&"function"!=typeof p)return x(a,l,s,f,v(p));if(!p)return new m("Invalid "+l+" `"+s+"` key `"+f+"` supplied to `"+a+"`.\nBad object: "+JSON.stringify(i[o],null,"  ")+"\nValid keys: "+JSON.stringify(Object.keys(e),null,"  "));var y=p(u,f,a,l,s+"."+f,r);if(y)return y}return null}))}};function p(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}function m(e,t){this.message=e,this.data=t&&"object"==typeof t?t:{},this.stack=""}function y(e){if("production"!==process.env.NODE_ENV)var t={},n=0;function i(i,a,l,u,c,f,p){if(u=u||d,f=f||l,p!==r){if(s){var y=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw y.name="Invariant Violation",y}if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var h=u+":"+l;!t[h]&&n<3&&(o("You are manually calling a React.PropTypes validation function for the `"+f+"` prop on `"+u+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),t[h]=!0,n++)}}return null==a[l]?i?null===a[l]?new m("The "+c+" `"+f+"` is marked as required in `"+u+"`, but its value is `null`."):new m("The "+c+" `"+f+"` is marked as required in `"+u+"`, but its value is `undefined`."):null:e(a,l,u,c,f)}var a=i.bind(null,!1);return a.isRequired=i.bind(null,!0),a}function h(e){return y((function(t,r,n,i,o,a){var l=t[r];return g(l)!==e?new m("Invalid "+i+" `"+o+"` of type `"+v(l)+"` supplied to `"+n+"`, expected `"+e+"`.",{expectedType:e}):null}))}function x(e,t,r,n,i){return new m((e||"React class")+": "+t+" type `"+r+"."+n+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+i+"`.")}function b(e){switch(typeof e){case"number":case"string":case"undefined":return!0;case"boolean":return!e;case"object":if(Array.isArray(e))return e.every(b);if(null===e||l(e))return!0;var t=function(e){var t=e&&(u&&e[u]||e[c]);if("function"==typeof t)return t}(e);if(!t)return!1;var r,n=t.call(e);if(t!==e.entries){for(;!(r=n.next()).done;)if(!b(r.value))return!1}else for(;!(r=n.next()).done;){var i=r.value;if(i&&!b(i[1]))return!1}return!0;default:return!1}}function g(e){var t=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,t){return"symbol"===e||!!t&&("Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol)}(t,e)?"symbol":t}function v(e){if(null==e)return""+e;var t=g(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function j(e){var t=v(e);switch(t){case"array":case"object":return"an "+t;case"boolean":case"date":case"regexp":return"a "+t;default:return t}}return m.prototype=Error.prototype,f.checkPropTypes=i,f.resetWarningCache=i.resetWarningCache,f.PropTypes=f,f},qt}()(Vt.isElement,!0)}else xt.exports=function(){if(Rt)return It;Rt=1;var e=_t();function t(){}function r(){}return r.resetWarningCache=t,It=function(){function n(t,r,n,i,o,a){if(a!==e){var l=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw l.name="Invariant Violation",l}}function i(){return n}n.isRequired=n;var o={array:n,bigint:n,bool:n,func:n,number:n,object:n,string:n,symbol:n,any:n,arrayOf:i,element:n,elementType:n,instanceOf:i,node:n,objectOf:i,oneOf:i,oneOfType:i,shape:i,exact:i,checkPropTypes:r,resetWarningCache:t};return o.PropTypes=o,o}}()();function At(e,t,r,n,i){const o=e[t],a=i||t;if(null==o||"undefined"==typeof window)return null;let l;const s=o.type;return"function"!=typeof s||function(e){const{prototype:t={}}=e;return Boolean(t.isReactComponent)}(s)||(l="Did you accidentally use a plain function component for an element instead?"),void 0!==l?new Error(`Invalid ${n} \`${a}\` supplied to \`${r}\`. Expected an element that can hold a ref. ${l} For more information see https://mui.com/r/caveat-with-refs-guide`):null}yt(xt.exports.element,At).isRequired=yt(xt.exports.element.isRequired,At),yt(xt.exports.elementType,(function(e,t,r,n,i){const o=e[t],a=i||t;if(null==o||"undefined"==typeof window)return null;let l;return"function"!=typeof o||function(e){const{prototype:t={}}=e;return Boolean(t.isReactComponent)}(o)||(l="Did you accidentally provide a plain function component instead?"),void 0!==l?new Error(`Invalid ${n} \`${a}\` supplied to \`${r}\`. Expected an element type that can hold a ref. ${l} For more information see https://mui.com/r/caveat-with-refs-guide`):null}));var Ft,Lt={};var Wt,Bt,Ut={};
-/**
- * @license React
- * react-is.development.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */Bt={exports:{}},"production"===process.env.NODE_ENV?Bt.exports=function(){if(Ft)return Lt;Ft=1;var e,t=Symbol.for("react.element"),r=Symbol.for("react.portal"),n=Symbol.for("react.fragment"),i=Symbol.for("react.strict_mode"),o=Symbol.for("react.profiler"),a=Symbol.for("react.provider"),l=Symbol.for("react.context"),s=Symbol.for("react.server_context"),u=Symbol.for("react.forward_ref"),c=Symbol.for("react.suspense"),d=Symbol.for("react.suspense_list"),f=Symbol.for("react.memo"),p=Symbol.for("react.lazy"),m=Symbol.for("react.offscreen");function y(e){if("object"==typeof e&&null!==e){var m=e.$$typeof;switch(m){case t:switch(e=e.type){case n:case o:case i:case c:case d:return e;default:switch(e=e&&e.$$typeof){case s:case l:case u:case p:case f:case a:return e;default:return m}}case r:return m}}}return e=Symbol.for("react.module.reference"),Lt.ContextConsumer=l,Lt.ContextProvider=a,Lt.Element=t,Lt.ForwardRef=u,Lt.Fragment=n,Lt.Lazy=p,Lt.Memo=f,Lt.Portal=r,Lt.Profiler=o,Lt.StrictMode=i,Lt.Suspense=c,Lt.SuspenseList=d,Lt.isAsyncMode=function(){return!1},Lt.isConcurrentMode=function(){return!1},Lt.isContextConsumer=function(e){return y(e)===l},Lt.isContextProvider=function(e){return y(e)===a},Lt.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Lt.isForwardRef=function(e){return y(e)===u},Lt.isFragment=function(e){return y(e)===n},Lt.isLazy=function(e){return y(e)===p},Lt.isMemo=function(e){return y(e)===f},Lt.isPortal=function(e){return y(e)===r},Lt.isProfiler=function(e){return y(e)===o},Lt.isStrictMode=function(e){return y(e)===i},Lt.isSuspense=function(e){return y(e)===c},Lt.isSuspenseList=function(e){return y(e)===d},Lt.isValidElementType=function(t){return"string"==typeof t||"function"==typeof t||t===n||t===o||t===i||t===c||t===d||t===m||"object"==typeof t&&null!==t&&(t.$$typeof===p||t.$$typeof===f||t.$$typeof===a||t.$$typeof===l||t.$$typeof===u||t.$$typeof===e||void 0!==t.getModuleId)},Lt.typeOf=y,Lt}():Bt.exports=(Wt||(Wt=1,"production"!==process.env.NODE_ENV&&function(){var e,t=Symbol.for("react.element"),r=Symbol.for("react.portal"),n=Symbol.for("react.fragment"),i=Symbol.for("react.strict_mode"),o=Symbol.for("react.profiler"),a=Symbol.for("react.provider"),l=Symbol.for("react.context"),s=Symbol.for("react.server_context"),u=Symbol.for("react.forward_ref"),c=Symbol.for("react.suspense"),d=Symbol.for("react.suspense_list"),f=Symbol.for("react.memo"),p=Symbol.for("react.lazy"),m=Symbol.for("react.offscreen");function y(e){if("object"==typeof e&&null!==e){var m=e.$$typeof;switch(m){case t:var y=e.type;switch(y){case n:case o:case i:case c:case d:return y;default:var h=y&&y.$$typeof;switch(h){case s:case l:case u:case p:case f:case a:return h;default:return m}}case r:return m}}}e=Symbol.for("react.module.reference");var h=l,x=a,b=t,g=u,v=n,j=p,S=f,w=r,$=o,C=i,E=c,k=d,T=!1,P=!1;Ut.ContextConsumer=h,Ut.ContextProvider=x,Ut.Element=b,Ut.ForwardRef=g,Ut.Fragment=v,Ut.Lazy=j,Ut.Memo=S,Ut.Portal=w,Ut.Profiler=$,Ut.StrictMode=C,Ut.Suspense=E,Ut.SuspenseList=k,Ut.isAsyncMode=function(e){return T||(T=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 18+.")),!1},Ut.isConcurrentMode=function(e){return P||(P=!0,console.warn("The ReactIs.isConcurrentMode() alias has been deprecated, and will be removed in React 18+.")),!1},Ut.isContextConsumer=function(e){return y(e)===l},Ut.isContextProvider=function(e){return y(e)===a},Ut.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Ut.isForwardRef=function(e){return y(e)===u},Ut.isFragment=function(e){return y(e)===n},Ut.isLazy=function(e){return y(e)===p},Ut.isMemo=function(e){return y(e)===f},Ut.isPortal=function(e){return y(e)===r},Ut.isProfiler=function(e){return y(e)===o},Ut.isStrictMode=function(e){return y(e)===i},Ut.isSuspense=function(e){return y(e)===c},Ut.isSuspenseList=function(e){return y(e)===d},Ut.isValidElementType=function(t){return"string"==typeof t||"function"==typeof t||t===n||t===o||t===i||t===c||t===d||t===m||"object"==typeof t&&null!==t&&(t.$$typeof===p||t.$$typeof===f||t.$$typeof===a||t.$$typeof===l||t.$$typeof===u||t.$$typeof===e||void 0!==t.getModuleId)},Ut.typeOf=y}()),Ut),"undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")(),xt.exports.oneOfType([xt.exports.func,xt.exports.object]);const Yt={border:0,clip:"rect(0 0 0 0)",height:"1px",margin:-1,overflow:"hidden",padding:0,position:"absolute",whiteSpace:"nowrap",width:"1px"};const Ht=Number.isInteger||function(e){return"number"==typeof e&&isFinite(e)&&Math.floor(e)===e};function Jt(e,t,r,n){const i=e[t];if(null==i||!Ht(i)){const e=function(e){const t=typeof e;switch(t){case"number":return Number.isNaN(e)?"NaN":Number.isFinite(e)?e!==Math.floor(e)?"float":"number":"Infinity";case"object":return null===e?"null":e.constructor.name;default:return t}}(i);return new RangeError(`Invalid ${n} \`${t}\` of type \`${e}\` supplied to \`${r}\`, expected \`integer\`.`)}return null}function Gt(e,t,...r){return void 0===e[t]?null:Jt(e,t,...r)}function Xt(){return null}Gt.isRequired=Jt,Xt.isRequired=Xt,process.env.NODE_ENV;const Kt=({order:t,orderBy:r,headCells:n,onRequestSort:i})=>e.jsx(Te.default,{children:e.jsx(be.default,{children:n.map((n=>{return e.jsx(ge.default,{variant:"head",padding:n.disablePadding?"none":"normal",sortDirection:r===n.id&&t,sx:{fontWeight:"bold"},children:n.sort?e.jsxs(ke.default,{active:r===n.id,direction:r===n.id?t:"asc",onClick:(o=n.id,()=>{i(o)}),children:[n.label,r===n.id?e.jsx(Z.default,{component:"span",sx:Yt,children:"desc"===t?"sorted descending":"sorted ascending"}):null]}):n.label},String(n.id));var o}))})});function Qt(e,t,r){return t[r]<e[r]?-1:t[r]>e[r]?1:0}const Zt=({children:t,data:n,search:i,columns:o,defaultSort:a,defaultOrder:l="asc",loading:s=!1})=>{const[u,c]=r.useState(""),[d,f]=r.useState(l),[p,m]=r.useState(a),y=n.slice().filter(function(e,t){return r=>!t||e.some((e=>{let n=r[e.id];return n?.toLowerCase&&(n=n.toLowerCase()),n?.toString().includes(t.toLowerCase())}))}(o,u)).sort(function(e,t){return"desc"===e?(e,r)=>Qt(e,r,t):(e,r)=>-Qt(e,r,t)}(d,p));return e.jsx(e.Fragment,{children:e.jsxs(Z.default,{sx:{paddingX:1,paddingBottom:2},children:[i&&e.jsx(Z.default,{paddingY:2,children:e.jsx(le.default,{fullWidth:!0,placeholder:"Search",InputProps:{role:"search",startAdornment:e.jsx($e.default,{position:"start",children:e.jsx(Ee.default,{})})},onChange:e=>c(e.target.value)})}),e.jsx(Se.default,{children:e.jsxs(Ce.default,{children:[e.jsx(Kt,{order:d,orderBy:p,headCells:o,onRequestSort:e=>{f(p===e&&"asc"===d?"desc":"asc"),m(e)}}),e.jsx(we.default,{children:s?e.jsx(be.default,{children:e.jsx(ge.default,{colSpan:o.length,sx:{textAlign:"center"},children:e.jsx(de.default,{})})}):0===y.length?e.jsx(be.default,{children:e.jsx(ge.default,{colSpan:o.length,sx:{textAlign:"center"},children:"No data"})}):t(y)})]})})]})})};Zt.defaultProps={defaultOrder:"asc"};const er=({columns:t,options:n,data:i,onClick:o,search:a,defaultSort:l,defaultOrder:s,loading:u})=>{const c=[...t,{id:"__options",label:"",disablePadding:!1,numeric:!1,sort:!1}],[d,f]=r.useState(null);return e.jsxs(e.Fragment,{children:[e.jsx(Zt,{columns:c,data:i,search:a,defaultSort:l,defaultOrder:s,loading:u,children:t=>t.map(((t,r)=>e.jsxs(be.default,{onClick:()=>o&&o(t),role:"row","aria-rowindex":r,sx:{cursor:o&&"pointer"},children:[c.map((({id:n},i)=>e.jsx(ge.default,{role:"cell",scope:"row","aria-rowindex":r,"aria-colindex":i,children:t[n]},n.toString()))),n&&e.jsx(ge.default,{children:e.jsx(ve.default,{"data-testid":`options-${t.id}`,onClick:e=>{e.stopPropagation(),f({item:t,anchor:e.currentTarget})},children:e.jsx(Pe.default,{})})})]},t.id)))}),n&&e.jsx(je.default,{anchorEl:d?.anchor,open:!!d,onClose:()=>f(null),anchorOrigin:{vertical:"top",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},children:n.map((({id:t,label:r,onClick:n})=>e.jsx(oe.default,{onClick:()=>{d&&n(d?.item),f(null)},children:r},t)))})]})},tr=({model:n,modelName:i,listData:o,listRequest:a,deleteRequest:l,basePath:s="",deleteFeature:u=!0,updateFeature:c=!0,addFeature:d=!0,detailsFeature:f=!0,onRequestList:p,onClickDeleteItem:m})=>{const y=t.useNavigate();r.useEffect((()=>{p()}),[]),lt({title:"Item deleted",message:"The item has been deleted successfully",severity:"success"},!!l.success,{from:!1,to:!0}),lt({title:"We had an error",message:l.error||"",severity:"error"},!!l.error,{from:!1,to:!0});const h=f?e=>{y(`${s}/${e.id}`)}:void 0,x=(e,t)=>{"edit"===e?y(`${s}/${t.id}/update`):m(t)},b=[];c&&b.push({id:"edit",label:"Edit",onClick:e=>x("edit",e)}),u&&b.push({id:"remove",label:"Remove",onClick:e=>x("remove",e)});const g=[];return d&&g.push({id:"add",text:"Add",href:`${s}/add`}),e.jsxs(it,{loading:a.loading||l.loading,children:[e.jsx(ft,{title:i,preset:"default",actions:g.length>0?g:void 0}),e.jsx(pt,{children:e.jsx(er,{columns:n.fields.filter((({listable:e})=>e)).map((({id:e,name:t,type:r})=>({disablePadding:!1,id:e,label:t,numeric:"number"===r,sort:!1}))),data:o,defaultSort:n.fields[0].id,onClick:h,options:b.length>0?b:void 0})})]})},rr=({model:t,modelName:r,basePath:n="",onSubmitNewItem:i,newItemRequest:o})=>(lt({message:"Item added successfully",severity:"success"},!!o.success,{from:!1,to:!0}),Ke(`${n}/`,!!o.success,{from:!1,to:!0}),lt({title:"We had an error",message:o.error||"",severity:"error"},!!o.error,{from:!1,to:!0}),e.jsxs(it,{loading:o.loading,children:[e.jsx(ft,{title:`Add ${r}`,preset:"default",breadcrumbs:[{id:"list",text:r,link:`${n}/`},{id:"add",text:`Add new ${r}`,link:`${n}/add`}]}),e.jsx(pt,{children:e.jsx(Xe,{model:t,saveButtonText:"Save",onSubmit:i})})]})),nr=({onClickCancel:t,onClickSubmit:r,sx:n})=>e.jsxs($e.default,{position:"end",sx:n,children:[e.jsx(K.default,{variant:"contained",size:"small",color:"error","aria-label":"cancel button",startIcon:e.jsx(Re.default,{sx:{fontSize:12}}),onClick:t,sx:{paddingRight:0,minWidth:0,marginRight:1}}),e.jsx(K.default,{variant:"contained",size:"small",color:"primary","aria-label":"submit button",startIcon:e.jsx(Oe.default,{sx:{fontSize:12}}),onClick:r,sx:{paddingRight:0,minWidth:0}})]}),ir=(e,t)=>{const[n,i]=r.useState(!1),[o,a]=r.useState(e),l=()=>{i(!1),a(e)};return{isEditing:n,cancelEdit:l,editValue:o,setEditValue:a,startEdit:()=>{i(!0)},submitEdit:()=>{t(o),l()}}},or=({dense:t,onClick:r})=>{const{typography:n}=b.useTheme();return e.jsx(ve.default,{size:"small",onClick:r,sx:{ml:t?.5:1},"aria-label":"edit button",children:e.jsx(Ne.default,{sx:{fontSize:n.pxToRem(t?18:24)}})})},ar=e=>`label-${e.replace(/ /g,"-")}`,lr=({label:t,hideLabel:r,tooltip:n,tooltipEnterDelay:i=2e3,children:o,dense:a,sx:l})=>{const{typography:s}=b.useTheme(),u=ar(t);return e.jsxs(Z.default,{width:1,lineHeight:a?0:void 0,sx:l,children:[!r&&e.jsx(ue.default,{variant:a?"caption":"subtitle2",role:"label",id:u,lineHeight:a?s.pxToRem(15):void 0,children:t}),n?e.jsx(Me.default,{title:n,placement:"top",enterDelay:i,children:o}):o]})},sr=({label:t,value:r,placeholder:n="-",editable:i,dense:o,onEdit:a=(()=>null)})=>{const l=ar(t),{typography:s}=b.useTheme(),{isEditing:u,editValue:c,startEdit:d,cancelEdit:f,setEditValue:p,submitEdit:m}=ir(r,a),y={fontSize:o?s.h6.fontSize:s.h5.fontSize};return e.jsx(lr,{label:t,dense:o,children:u?e.jsxs(Z.default,{display:"flex",alignItems:"center",children:[e.jsx(qe.default,{size:o?"small":"medium",checked:c,onChange:e=>p(e.target.checked)}),e.jsx(nr,{onClickCancel:f,onClickSubmit:m})]}):e.jsxs(Z.default,{display:"flex",alignItems:"center","aria-labelledby":l,role:"checkbox","aria-checked":r,children:[void 0===r?e.jsx(ue.default,{variant:"h5",children:n}):r?e.jsx(Oe.default,{color:"success",sx:y}):e.jsx(Ie.default,{color:"error",sx:y}),i&&e.jsx(or,{dense:o,onClick:d})]})})},ur=({label:t,value:r,format:n,placeholder:i="-",editable:o,editInputType:a="datetime",dense:l,onEdit:s=(()=>null)})=>{const{isEditing:u,editValue:c,startEdit:d,cancelEdit:f,setEditValue:p,submitEdit:m}=ir(r,s),y=ar(t),h=r&&U.format(r,n)||i,x="datetime"===a?H.DateTimePicker:"time"===a?J.TimePicker:Y.DatePicker;return e.jsx(lr,{label:t,hideLabel:u,tooltip:h,dense:l,sx:{display:"flex",flexDirection:"column"},children:u?e.jsx(x,{value:c,format:n,label:t,onChange:e=>p(e||void 0),slots:{textField:t=>e.jsx(le.default,{...t,size:"small",InputProps:{...t.InputProps,endAdornment:e.jsxs(e.Fragment,{children:[t.InputProps?.endAdornment,e.jsx(nr,{onClickCancel:f,onClickSubmit:m,sx:{ml:2}})]}),sx:{marginY:l?.2:1}}})}}):e.jsxs(Z.default,{display:"flex",alignItems:"center","aria-labelledby":y,children:[e.jsx(ue.default,{variant:l?"body1":"h5",noWrap:!0,children:h}),o&&e.jsx(or,{dense:l,onClick:d})]})})},cr=({label:t,value:n,placeholder:i="-",editable:o,dense:a,onEdit:l=(()=>null)})=>{const s=r.useRef(null),{isEditing:u,editValue:c,startEdit:d,cancelEdit:f,setEditValue:p,submitEdit:m}=ir(n?.toString(),l),y=ar(t),h=n?.toString()||i,x=e=>{"Enter"===e.key&&l(e.target.value)};return r.useEffect((()=>(s.current?.addEventListener("keypress",x),()=>s.current?.removeEventListener("keypress",x))),[s.current]),e.jsx(lr,{hideLabel:u,label:t,tooltip:h,dense:a,children:u?e.jsx(le.default,{inputRef:s,value:c,label:t,size:"small",onChange:e=>p(e.target.value),InputProps:{endAdornment:e.jsx(nr,{onClickCancel:f,onClickSubmit:m})},sx:{marginY:a?0:1}}):e.jsxs(Z.default,{display:"flex","aria-labelledby":y,children:[e.jsx(ue.default,{variant:a?"body1":"h5",noWrap:!0,children:h}),o&&e.jsx(or,{dense:a,onClick:d})]})})},dr="RdsValueItem-root",fr="RdsValueItem-content",pr=({children:t,bordered:r=!0,...n})=>{const i=((e,t)=>{const r=`solid ${t} 1px`,n="none";if(e){if(Array.isArray(e))return e.map((e=>e?r:n));if("object"==typeof e){const t={};return Object.entries(e).forEach((([e,i])=>{t[e]=i?r:n})),t}return r}})(r,De({lightWeight:200,darkWeight:800}));return e.jsx(Q.default,{item:!0,className:dr,...n,children:e.jsx(Z.default,{className:fr,px:1,borderLeft:i,children:t})})},mr=(t,r,{dense:n}={})=>{const{id:i,name:o,type:a}=t,l=r[i];return"boolean"===a?e.jsx(sr,{dense:n,label:o,value:l}):"date"===a||"time"===a||"datetime"===a?e.jsx(ur,{dense:n,label:o,value:l,format:t.format}):"object"!=typeof l||Array.isArray(l)?e.jsx(cr,{dense:n,label:o,value:l?.toString()}):e.jsx(cr,{dense:n,label:o,value:JSON.stringify(l)})},yr=({field:{name:t,description:r,value:n},instance:i,dense:o})=>{const a=[{field:"id",headerName:"ID",width:70}];n.forEach((e=>{a.push({field:e.id,headerName:e.name})}));const l=i.map(((e,t)=>({id:t,...e})));return e.jsx(Ae,{title:t,subtitle:r,dense:o,children:e.jsx(Q.default,{item:!0,xs:12,children:e.jsx(G.DataGrid,{rows:l,columns:a,density:o?"compact":"standard",disableRowSelectionOnClick:!0,pageSizeOptions:[5],initialState:{pagination:{paginationModel:{pageSize:5}}},sx:{height:400}})})})},hr=({field:{name:t,description:r,value:n},instance:i,dense:o})=>{const a=Ve();return e.jsx(Ae,{title:t,subtitle:r,dense:o,children:n.map((t=>{const{id:r,xs:n,sm:l,md:s,lg:u,xl:c}=t,d=a.increment(t);return e.jsx(pr,{xs:n,sm:l,md:s,lg:u,xl:c,bordered:d,children:mr(t,i,{dense:o})},r)}))})},xr=({model:t,instance:r,dense:n})=>{const i=Ve();return e.jsx(Q.default,{container:!0,spacing:n?1:2,children:t.fields.map((t=>{const{id:o,type:a,xs:l=3,sm:s=0,md:u=0,lg:c=0,xl:d=0}=t;if("group"===a)return i.increment({xs:12}),e.jsx(Q.default,{item:!0,xs:12,children:e.jsx(hr,{field:t,instance:r[o],dense:n})},o);if("group[]"===a)return i.increment({xs:12}),e.jsx(Q.default,{item:!0,xs:12,children:e.jsx(yr,{field:t,instance:r[o],dense:n})},o);const f=i.increment(t);return e.jsx(pr,{xs:l,sm:s,md:u,lg:c,xl:d,bordered:f,children:mr(t,r,{dense:n})},o)}))})},br=({model:n,modelName:i,basePath:o="",onRequestItem:a,itemRequest:l,detailsItem:s})=>{const{id:u=""}=t.useParams();return r.useEffect((()=>{a(u)}),[u]),e.jsxs(it,{loading:l.loading,children:[e.jsx(ft,{title:u,preset:"default",breadcrumbs:[{id:"list",text:i,link:`${o}/`},{id:"detail",text:u,link:`${o}/${u}`}]}),e.jsx(pt,{children:s&&e.jsx(xr,{model:n,instance:s})})]})};exports.IdleRequest={idle:!0},exports.LoadingRequest={loading:!0},exports.ModelRouter=r=>{const{updateFeature:n=!0,addFeature:i=!0,detailsFeature:o=!0}=r;return e.jsxs(t.Routes,{children:[e.jsx(t.Route,{path:"",element:e.jsx(tr,{...r})}),o&&e.jsx(t.Route,{path:":id",element:e.jsx(br,{...r})}),i&&e.jsx(t.Route,{path:"add",element:e.jsx(rr,{...r})}),n&&e.jsx(t.Route,{path:":id/update",element:e.jsx(mt,{...r})})]})},exports.SuccessRequest={success:!0};
-//# sourceMappingURL=index.js.map