@portnet/ui 0.0.18

package/dist/components/table/PuiTable.js

@@ -0,0 +1,352 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.symbol.description.js");
+var _MoreVert = _interopRequireDefault(require("@mui/icons-material/MoreVert"));
+var _material = require("@mui/material");
+var _styles = require("@mui/material/styles");
+var _xDataGrid = require("@mui/x-data-grid");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var React = _interopRequireWildcard(require("react"));
+var _apperance = require("../../config/apperance");
+var _PuiCheckbox = _interopRequireDefault(require("../inputs/PuiCheckbox"));
+var _PuiIcon = _interopRequireDefault(require("../others/PuiIcon"));
+var _PuiTooltip = _interopRequireDefault(require("../others/PuiTooltip"));
+var _PuiTableAction = _interopRequireDefault(require("./PuiTableAction"));
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["id", "className", "sx", "elevate", "rows", "rowCount", "columns", "paginationMode", "page", "pageSize", "checkboxSelection", "loading", "stripped", "actions", "oneActionOnly", "onSelect", "onPageChange", "onPageSizeChange"];
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const StyledMuiTable = (0, _styles.styled)( /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_xDataGrid.DataGrid, _objectSpread({
+  ref: ref
+}, props))))(() => {
+  return {
+    "&.MuiDataGrid-root": {
+      "& .tableActionColumn": {
+        "& .MuiDataGrid-columnHeaderTitleContainer": {
+          justifyContent: "center"
+        }
+      },
+      "&.elevate": {
+        boxShadow: "0px 2px 1px -1px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%), 0px 1px 3px 0px rgb(0 0 0 / 12%)"
+      },
+      backgroundColor: _apperance.palette.gray.light,
+      border: "2px solid ".concat(_apperance.palette.gray.dark),
+      "& .MuiPaginationItem-root": {
+        "&.Mui-selected": {
+          color: _apperance.palette.white,
+          backgroundColor: _apperance.palette.primary
+        }
+      },
+      "&.table-loading .MuiDataGrid-virtualScroller, &.table-loading .MuiDataGrid-footerContainer": {
+        filter: "blur(1px)",
+        "&::before": {
+          content: "''",
+          width: "100%",
+          height: "100%",
+          backgroundColor: _apperance.palette.white,
+          position: "absolute",
+          zIndex: 1,
+          display: "block",
+          opacity: 0
+        }
+      },
+      "&.table-stripped .MuiDataGrid-row": {
+        "&:nth-of-type(even)": {
+          backgroundColor: _apperance.palette.gray.light
+        }
+      },
+      "& .MuiLinearProgress-root": {
+        zIndex: 1,
+        backgroundColor: _apperance.palette.info,
+        "& .MuiLinearProgress-bar": {
+          backgroundColor: _apperance.palette.primary
+        }
+      },
+      "& .MuiDataGrid-columnHeaders": {
+        "& .MuiDataGrid-columnHeader": {
+          "& .MuiDataGrid-columnHeaderTitle": {
+            display: "flex",
+            alignItems: "center",
+            fontWeight: "600",
+            color: _apperance.palette.primary
+          },
+          "&:focus-within": {
+            outline: "none"
+          },
+          "&:last-of-type .MuiDataGrid-columnSeparator": {
+            display: "none"
+          }
+        },
+        "& .MuiDataGrid-columnSeparator": {
+          color: _apperance.palette.gray.dark
+        }
+      },
+      "& .MuiDataGrid-cell": {
+        "&.tableAction": {
+          justifyContent: "center",
+          position: "relative",
+          overflow: "initial !important"
+        },
+        "&:focus-within": {
+          outline: "none"
+        }
+      },
+      "& .MuiDataGrid-virtualScroller": {
+        backgroundColor: _apperance.palette.white
+      },
+      "& .MuiDataGrid-footerContainer": {
+        backgroundColor: _apperance.palette.white,
+        height: "40px",
+        minHeight: "40px"
+      }
+    }
+  };
+});
+const localeText = {
+  noRowsLabel: "Aucune ligne",
+  footerRowSelected: count => count !== 1 ? "".concat(count.toLocaleString(), " lignes s\xE9lectionn\xE9es") : "".concat(count.toLocaleString(), " ligne s\xE9lectionn\xE9e"),
+  footerTotalVisibleRows: (visibleCount, totalCount) => "".concat(visibleCount.toLocaleString(), " de ").concat(totalCount.toLocaleString()),
+  MuiTablePagination: {
+    labelDisplayedRows: _ref => {
+      let {
+        from,
+        to,
+        count
+      } = _ref;
+      return "".concat(from, "\u2013").concat(to, " de ").concat(count !== -1 ? count : "plus que ".concat(to));
+    },
+    labelRowsPerPage: "Lignes par page"
+  }
+};
+const TableActions = _ref2 => {
+  let {
+    row,
+    actions
+  } = _ref2;
+  const [isOpen, setIsOpen] = React.useState(false);
+  const actionsRef = React.useRef();
+  const outsideClickHandler = React.useCallback(event => {
+    if (Boolean(actionsRef.current) && !actionsRef.current.contains(event.target)) {
+      closeHandler();
+    }
+    if (!Boolean(actionsRef.current)) {
+      document.removeEventListener("mouseup", outsideClickHandler, false);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const openHandler = () => {
+    document.addEventListener("mouseup", outsideClickHandler, false);
+    setIsOpen(true);
+  };
+  const closeHandler = () => {
+    document.removeEventListener("mouseup", outsideClickHandler, false);
+    setIsOpen(false);
+  };
+  React.useEffect(() => {
+    return () => {
+      document.removeEventListener("mouseup", outsideClickHandler, false);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTableAction.default, {
+      title: "Voir plus",
+      color: "primary",
+      onClick: openHandler,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
+        type: "voir-plus"
+      })
+    }), Boolean(isOpen) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Paper, {
+      ref: actionsRef,
+      elevation: 1,
+      sx: {
+        borderRadius: "5px",
+        position: "absolute",
+        right: "0",
+        top: "50%",
+        transform: "translate(0, -50%)",
+        display: "flex",
+        alignItems: "center",
+        gap: "8px",
+        paddingX: "8px",
+        height: "calc(100% - 4px)",
+        backgroundColor: _apperance.palette.gray.light,
+        border: "2px solid ".concat(_apperance.palette.gray.dark)
+      },
+      children: [actions.map((action, index) => /*#__PURE__*/React.cloneElement(action, {
+        row,
+        key: index
+      })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTableAction.default, {
+        size: "small",
+        title: "Fermer",
+        color: "primary",
+        onClick: closeHandler,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
+          type: "voir-plus"
+        })
+      })]
+    })]
+  });
+};
+const TablePagination = () => {
+  const apiRef = (0, _xDataGrid.useGridApiContext)();
+  const page = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridPageSelector);
+  const pageCount = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridPageCountSelector);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Pagination, {
+    size: "small",
+    sx: {
+      margin: "auto"
+    },
+    count: pageCount,
+    page: page + 1,
+    onChange: (event, value) => apiRef.current.setPage(value - 1),
+    showFirstButton: true,
+    showLastButton: true
+  });
+};
+const PuiTable = /*#__PURE__*/React.forwardRef((_ref3, ref) => {
+  let {
+      id,
+      className,
+      sx,
+      elevate,
+      rows,
+      rowCount,
+      columns,
+      paginationMode,
+      page,
+      pageSize,
+      checkboxSelection,
+      loading,
+      stripped,
+      actions,
+      oneActionOnly,
+      onSelect,
+      onPageChange,
+      onPageSizeChange
+    } = _ref3,
+    rest = _objectWithoutProperties(_ref3, _excluded);
+  const [appColumns, setAppColumns] = React.useState(columns);
+  React.useEffect(() => {
+    const newColumns = Boolean(actions.length) ? [...columns, {
+      field: "action",
+      width: 10,
+      sortable: false,
+      renderHeader: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTableAction.default, {
+        disabled: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MoreVert.default, {
+          sx: {
+            color: _apperance.palette.gray.dark
+          }
+        })
+      }),
+      renderCell: _ref4 => {
+        let {
+          row
+        } = _ref4;
+        return oneActionOnly ? /*#__PURE__*/React.cloneElement(actions[0], {
+          row
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(TableActions, {
+          row: row,
+          actions: actions
+        });
+      },
+      cellClassName: "tableAction",
+      headerClassName: "tableActionColumn"
+    }] : columns;
+    setAppColumns(newColumns.map(column => {
+      const renderCell = Boolean(column.renderCell) ? column.renderCell : Boolean(column.valueGetter) ? columnData => /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTooltip.default, {
+        title: String(column.valueGetter(columnData)),
+        children: column.valueGetter(columnData)
+      }) : Boolean(column.field) ? _ref5 => {
+        let {
+          row
+        } = _ref5;
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTooltip.default, {
+          title: String(row[column.field]),
+          children: row[column.field]
+        });
+      } : undefined;
+      return _objectSpread(_objectSpread({}, column), {}, {
+        renderCell
+      });
+    }));
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [actions, columns]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledMuiTable, _objectSpread({
+    ref: ref,
+    id: id,
+    components: {
+      BaseCheckbox: _PuiCheckbox.default,
+      LoadingOverlay: _material.LinearProgress,
+      Pagination: TablePagination
+    },
+    className: "".concat(className, " ").concat(stripped ? "table-stripped" : "", " ").concat(loading ? "table-loading" : "", " ").concat(elevate ? "elevate" : ""),
+    sx: sx,
+    autoHeight: true,
+    headerHeight: 40,
+    footerHeight: 40,
+    rowHeight: 40,
+    rows: rows,
+    rowCount: rowCount,
+    columns: appColumns,
+    page: page,
+    pageSize: pageSize,
+    checkboxSelection: checkboxSelection,
+    disableSelectionOnClick: true,
+    disableColumnMenu: true,
+    disableColumnFilter: true,
+    disableColumnSelector: true,
+    disableVirtualization: true,
+    loading: loading,
+    paginationMode: paginationMode,
+    localeText: localeText,
+    onPageChange: onPageChange,
+    onPageSizeChange: onPageSizeChange,
+    onSelectionModelChange: onSelect
+  }, rest));
+});
+PuiTable.propTypes = {
+  id: _propTypes.default.string,
+  className: _propTypes.default.string,
+  sx: _propTypes.default.object,
+  elevate: _propTypes.default.bool,
+  stripped: _propTypes.default.bool,
+  oneActionOnly: _propTypes.default.bool,
+  rows: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
+  rowCount: _propTypes.default.number,
+  columns: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
+  page: _propTypes.default.number,
+  pageSize: _propTypes.default.number,
+  actions: _propTypes.default.arrayOf(_propTypes.default.element),
+  checkboxSelection: _propTypes.default.bool,
+  paginationMode: _propTypes.default.oneOf(["client", "server"]),
+  loading: _propTypes.default.bool,
+  onSelect: _propTypes.default.func,
+  onPageChange: _propTypes.default.func,
+  onPageSizeChange: _propTypes.default.func,
+  onSelectionModelChange: _propTypes.default.func
+};
+PuiTable.defaultProps = {
+  oneActionOnly: false,
+  elevate: true,
+  pageSize: 5,
+  paginationMode: "client",
+  stripped: false,
+  actions: []
+};
+var _default = PuiTable;
+exports.default = _default;

package/dist/components/table/PuiTableAction.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.symbol.description.js");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _PuiIconButton = _interopRequireDefault(require("../buttons/PuiIconButton"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const PuiTableAction = _ref => {
+  let {
+    id,
+    className,
+    sx,
+    row,
+    title,
+    hide,
+    hideFunc,
+    disabled,
+    onClick: _onClick,
+    children
+  } = _ref;
+  return hide || hideFunc(row) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIconButton.default, {
+    id: id,
+    className: className,
+    sx: _objectSpread(_objectSpread({}, sx), {}, {
+      "& .MuiSvgIcon-root": {
+        width: ".75em !important",
+        height: ".75em !important"
+      }
+    }),
+    title: title,
+    disabled: disabled,
+    size: "small",
+    onClick: () => _onClick(row),
+    children: children
+  });
+};
+PuiTableAction.propTypes = {
+  id: _propTypes.default.string,
+  className: _propTypes.default.string,
+  sx: _propTypes.default.object,
+  row: _propTypes.default.object,
+  title: _propTypes.default.string,
+  hide: _propTypes.default.bool,
+  hideFunc: _propTypes.default.func,
+  disabled: _propTypes.default.bool,
+  onClick: _propTypes.default.func
+};
+PuiTableAction.defaultProps = {
+  hide: false,
+  hideFunc: () => false,
+  onClick: () => {}
+};
+var _default = PuiTableAction;
+exports.default = _default;

package/dist/components/typography/PuiDefinition.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _material = require("@mui/material");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _apperance = require("../../config/apperance");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PuiDefinition = _ref => {
+  let {
+    label,
+    children
+  } = _ref;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
+    direction: "row",
+    alignItems: "center",
+    spacing: 1,
+    sx: {
+      fontFamily: '"Roboto","Helvetica","Arial",sans-serif',
+      fontSize: "0.8rem",
+      color: _apperance.palette.gray.darker,
+      lineHeight: "1.4375em",
+      letterSpacing: "0.00938em",
+      whiteSpace: "nowrap"
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+      sx: {
+        fontWeight: "600"
+      },
+      children: "".concat(label, " :")
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+      children: children
+    })]
+  });
+};
+PuiDefinition.propTypes = {
+  label: _propTypes.default.string.isRequired
+};
+var _default = PuiDefinition;
+exports.default = _default;

package/dist/components/typography/PuiIndication.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.symbol.description.js");
+var _material = require("@mui/material");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireDefault(require("react"));
+var _apperance = require("../../config/apperance");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const getTextFontSize = size => {
+  switch (size) {
+    case "small":
+      return ".7rem";
+    default:
+    case "medium":
+      return "1rem";
+    case "large":
+      return "1.2rem";
+  }
+};
+const PuiIndication = _ref => {
+  let {
+    id,
+    className,
+    sx,
+    icon,
+    color,
+    size,
+    children
+  } = _ref;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
+    id: id,
+    className: className,
+    sx: _objectSpread({
+      color: color === "inherit" ? "inherit" : _apperance.palette[color]
+    }, sx),
+    direction: "row",
+    alignItems: "center",
+    spacing: 1,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+      children: icon && /*#__PURE__*/_react.default.cloneElement(icon, {
+        fontSize: size,
+        size
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+      sx: {
+        fontSize: getTextFontSize(size),
+        fontWeight: "bold"
+      },
+      children: children
+    })]
+  });
+};
+PuiIndication.propTypes = {
+  id: _propTypes.default.string,
+  className: _propTypes.default.string,
+  sx: _propTypes.default.object,
+  icon: _propTypes.default.element,
+  color: _propTypes.default.oneOf(["primary", "secondary", "error", "success", "warning", "info", "dark", "inherit"]),
+  size: _propTypes.default.oneOf(["small", "medium", "large"])
+};
+PuiIndication.defaultProps = {
+  color: "primary",
+  size: "medium"
+};
+var _default = PuiIndication;
+exports.default = _default;

package/dist/components/typography/PuiMainTitle.js

@@ -0,0 +1,82 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.symbol.description.js");
+var _material = require("@mui/material");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireDefault(require("react"));
+var _apperance = require("../../config/apperance");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const PuiMainTitle = _ref => {
+  let {
+    id,
+    className,
+    sx,
+    icon,
+    trace,
+    title
+  } = _ref;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+    id: id,
+    className: className,
+    sx: _objectSpread({
+      display: "flex",
+      alignItems: "center",
+      marginBottom: 2
+    }, sx),
+    children: [Boolean(icon) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+      children: /*#__PURE__*/_react.default.cloneElement(icon, {
+        sx: {
+          marginRight: 1,
+          fontSize: "2.4em",
+          color: _apperance.palette.primary
+        }
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+        sx: {
+          color: _apperance.palette.primary,
+          fontSize: "1.8rem",
+          fontWeight: "bold"
+        },
+        variant: "h1",
+        children: title
+      }), Boolean(trace) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+        sx: {
+          color: _apperance.palette.primary,
+          fontSize: ".8rem",
+          fontWeight: "bold"
+        },
+        variant: "h2",
+        children: trace.map((element, index) => {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+            component: "span",
+            children: "".concat(element).concat(index + 1 !== trace.length ? " > " : "")
+          }, index);
+        })
+      })]
+    })]
+  });
+};
+PuiMainTitle.propTypes = {
+  id: _propTypes.default.string,
+  className: _propTypes.default.string,
+  sx: _propTypes.default.object,
+  icon: _propTypes.default.element.isRequired,
+  trace: _propTypes.default.arrayOf(_propTypes.default.string),
+  title: _propTypes.default.string.isRequired
+};
+PuiMainTitle.defaultProps = {
+  trace: []
+};
+var _default = PuiMainTitle;
+exports.default = _default;