contentoh-components-library 21.6.61 → 21.6.62

package/dist/components/organisms/ServicesNavigation/index.js

@@ -1,337 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.ServicesNavigation = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-
-var _react = require("react");
-
-var _material = require("@mui/material");
-
-var _ImageOutlined = _interopRequireDefault(require("@mui/icons-material/ImageOutlined"));
-
-var _ProductHeader = require("../../pages/CreatorsProductEdition/sections/ProductHeader");
-
-var _ui = require("./ui");
-
-var _ServicesRail = require("./ServicesRail");
-
-var _ServiceToolbar = require("./ServiceToolbar");
-
-var _views = require("./views");
-
-var _model = require("./model");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-/*
-  PROTOTIPO: navegación por servicios en la edición de producto.
-
-  Responde a dos preguntas:
-    1. Si el producto solo lleva Traducción, ¿por qué ver Ficha técnica,
-       Descripción e Imágenes? → Solo aparecen los servicios contratados. Con
-       uno solo no hay lista: la edición abre directo en él.
-    2. Con 20 servicios, ¿cómo se navega sin perderse? → Lista lateral en lugar
-       de pestañas, filtrada por omisión a lo que la persona trabaja («Míos»),
-       con un Resumen y un punto rosa en lo que le toca a cada quien.
-
-  Usa la cabecera real de la edición de Creators (ProductHeader); la columna de
-  imagen es un marcador de lugar y las vistas de trabajo son de ejemplo. No está
-  conectado a la base: los servicios y sus estatus llegan por props.
-*/
-var ImagePanelPlaceholder = function ImagePanelPlaceholder() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-    sx: {
-      display: {
-        xs: "none",
-        lg: "block"
-      },
-      flex: "0 0 clamp(240px, 22%, 320px)",
-      minWidth: 0
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-      sx: {
-        aspectRatio: "1 / 1",
-        borderRadius: "8px",
-        border: "1px solid ".concat(_ui.COLORS.s2),
-        background: "linear-gradient(135deg, ".concat(_ui.COLORS.blue_light, ", ").concat(_ui.COLORS.s2, ")"),
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: 1
-      },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageOutlined.default, {
-        sx: {
-          fontSize: 56,
-          color: _ui.COLORS.s3
-        }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-        sx: _ui.captionSx,
-        children: "Imagen principal"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
-      direction: "row",
-      spacing: 1,
-      sx: {
-        mt: 1
-      },
-      children: [0, 1, 2, 3].map(function (index) {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-          sx: {
-            flex: 1,
-            aspectRatio: "1 / 1",
-            borderRadius: "6px",
-            border: "1px solid ".concat(index === 0 ? _ui.COLORS.magenta_s2 : _ui.COLORS.s2),
-            bgcolor: _ui.COLORS.s1
-          }
-        }, index);
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-      sx: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _ui.captionSx), {}, {
-        mt: 1.5
-      }),
-      children: "La columna de imagen de la edici\xF3n se queda como est\xE1."
-    })]
-  });
-};
-
-var TopBar = function TopBar(_ref) {
-  var currentUser = _ref.currentUser,
-      currentUserRole = _ref.currentUserRole;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
-    direction: "row",
-    alignItems: "center",
-    spacing: 1.5,
-    sx: {
-      px: 2,
-      py: 1.25,
-      borderBottom: "1px solid ".concat(_ui.COLORS.s2),
-      flexWrap: "wrap",
-      rowGap: 0.5
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-      sx: {
-        fontFamily: _ui.TITLE_STACK,
-        fontWeight: 600,
-        fontSize: 18,
-        color: _ui.COLORS.s5
-      },
-      children: "Edici\xF3n de producto"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Chip, {
-      label: "Prototipo \xB7 datos de ejemplo",
-      size: "small",
-      sx: {
-        height: 22,
-        bgcolor: _ui.COLORS.s2,
-        color: _ui.COLORS.s4,
-        fontFamily: _ui.FONT_STACK,
-        fontWeight: 700,
-        fontSize: 11
-      }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-      sx: {
-        flex: 1
-      }
-    }), currentUser && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
-      sx: _ui.captionSx,
-      children: ["Viendo como ", /*#__PURE__*/(0, _jsxRuntime.jsx)("b", {
-        children: (0, _model.fullName)(currentUser)
-      }), currentUserRole ? " \xB7 ".concat(currentUserRole) : ""]
-    })]
-  });
-};
-
-var ServicesNavigation = function ServicesNavigation(_ref2) {
-  var _product$categoryReta, _services$find;
-
-  var product = _ref2.product,
-      _ref2$services = _ref2.services,
-      services = _ref2$services === void 0 ? [] : _ref2$services,
-      currentUser = _ref2.currentUser,
-      currentUserRole = _ref2.currentUserRole,
-      initialService = _ref2.initialService,
-      _ref2$initialCollapse = _ref2.initialCollapsed,
-      initialCollapsed = _ref2$initialCollapse === void 0 ? false : _ref2$initialCollapse;
-  var userId = currentUser === null || currentUser === void 0 ? void 0 : currentUser.id_user;
-  var isDesktop = (0, _material.useMediaQuery)("(min-width:900px)");
-  var single = services.length === 1;
-  var showFilter = (0, _model.hasUsefulFilter)(services, userId);
-
-  var _useState = (0, _react.useState)(function () {
-    return initialService !== null && initialService !== void 0 ? initialService : (0, _model.initialSelection)(services, userId);
-  }),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      selected = _useState2[0],
-      setSelected = _useState2[1];
-
-  var _useState3 = (0, _react.useState)(function () {
-    return (0, _model.defaultFilter)(services, userId);
-  }),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      filter = _useState4[0],
-      setFilter = _useState4[1];
-
-  var _useState5 = (0, _react.useState)(initialCollapsed),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      collapsed = _useState6[0],
-      setCollapsed = _useState6[1];
-
-  var _useState7 = (0, _react.useState)(false),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      drawerOpen = _useState8[0],
-      setDrawerOpen = _useState8[1];
-
-  var retailers = (_product$categoryReta = product === null || product === void 0 ? void 0 : product.categoryRetailer) !== null && _product$categoryReta !== void 0 ? _product$categoryReta : [];
-
-  var _useState9 = (0, _react.useState)(function () {
-    var _retailers$, _retailers$2;
-
-    return {
-      id: (_retailers$ = retailers[0]) === null || _retailers$ === void 0 ? void 0 : _retailers$.id_retailer,
-      name: (_retailers$2 = retailers[0]) === null || _retailers$2 === void 0 ? void 0 : _retailers$2.name
-    };
-  }),
-      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      activeRetailer = _useState10[0],
-      _setActiveRetailer = _useState10[1];
-
-  var service = (_services$find = services.find(function (item) {
-    return item.service_name === selected;
-  })) !== null && _services$find !== void 0 ? _services$find : null;
-  var isSummary = !single && (selected === _model.SUMMARY || !service);
-
-  var select = function select(name) {
-    var target = services.find(function (item) {
-      return item.service_name === name;
-    }); // Si se abre algo que no es suyo (desde el Resumen), se pasa a «Todos»
-    // para que el servicio abierto se vea marcado en la lista.
-
-    if (target && filter === "mine" && !(0, _model.isMine)(target, userId)) setFilter("all");
-    setSelected(name);
-    setDrawerOpen(false);
-  };
-
-  var renderRail = function renderRail(variant) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ServicesRail.ServicesRail, {
-      variant: variant,
-      services: services,
-      selected: isSummary ? _model.SUMMARY : selected,
-      onSelect: select,
-      userId: userId,
-      filter: filter,
-      onFilterChange: setFilter,
-      showFilter: showFilter,
-      collapsed: collapsed,
-      onToggleCollapsed: function onToggleCollapsed() {
-        return setCollapsed(function (value) {
-          return !value;
-        });
-      },
-      onClose: variant === "drawer" ? function () {
-        return setDrawerOpen(false);
-      } : undefined
-    });
-  };
-
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-    sx: {
-      flex: 1,
-      minWidth: 0,
-      height: "100%",
-      display: "flex",
-      flexDirection: "column",
-      bgcolor: _ui.COLORS.white,
-      fontFamily: _ui.FONT_STACK,
-      textAlign: "left"
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TopBar, {
-      currentUser: currentUser,
-      currentUserRole: currentUserRole
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-      sx: {
-        flex: 1,
-        minHeight: 0,
-        display: "flex"
-      },
-      children: [!single && isDesktop && renderRail("rail"), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-        sx: {
-          flex: 1,
-          minWidth: 0,
-          overflowY: "auto",
-          p: {
-            xs: 1.5,
-            md: 2.5
-          },
-          display: "flex",
-          gap: 2.5,
-          alignItems: "flex-start"
-        },
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ImagePanelPlaceholder, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-          sx: {
-            flex: 1,
-            minWidth: 0
-          },
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductHeader.ProductHeader, {
-            headerData: product,
-            percent: 72,
-            activeRetailer: activeRetailer,
-            setActiveRetailer: function setActiveRetailer(retailer) {
-              var _retailer$id_retailer, _retailer$name;
-
-              return _setActiveRetailer({
-                id: (_retailer$id_retailer = retailer === null || retailer === void 0 ? void 0 : retailer.id_retailer) !== null && _retailer$id_retailer !== void 0 ? _retailer$id_retailer : retailer === null || retailer === void 0 ? void 0 : retailer.id,
-                name: (_retailer$name = retailer === null || retailer === void 0 ? void 0 : retailer.name) !== null && _retailer$name !== void 0 ? _retailer$name : retailer === null || retailer === void 0 ? void 0 : retailer.retailer
-              });
-            },
-            servicesData: null,
-            showValidationButtons: false
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ServiceToolbar.ServiceToolbar, {
-            service: service,
-            isSummary: isSummary,
-            summaryCounts: {
-              total: services.length,
-              pending: services.filter(function (item) {
-                return (0, _model.isPendingFor)(item, userId);
-              }).length
-            },
-            onOpenRail: !single && !isDesktop ? function () {
-              return setDrawerOpen(true);
-            } : undefined,
-            userId: userId
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_views.ServiceView, {
-            selected: isSummary ? _model.SUMMARY : selected,
-            service: service,
-            services: services,
-            userId: userId,
-            onSelect: select,
-            retailerName: activeRetailer.name
-          })]
-        })]
-      })]
-    }), !single && !isDesktop && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Drawer, {
-      anchor: "left",
-      open: drawerOpen,
-      onClose: function onClose() {
-        return setDrawerOpen(false);
-      },
-      PaperProps: {
-        sx: {
-          width: "min(320px, 88vw)"
-        }
-      },
-      children: renderRail("drawer")
-    })]
-  });
-};
-
-exports.ServicesNavigation = ServicesNavigation;
-var _default = ServicesNavigation;
-exports.default = _default;

package/dist/components/organisms/ServicesNavigation/model.js

@@ -1,167 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.rolesOf = exports.railOrder = exports.isPendingFor = exports.isMine = exports.initials = exports.initialSelection = exports.hasUsefulFilter = exports.groupServices = exports.groupLabel = exports.fullName = exports.defaultFilter = exports.SUMMARY = exports.ROLE_LABELS = void 0;
-
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-
-var _catalog = require("./catalog");
-
-/** Identificador del elemento «Resumen» de la lista (no es un servicio). */
-var SUMMARY = "__summary";
-exports.SUMMARY = SUMMARY;
-var ROLE_LABELS = {
-  especialist: "Especialista",
-  facilitator: "Coordinador",
-  auditor: "Auditor"
-};
-/*
-  Estatus en los que le toca actuar a cada rol. Un estatus compuesto como
-  «RA/AS» (rechazado por el auditor y de vuelta con el especialista) cuenta si
-  cualquiera de sus partes le toca al rol.
-*/
-
-exports.ROLE_LABELS = ROLE_LABELS;
-var ACTIONABLE = {
-  especialist: ["AS", "CA", "RC", "RA"],
-  facilitator: ["PA", "IE"],
-  auditor: ["AC", "RP", "RCA", "SAC"]
-};
-
-var statusParts = function statusParts(status) {
-  return String(status !== null && status !== void 0 ? status : "").split("/");
-};
-
-var fullName = function fullName(user) {
-  return user ? [user.name, user.last_name].filter(Boolean).join(" ") : "";
-};
-
-exports.fullName = fullName;
-
-var initials = function initials(user) {
-  var _user$name$, _user$name, _user$last_name$, _user$last_name;
-
-  return user ? "".concat((_user$name$ = (_user$name = user.name) === null || _user$name === void 0 ? void 0 : _user$name[0]) !== null && _user$name$ !== void 0 ? _user$name$ : "").concat((_user$last_name$ = (_user$last_name = user.last_name) === null || _user$last_name === void 0 ? void 0 : _user$last_name[0]) !== null && _user$last_name$ !== void 0 ? _user$last_name$ : "").toUpperCase() : "";
-};
-
-exports.initials = initials;
-
-var rolesOf = function rolesOf(service, userId) {
-  var _service$assignees;
-
-  return Object.entries((_service$assignees = service.assignees) !== null && _service$assignees !== void 0 ? _service$assignees : {}).filter(function (_ref) {
-    var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
-        user = _ref2[1];
-
-    return user && user.id_user === userId;
-  }).map(function (_ref3) {
-    var _ref4 = (0, _slicedToArray2.default)(_ref3, 1),
-        role = _ref4[0];
-
-    return role;
-  });
-};
-/*
-  `mine` y `pending` pueden venir ya calculados en el servicio (la edición real
-  los saca de ProductEdition/permissions.js con las asignaciones del
-  producto). Si no vienen, se calculan aquí con `assignees`, como en el
-  prototipo.
-*/
-
-
-exports.rolesOf = rolesOf;
-
-var isMine = function isMine(service, userId) {
-  return typeof service.mine === "boolean" ? service.mine : rolesOf(service, userId).length > 0;
-};
-
-exports.isMine = isMine;
-
-var isPendingFor = function isPendingFor(service, userId) {
-  return typeof service.pending === "boolean" ? service.pending : rolesOf(service, userId).some(function (role) {
-    return statusParts(service.status).some(function (part) {
-      var _ACTIONABLE$role;
-
-      return (_ACTIONABLE$role = ACTIONABLE[role]) === null || _ACTIONABLE$role === void 0 ? void 0 : _ACTIONABLE$role.includes(part);
-    });
-  });
-};
-
-exports.isPendingFor = isPendingFor;
-
-var groupLabel = function groupLabel(key) {
-  var _SERVICE_GROUPS$find$, _SERVICE_GROUPS$find;
-
-  return (_SERVICE_GROUPS$find$ = (_SERVICE_GROUPS$find = _catalog.SERVICE_GROUPS.find(function (group) {
-    return group.key === key;
-  })) === null || _SERVICE_GROUPS$find === void 0 ? void 0 : _SERVICE_GROUPS$find.label) !== null && _SERVICE_GROUPS$find$ !== void 0 ? _SERVICE_GROUPS$find$ : "";
-};
-/** Servicios en bloques fijos, en el orden del catálogo. */
-
-
-exports.groupLabel = groupLabel;
-
-var groupServices = function groupServices(services) {
-  return _catalog.SERVICE_GROUPS.map(function (group) {
-    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, group), {}, {
-      services: services.filter(function (service) {
-        return service.group === group.key;
-      })
-    });
-  }).filter(function (group) {
-    return group.services.length > 0;
-  });
-};
-/** El orden en que aparecen en la lista lateral. */
-
-
-exports.groupServices = groupServices;
-
-var railOrder = function railOrder(services) {
-  return groupServices(services).flatMap(function (group) {
-    return group.services;
-  });
-};
-/**
- * Qué se abre al entrar: con un solo servicio, ese; si a la persona le toca
- * algo, lo primero que le toca; si no, el Resumen.
- */
-
-
-exports.railOrder = railOrder;
-
-var initialSelection = function initialSelection(services, userId) {
-  if (services.length === 1) return services[0].service_name;
-  var pending = railOrder(services).find(function (service) {
-    return isPendingFor(service, userId);
-  });
-  return pending ? pending.service_name : SUMMARY;
-};
-/**
- * «Míos» solo tiene sentido si la persona trabaja algunos servicios del
- * producto y no todos: con todos o con ninguno, el filtro no cambia nada.
- */
-
-
-exports.initialSelection = initialSelection;
-
-var hasUsefulFilter = function hasUsefulFilter(services, userId) {
-  var mine = services.filter(function (service) {
-    return isMine(service, userId);
-  }).length;
-  return mine > 0 && mine < services.length;
-};
-
-exports.hasUsefulFilter = hasUsefulFilter;
-
-var defaultFilter = function defaultFilter(services, userId) {
-  return hasUsefulFilter(services, userId) ? "mine" : "all";
-};
-
-exports.defaultFilter = defaultFilter;