contentoh-components-library 21.6.25 → 21.6.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/components/molecules/SingleSelect/index.js +198 -0
  2. package/dist/components/molecules/SingleSelect/styles.js +74 -0
  3. package/dist/components/organisms/LinkVariantsModal/index.js +149 -120
  4. package/dist/components/organisms/LinkVariantsModal/styles.js +2 -2
  5. package/dist/index.js +43 -30
  6. package/package.json +1 -1
  7. package/src/components/molecules/SingleSelect/index.js +183 -0
  8. package/src/components/molecules/SingleSelect/styles.js +132 -0
  9. package/src/components/organisms/LinkVariantsModal/index.js +157 -119
  10. package/src/components/organisms/LinkVariantsModal/styles.js +29 -19
  11. package/src/index.js +1 -0
package/dist/components/organisms/LinkVariantsModal/index.js CHANGED
@@ -11,7 +11,7 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
11
11
 
12
12
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
13
13
 
14
- var _objectSpread6 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
14
+ var _objectSpread7 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
15
15
 
16
16
  var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
17
17
 
@@ -25,6 +25,8 @@ var _axios = _interopRequireDefault(require("axios"));
25
25
 
26
26
  var _api = require("./api");
27
27
 
28
+ var _SingleSelect = require("../../molecules/SingleSelect");
29
+
28
30
  var _helper = require("../../../_utils/helper");
29
31
 
30
32
  var _styles = require("./styles");
@@ -506,9 +508,19 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
506
508
  }();
507
509
 
508
510
  var toggleChoice = function toggleChoice(dimension, id) {
511
+ // Marcar un elemento ES elegir cuáles, así que el radio se pone solo. Antes
512
+ // se podían marcar atributos con los dos radios en blanco: la pantalla decía
513
+ // una cosa y el estado era otra.
514
+ //
515
+ // Se hace así y no dejando "elegir cuáles" marcado de entrada porque eso
516
+ // daría las cuatro dimensiones por decididas desde el principio y habilitaría
517
+ // Ligar sin que nadie hubiera revisado nada.
518
+ setModes(function (current) {
519
+ return current[dimension] === null ? (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, "some")) : current;
520
+ });
509
521
  setChosen(function (current) {
510
522
  var lista = current[dimension];
511
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, lista.includes(id) ? lista.filter(function (item) {
523
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, lista.includes(id) ? lista.filter(function (item) {
512
524
  return item !== id;
513
525
  }) : [].concat((0, _toConsumableArray2.default)(lista), [id])));
514
526
  });
@@ -516,10 +528,10 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
516
528
 
517
529
  var chooseMode = function chooseMode(dimension, modo, ids) {
518
530
  setModes(function (current) {
519
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, modo));
531
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, modo));
520
532
  });
521
533
  setChosen(function (current) {
522
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, modo === "all" ? ids : []));
534
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, (0, _defineProperty2.default)({}, dimension, modo === "all" ? ids : []));
523
535
  });
524
536
  };
525
537
 
@@ -548,7 +560,7 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
548
560
  lista = (_readPayload$data = (_readPayload = (0, _api.readPayload)(res)) === null || _readPayload === void 0 ? void 0 : _readPayload.data) !== null && _readPayload$data !== void 0 ? _readPayload$data : [];
549
561
  setFilters(function (current) {
550
562
  if (!retailer) {
551
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, {
563
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, {
552
564
  retailers: lista.map(function (item) {
553
565
  return {
554
566
  value: item.id,
@@ -559,7 +571,7 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
559
571
  }
560
572
 
561
573
  if (!department) {
562
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, {
574
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, {
563
575
  departments: lista.map(function (item) {
564
576
  return {
565
577
  value: item.category,
@@ -568,13 +580,19 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
568
580
  }),
569
581
  categories: []
570
582
  });
571
- }
583
+ } // El tercer nivel no viene como {id, name} sino como
584
+ // {category_id, subcategory}: con el mapeo de los otros dos, la
585
+ // categoría salía en la lista pero sin texto. Mismo criterio que usa
586
+ // el alta de productos, incluido el separador legible.
587
+
572
588
 
573
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, {
589
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, {
574
590
  categories: lista.map(function (item) {
591
+ var _item$subcategory;
592
+
575
593
  return {
576
- value: item.id,
577
- label: item.name
594
+ value: item.category_id,
595
+ label: ((_item$subcategory = item.subcategory) !== null && _item$subcategory !== void 0 ? _item$subcategory : "").replace("|", " > ")
578
596
  };
579
597
  })
580
598
  });
@@ -611,6 +629,25 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
611
629
  loadFilters(null, null);
612
630
  }
613
631
  }, [step, filters.retailers.length, loadFilters]);
632
+ /*
633
+ Quita una cadena agregada a mano. Solo esas: las del padre se desmarcan con
634
+ su casilla, pero siguen existiendo y volverán a aparecer.
635
+ */
636
+
637
+ var removeExtraRetailer = function removeExtraRetailer(clave) {
638
+ setExtraRetailers(function (current) {
639
+ return current.filter(function (item) {
640
+ return item.clave !== clave;
641
+ });
642
+ });
643
+ setChosen(function (current) {
644
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, {
645
+ categoryRetailers: current.categoryRetailers.filter(function (item) {
646
+ return item !== clave;
647
+ })
648
+ });
649
+ });
650
+ };
614
651
 
615
652
  var addRetailer = function addRetailer() {
616
653
  var retailerId = Number(newRetailer);
@@ -641,7 +678,7 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
641
678
  }]);
642
679
  });
643
680
  setChosen(function (current) {
644
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, {
681
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, {
645
682
  categoryRetailers: [].concat((0, _toConsumableArray2.default)(current.categoryRetailers), [clave])
646
683
  });
647
684
  });
@@ -719,7 +756,7 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
719
756
  var _perChild$id, _guardado$extraRetail;
720
757
 
721
758
  setPerChild(function (current) {
722
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, current), {}, (0, _defineProperty2.default)({}, activeChild, {
759
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, current), {}, (0, _defineProperty2.default)({}, activeChild, {
723
760
  modes: modes,
724
761
  chosen: chosen,
725
762
  extraRetailers: extraRetailers
@@ -763,7 +800,7 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
763
800
  articleId: articleId,
764
801
  parentArticleId: selected[0],
765
802
  inherit: inherit
766
- } : (0, _objectSpread6.default)({
803
+ } : (0, _objectSpread7.default)({
767
804
  mode: mode,
768
805
  parentArticleId: articleId,
769
806
  childrenArticleIds: selected,
@@ -780,7 +817,7 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
780
817
  // El modo importa para quien escucha: en `children` este producto GANA
781
818
  // variantes; en `parent` pasa a SER una. Son efectos opuestos sobre la
782
819
  // misma ficha, así que quien refresque el estado necesita distinguirlos.
783
- onLinked === null || onLinked === void 0 ? void 0 : onLinked((0, _objectSpread6.default)((0, _objectSpread6.default)({}, data), {}, {
820
+ onLinked === null || onLinked === void 0 ? void 0 : onLinked((0, _objectSpread7.default)((0, _objectSpread7.default)({}, data), {}, {
784
821
  mode: mode,
785
822
  parentArticleId: mode === "parent" ? selected[0] : articleId
786
823
  }));
@@ -1033,17 +1070,17 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
1033
1070
  })]
1034
1071
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.List, {
1035
1072
  children: [].concat((0, _toConsumableArray2.default)(offered.categoryRetailers.map(function (item) {
1036
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, item), {}, {
1073
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, item), {}, {
1037
1074
  clave: "".concat(item.retailerId, "-").concat(item.categoryId),
1038
1075
  delPadre: true
1039
1076
  });
1040
1077
  })), (0, _toConsumableArray2.default)(extraRetailers.map(function (item) {
1041
- return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, item), {}, {
1078
+ return (0, _objectSpread7.default)((0, _objectSpread7.default)({}, item), {}, {
1042
1079
  delPadre: false
1043
1080
  });
1044
1081
  }))).map(function (item) {
1045
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
1046
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1082
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("li", {
1083
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1047
1084
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
1048
1085
  type: "checkbox",
1049
1086
  disabled: modes.categoryRetailers === "all",
@@ -1061,66 +1098,58 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
1061
1098
  children: [item.categoryName || "Sin categoría", !item.delPadre && " · no la tiene el padre"]
1062
1099
  })]
1063
1100
  })]
1064
- })
1101
+ }), !item.delPadre && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
1102
+ type: "button",
1103
+ className: "quitar",
1104
+ title: "Quitar esta cadena",
1105
+ "aria-label": "Quitar ".concat(item.retailerName),
1106
+ onClick: function onClick() {
1107
+ return removeExtraRetailer(item.clave);
1108
+ },
1109
+ children: "\xD7"
1110
+ })]
1065
1111
  }, item.clave);
1066
1112
  })
1067
1113
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.AddRetailer, {
1068
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("select", {
1114
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SingleSelect.SingleSelect, {
1115
+ id: "link-variants-retailer",
1116
+ placeholder: "Agregar otra cadena\u2026",
1117
+ options: filters.retailers,
1069
1118
  value: newRetailer,
1070
- onChange: function onChange(event) {
1071
- var valor = event.target.value;
1072
- setNewRetailer(valor);
1119
+ loading: loadingFilters && !filters.retailers.length,
1120
+ onChange: function onChange(valor) {
1121
+ setNewRetailer(valor !== null && valor !== void 0 ? valor : "");
1073
1122
  setNewDepartment("");
1074
1123
  setNewCategory("");
1075
1124
  if (valor) loadFilters(valor, null);
1076
- },
1077
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
1078
- value: "",
1079
- children: "Agregar otra cadena\u2026"
1080
- }), filters.retailers.map(function (item) {
1081
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
1082
- value: item.value,
1083
- children: item.label
1084
- }, item.value);
1085
- })]
1086
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("select", {
1125
+ }
1126
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SingleSelect.SingleSelect, {
1127
+ id: "link-variants-department",
1128
+ placeholder: "Departamento\u2026",
1129
+ options: filters.departments,
1087
1130
  value: newDepartment,
1088
- disabled: !newRetailer || !filters.departments.length,
1089
- onChange: function onChange(event) {
1090
- var valor = event.target.value;
1091
- setNewDepartment(valor);
1131
+ disabled: !newRetailer,
1132
+ loading: loadingFilters && !!newRetailer,
1133
+ onChange: function onChange(valor) {
1134
+ setNewDepartment(valor !== null && valor !== void 0 ? valor : "");
1092
1135
  setNewCategory("");
1093
1136
  if (valor) loadFilters(newRetailer, valor);
1094
- },
1095
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
1096
- value: "",
1097
- children: "Departamento\u2026"
1098
- }), filters.departments.map(function (item) {
1099
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
1100
- value: item.value,
1101
- children: item.label
1102
- }, item.value);
1103
- })]
1104
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("select", {
1137
+ }
1138
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SingleSelect.SingleSelect, {
1139
+ id: "link-variants-category",
1140
+ placeholder: "Categor\xEDa\u2026",
1141
+ options: filters.categories,
1105
1142
  value: newCategory,
1106
- disabled: !newDepartment || !filters.categories.length,
1107
- onChange: function onChange(event) {
1108
- return setNewCategory(event.target.value);
1109
- },
1110
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
1111
- value: "",
1112
- children: "Categor\xEDa\u2026"
1113
- }), filters.categories.map(function (item) {
1114
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
1115
- value: item.value,
1116
- children: item.label
1117
- }, item.value);
1118
- })]
1143
+ disabled: !newDepartment,
1144
+ loading: loadingFilters && !!newDepartment,
1145
+ onChange: function onChange(valor) {
1146
+ return setNewCategory(valor !== null && valor !== void 0 ? valor : "");
1147
+ }
1119
1148
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
1120
1149
  type: "button",
1121
1150
  onClick: addRetailer,
1122
1151
  disabled: !newRetailer || !newCategory || loadingFilters,
1123
- children: loadingFilters ? "…" : "Agregar"
1152
+ children: "Agregar"
1124
1153
  })]
1125
1154
  })]
1126
1155
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Block, {
@@ -1262,72 +1291,68 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
1262
1291
  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Message, {
1263
1292
  children: "El producto padre no tiene atributos con valor que heredar."
1264
1293
  })]
1265
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Block, {
1294
+ }), imagenesUtiles.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Block, {
1266
1295
  children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("h3", {
1267
1296
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
1268
1297
  className: "paso",
1269
1298
  children: "4"
1270
1299
  }), " Im\xE1genes"]
1271
- }), imagenesUtiles.length ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
1272
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Choices, {
1273
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1274
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
1275
- type: "radio",
1276
- name: "images-".concat(activeChild !== null && activeChild !== void 0 ? activeChild : "todos"),
1277
- checked: modes.images === "all",
1278
- onChange: function onChange() {
1279
- return chooseMode("images", "all", imagenesUtiles.map(function (item) {
1280
- return item.id;
1281
- }));
1282
- }
1283
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
1284
- children: ["Todas", /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
1285
- className: "hint",
1286
- children: [imagenesUtiles.length, " imagen(es) en el padre."]
1287
- })]
1300
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Choices, {
1301
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1302
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
1303
+ type: "radio",
1304
+ name: "images-".concat(activeChild !== null && activeChild !== void 0 ? activeChild : "todos"),
1305
+ checked: modes.images === "all",
1306
+ onChange: function onChange() {
1307
+ return chooseMode("images", "all", imagenesUtiles.map(function (item) {
1308
+ return item.id;
1309
+ }));
1310
+ }
1311
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
1312
+ children: ["Todas", /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
1313
+ className: "hint",
1314
+ children: [imagenesUtiles.length, " imagen(es) en el padre."]
1288
1315
  })]
1289
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1316
+ })]
1317
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1318
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
1319
+ type: "radio",
1320
+ name: "images-".concat(activeChild !== null && activeChild !== void 0 ? activeChild : "todos"),
1321
+ checked: modes.images === "some",
1322
+ onChange: function onChange() {
1323
+ return chooseMode("images", "some", []);
1324
+ }
1325
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
1326
+ children: ["Elegir cu\xE1les", /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
1327
+ className: "hint",
1328
+ children: "\xDAtil cuando la variante cambia de color o de empaque."
1329
+ })]
1330
+ })]
1331
+ })]
1332
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ImageGrid, {
1333
+ children: imagenesUtiles.map(function (image) {
1334
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1335
+ className: [chosen.images.includes(image.id) ? "picked" : "", modes.images === "all" ? "locked" : ""].filter(Boolean).join(" "),
1290
1336
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
1291
- type: "radio",
1292
- name: "images-".concat(activeChild !== null && activeChild !== void 0 ? activeChild : "todos"),
1293
- checked: modes.images === "some",
1337
+ type: "checkbox",
1338
+ disabled: modes.images === "all",
1339
+ checked: chosen.images.includes(image.id),
1294
1340
  onChange: function onChange() {
1295
- return chooseMode("images", "some", []);
1341
+ return toggleChoice("images", image.id);
1296
1342
  }
1297
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
1298
- children: ["Elegir cu\xE1les", /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
1299
- className: "hint",
1300
- children: "\xDAtil cuando la variante cambia de color o de empaque."
1301
- })]
1343
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
1344
+ src: (0, _helper.getProductImage)(image.src),
1345
+ alt: "",
1346
+ onError: function onError() {
1347
+ return setBrokenImages(function (current) {
1348
+ return current.includes(image.id) ? current : [].concat((0, _toConsumableArray2.default)(current), [image.id]);
1349
+ });
1350
+ }
1351
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
1352
+ children: image.imageType || "Sin tipo de toma"
1302
1353
  })]
1303
- })]
1304
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ImageGrid, {
1305
- children: imagenesUtiles.map(function (image) {
1306
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
1307
- className: [chosen.images.includes(image.id) ? "picked" : "", modes.images === "all" ? "locked" : ""].filter(Boolean).join(" "),
1308
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
1309
- type: "checkbox",
1310
- disabled: modes.images === "all",
1311
- checked: chosen.images.includes(image.id),
1312
- onChange: function onChange() {
1313
- return toggleChoice("images", image.id);
1314
- }
1315
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
1316
- src: (0, _helper.getProductImage)(image.src),
1317
- alt: "",
1318
- onError: function onError() {
1319
- return setBrokenImages(function (current) {
1320
- return current.includes(image.id) ? current : [].concat((0, _toConsumableArray2.default)(current), [image.id]);
1321
- });
1322
- }
1323
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
1324
- children: image.imageType || "Sin tipo de toma"
1325
- })]
1326
- }, image.id);
1327
- })
1328
- })]
1329
- }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Message, {
1330
- children: "El producto padre no tiene im\xE1genes que heredar."
1354
+ }, image.id);
1355
+ })
1331
1356
  })]
1332
1357
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Message, {
1333
1358
  children: "Lo que elijas heredar reemplaza el valor actual de la variante, incluso si alguien lo hab\xEDa capturado a mano."
@@ -1336,7 +1361,11 @@ var LinkVariantsModal = function LinkVariantsModal(_ref) {
1336
1361
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Footer, {
1337
1362
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
1338
1363
  className: "summary",
1339
- children: step === "search" ? selectionLabel : todoDecidido ? "Todo revisado. Puedes ligar." : !applyToAll && mode === "children" ? "Faltan ".concat(selected.filter(function (id) {
1364
+ children: step === "search" ? selectionLabel : todoDecidido ? "Todo revisado. Puedes ligar." :
1365
+ /* Contar productos solo tiene sentido cuando hay varios y cada
1366
+ uno lleva su propia selección. Con uno, lo útil es decir qué
1367
+ falta, no repetir que falta "1 producto". */
1368
+ !applyToAll && mode === "children" && selected.length > 1 ? "Faltan ".concat(selected.filter(function (id) {
1340
1369
  return !decididoPara(id);
1341
1370
  }).length, " producto(s) por revisar.") : "Falta decidir: ".concat(faltantes.join(", "), ".")
1342
1371
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
package/dist/components/organisms/LinkVariantsModal/styles.js CHANGED
@@ -51,7 +51,7 @@ var SearchRow = _styledComponents.default.form(_templateObject6 || (_templateObj
51
51
 
52
52
  exports.SearchRow = SearchRow;
53
53
 
54
- var List = _styledComponents.default.ul(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n list-style: none;\n margin: 0 0 16px;\n padding: 0;\n border: 1px solid ", ";\n border-radius: 6px;\n\n li + li {\n border-top: 1px solid ", ";\n }\n\n label {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 12px;\n cursor: pointer;\n font-size: 13px;\n color: ", ";\n }\n\n .meta {\n display: block;\n font-size: 12px;\n color: ", ";\n }\n\n .logo {\n width: 24px;\n height: 24px;\n object-fit: contain;\n border-radius: 3px;\n flex-shrink: 0;\n }\n\n .count {\n margin-left: auto;\n font-size: 12px;\n color: ", ";\n white-space: nowrap;\n }\n"])), _variables.GlobalColors.s2, _variables.GlobalColors.s2, _variables.GlobalColors.deep_gray, _variables.GlobalColors.gray, PINK);
54
+ var List = _styledComponents.default.ul(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n list-style: none;\n margin: 0 0 16px;\n padding: 0;\n border: 1px solid ", ";\n border-radius: 6px;\n\n li + li {\n border-top: 1px solid ", ";\n }\n\n label {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 12px;\n cursor: pointer;\n font-size: 13px;\n color: ", ";\n }\n\n .meta {\n display: block;\n font-size: 12px;\n color: ", ";\n }\n\n .logo {\n width: 24px;\n height: 24px;\n object-fit: contain;\n border-radius: 3px;\n flex-shrink: 0;\n }\n\n li {\n display: flex;\n align-items: center;\n }\n\n li > label {\n flex: 1;\n min-width: 0;\n }\n\n .quitar {\n flex-shrink: 0;\n margin-right: 10px;\n border: none;\n background: none;\n padding: 2px 6px;\n cursor: pointer;\n font-size: 16px;\n line-height: 1;\n color: ", ";\n }\n\n .quitar:hover {\n color: ", ";\n }\n\n .count {\n margin-left: auto;\n font-size: 12px;\n color: ", ";\n white-space: nowrap;\n }\n"])), _variables.GlobalColors.s2, _variables.GlobalColors.s2, _variables.GlobalColors.deep_gray, _variables.GlobalColors.gray, _variables.GlobalColors.gray, PINK, PINK);
55
55
 
56
56
  exports.List = List;
57
57
  var AttributeList = (0, _styledComponents.default)(List)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n max-height: 220px;\n overflow-y: auto;\n\n .note {\n display: block;\n font-size: 11px;\n font-style: italic;\n color: ", ";\n }\n\n .value {\n margin-left: auto;\n max-width: 45%;\n font-size: 12px;\n color: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n"])), _variables.GlobalColors.gray, _variables.GlobalColors.gray);
@@ -73,7 +73,7 @@ var ImageGrid = _styledComponents.default.div(_templateObject12 || (_templateObj
73
73
 
74
74
  exports.ImageGrid = ImageGrid;
75
75
 
76
- var AddRetailer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n margin-bottom: 16px;\n\n select {\n flex: 1 1 140px;\n min-width: 0;\n height: 32px;\n padding: 0 8px;\n border: 1px solid ", ";\n border-radius: 6px;\n font-family: ", ";\n font-size: 13px;\n color: ", ";\n background-color: ", ";\n }\n\n button {\n height: 32px;\n padding: 0 14px;\n border: 1px solid ", ";\n border-radius: 6px;\n background: none;\n font-family: ", ";\n font-size: 13px;\n color: ", ";\n cursor: pointer;\n }\n\n select:disabled {\n opacity: 0.5;\n cursor: default;\n }\n\n button:disabled {\n opacity: 0.4;\n cursor: default;\n }\n"])), _variables.GlobalColors.s2, _variables.FontFamily.Raleway, _variables.GlobalColors.deep_gray, _variables.GlobalColors.white, PINK, _variables.FontFamily.Raleway_600, PINK);
76
+ var AddRetailer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-wrap: wrap;\n align-items: flex-end;\n gap: 8px;\n margin-bottom: 16px;\n\n button {\n height: 38px;\n padding: 0 14px;\n border: 1px solid ", ";\n border-radius: 6px;\n background: none;\n font-family: ", ";\n font-size: 13px;\n color: ", ";\n cursor: pointer;\n flex-shrink: 0;\n }\n\n button:disabled {\n opacity: 0.4;\n cursor: default;\n }\n"])), PINK, _variables.FontFamily.Raleway_600, PINK);
77
77
 
78
78
  exports.AddRetailer = AddRetailer;
79
79