@onpe/ui 1.0.44 → 1.0.46

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 (7) hide show
  1. package/dist/cli.esm.js +94 -9
  2. package/dist/cli.js +94 -9
  3. package/dist/components.esm.js +1 -1
  4. package/dist/components.js +1 -1
  5. package/dist/index.esm.js +1 -1
  6. package/dist/index.js +1 -1
  7. package/package.json +1 -1
package/dist/cli.esm.js CHANGED
@@ -5865,7 +5865,7 @@ var COMPONENTS_URL = "https://raw.githubusercontent.com/ricardosv46/onpe-ui/main
5865
5865
  var ICONS_URL = "https://raw.githubusercontent.com/ricardosv46/onpe-ui/main/src/icons";
5866
5866
  function addComponent(componentName) {
5867
5867
  return __awaiter(this, void 0, void 0, function () {
5868
- var isIcon, isModal, folderName, componentPath, componentDependencies, availableComponents, availableIcons, componentFile, availableItems, dependencies, _i, dependencies_1, dependency, depError_1, downloadUrl, response, componentCode, personalizedCode, fileName, filePath, importPath, error_1;
5868
+ var isIcon, isModal, folderName, componentPath, componentDependencies, availableComponents, availableIcons, componentFile, availableItems, dependencies, _i, dependencies_1, dependency, depError_1, downloadUrl, response, componentCode, personalizedCode, fileName, filePath, componentNamePascal, importPath, dependencies, error_1;
5869
5869
  return __generator(this, function (_a) {
5870
5870
  switch (_a.label) {
5871
5871
  case 0:
@@ -5966,7 +5966,7 @@ function addComponent(componentName) {
5966
5966
  case 10:
5967
5967
  componentCode = _a.sent();
5968
5968
  personalizedCode = personalizeComponent(componentCode, componentName);
5969
- fileName = "".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), ".tsx");
5969
+ fileName = "".concat(convertToPascalCase(componentName), ".tsx");
5970
5970
  filePath = require$$1.join(componentPath, fileName);
5971
5971
  return [4 /*yield*/, lib.writeFile(filePath, personalizedCode)];
5972
5972
  case 11:
@@ -5975,10 +5975,24 @@ function addComponent(componentName) {
5975
5975
  // Mostrar instrucciones
5976
5976
  console.log("\n📋 Próximos pasos:");
5977
5977
  console.log("1. Importa el ".concat(isIcon ? "icono" : "componente", ":"));
5978
+ componentNamePascal = convertToPascalCase(componentName);
5978
5979
  importPath = "./components/".concat(folderName, "/").concat(fileName.replace(".tsx", ""));
5979
- console.log(" import { ".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), " } from '").concat(importPath, "'"));
5980
- console.log("2. Usa el ".concat(isIcon ? "icono" : "componente", ":"));
5981
- console.log(" <".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), " />"));
5980
+ console.log(" import { ".concat(componentNamePascal, " } from '").concat(importPath, "'"));
5981
+ // Mostrar dependencias si las hay
5982
+ if (!isIcon && componentDependencies[componentName.toLowerCase()]) {
5983
+ dependencies = componentDependencies[componentName.toLowerCase()];
5984
+ console.log("2. Tambi\u00E9n se instalaron las dependencias:");
5985
+ dependencies.forEach(function (dep) {
5986
+ var depPascal = convertToPascalCase(dep);
5987
+ var depFolder = dep.startsWith("icon-") ? "onpe-icons" : dep.startsWith("modal") ? "onpe-modals" : "onpe-ui";
5988
+ console.log(" import { ".concat(depPascal, " } from './components/").concat(depFolder, "/").concat(depPascal, "'"));
5989
+ });
5990
+ console.log("3. Usa el ".concat(isIcon ? "icono" : "componente", ":"));
5991
+ }
5992
+ else {
5993
+ console.log("2. Usa el ".concat(isIcon ? "icono" : "componente", ":"));
5994
+ }
5995
+ console.log(" <".concat(componentNamePascal, " />"));
5982
5996
  return [3 /*break*/, 13];
5983
5997
  case 12:
5984
5998
  error_1 = _a.sent();
@@ -5988,14 +6002,85 @@ function addComponent(componentName) {
5988
6002
  });
5989
6003
  });
5990
6004
  }
6005
+ function convertToPascalCase(name) {
6006
+ // Convertir kebab-case a PascalCase
6007
+ // Ejemplo: "icon-android" → "IconAndroid"
6008
+ return name
6009
+ .split("-")
6010
+ .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase(); })
6011
+ .join("");
6012
+ }
5991
6013
  function personalizeComponent(code, componentName) {
5992
- // Solo agregar comentario, sin cambiar nada
5993
- var personalizedCode = "// Componente ".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), " copiado tal cual\n// Puedes modificar los colores y estilos seg\u00FAn tus necesidades\n\n").concat(code);
5994
- return personalizedCode;
6014
+ var componentNamePascal = convertToPascalCase(componentName);
6015
+ // Mapeo de componentes y sus nuevas ubicaciones
6016
+ var componentPaths = {
6017
+ // Componentes básicos → onpe-ui
6018
+ Button: "./components/onpe-ui/Button",
6019
+ Overlay: "./components/onpe-ui/Overlay",
6020
+ Portal: "./components/onpe-ui/Portal",
6021
+ Show: "./components/onpe-ui/Show",
6022
+ // Modales → onpe-modals
6023
+ Modal: "./components/onpe-modals/Modal",
6024
+ ModalConfirm: "./components/onpe-modals/ModalConfirm",
6025
+ ModalLoading: "./components/onpe-modals/ModalLoading",
6026
+ ModalBrowserIncompatible: "./components/onpe-modals/ModalBrowserIncompatible",
6027
+ ModalSystemIncompatible: "./components/onpe-modals/ModalSystemIncompatible",
6028
+ // Iconos → onpe-icons
6029
+ IconCheck: "./components/onpe-icons/IconCheck",
6030
+ IconClose: "./components/onpe-icons/IconClose",
6031
+ IconWarning: "./components/onpe-icons/IconWarning",
6032
+ IconSpinnerDesktop: "./components/onpe-icons/IconSpinnerDesktop",
6033
+ IconSpinnerMobile: "./components/onpe-icons/IconSpinnerMobile",
6034
+ IconChrome: "./components/onpe-icons/IconChrome",
6035
+ IconChromeColor: "./components/onpe-icons/IconChromeColor",
6036
+ IconEdge: "./components/onpe-icons/IconEdge",
6037
+ IconEdgeColor: "./components/onpe-icons/IconEdgeColor",
6038
+ IconMozilla: "./components/onpe-icons/IconMozilla",
6039
+ IconMozillaColor: "./components/onpe-icons/IconMozillaColor",
6040
+ IconSafari: "./components/onpe-icons/IconSafari",
6041
+ IconSafariColor: "./components/onpe-icons/IconSafariColor",
6042
+ IconAndroid: "./components/onpe-icons/IconAndroid",
6043
+ IconApple: "./components/onpe-icons/IconApple",
6044
+ IconWindow: "./components/onpe-icons/IconWindow",
6045
+ };
6046
+ // Reemplazar las rutas de importación
6047
+ var personalizedCode = code;
6048
+ // Reemplazar imports relativos con las nuevas rutas
6049
+ Object.entries(componentPaths).forEach(function (_a) {
6050
+ var component = _a[0], newPath = _a[1];
6051
+ var oldPatterns = [
6052
+ // Patrones básicos
6053
+ "from \"../".concat(component, "/").concat(component, "\""),
6054
+ "from \"../".concat(component, "\""),
6055
+ // Patrones de iconos con rutas completas
6056
+ "from \"../../icons/Actions/".concat(component, "/").concat(component, "\""),
6057
+ "from \"../../icons/Actions/".concat(component, "\""),
6058
+ "from \"../../icons/Browsers/".concat(component, "/").concat(component, "\""),
6059
+ "from \"../../icons/Browsers/".concat(component, "\""),
6060
+ "from \"../../icons/OperatingSystems/".concat(component, "/").concat(component, "\""),
6061
+ "from \"../../icons/OperatingSystems/".concat(component, "\""),
6062
+ "from \"../../icons/ONPE/".concat(component, "/").concat(component, "\""),
6063
+ "from \"../../icons/ONPE/".concat(component, "\""),
6064
+ // Patrones con más niveles de profundidad
6065
+ "from \"../../../icons/Actions/".concat(component, "/").concat(component, "\""),
6066
+ "from \"../../../icons/Actions/".concat(component, "\""),
6067
+ "from \"../../../icons/Browsers/".concat(component, "/").concat(component, "\""),
6068
+ "from \"../../../icons/Browsers/".concat(component, "\""),
6069
+ "from \"../../../icons/OperatingSystems/".concat(component, "/").concat(component, "\""),
6070
+ "from \"../../../icons/OperatingSystems/".concat(component, "\""),
6071
+ "from \"../../../icons/ONPE/".concat(component, "/").concat(component, "\""),
6072
+ "from \"../../../icons/ONPE/".concat(component, "\""),
6073
+ ];
6074
+ oldPatterns.forEach(function (pattern) {
6075
+ personalizedCode = personalizedCode.replace(pattern, "from \"".concat(newPath, "\""));
6076
+ });
6077
+ });
6078
+ var finalCode = "// Componente ".concat(componentNamePascal, " copiado y ajustado para la nueva estructura\n// Las rutas de importaci\u00F3n han sido actualizadas autom\u00E1ticamente\n\n").concat(personalizedCode);
6079
+ return finalCode;
5995
6080
  }
5996
6081
 
5997
6082
  var program = new Command();
5998
- program.name("onpe-ui").description("CLI para instalar componentes ONPE UI").version("1.0.42");
6083
+ program.name("onpe-ui").description("CLI para instalar componentes ONPE UI").version("1.0.44");
5999
6084
  program
6000
6085
  .command("add <component>")
6001
6086
  .description("Agregar un componente ONPE UI al proyecto")
package/dist/cli.js CHANGED
@@ -5865,7 +5865,7 @@ var COMPONENTS_URL = "https://raw.githubusercontent.com/ricardosv46/onpe-ui/main
5865
5865
  var ICONS_URL = "https://raw.githubusercontent.com/ricardosv46/onpe-ui/main/src/icons";
5866
5866
  function addComponent(componentName) {
5867
5867
  return __awaiter(this, void 0, void 0, function () {
5868
- var isIcon, isModal, folderName, componentPath, componentDependencies, availableComponents, availableIcons, componentFile, availableItems, dependencies, _i, dependencies_1, dependency, depError_1, downloadUrl, response, componentCode, personalizedCode, fileName, filePath, importPath, error_1;
5868
+ var isIcon, isModal, folderName, componentPath, componentDependencies, availableComponents, availableIcons, componentFile, availableItems, dependencies, _i, dependencies_1, dependency, depError_1, downloadUrl, response, componentCode, personalizedCode, fileName, filePath, componentNamePascal, importPath, dependencies, error_1;
5869
5869
  return __generator(this, function (_a) {
5870
5870
  switch (_a.label) {
5871
5871
  case 0:
@@ -5966,7 +5966,7 @@ function addComponent(componentName) {
5966
5966
  case 10:
5967
5967
  componentCode = _a.sent();
5968
5968
  personalizedCode = personalizeComponent(componentCode, componentName);
5969
- fileName = "".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), ".tsx");
5969
+ fileName = "".concat(convertToPascalCase(componentName), ".tsx");
5970
5970
  filePath = require$$1.join(componentPath, fileName);
5971
5971
  return [4 /*yield*/, lib.writeFile(filePath, personalizedCode)];
5972
5972
  case 11:
@@ -5975,10 +5975,24 @@ function addComponent(componentName) {
5975
5975
  // Mostrar instrucciones
5976
5976
  console.log("\n📋 Próximos pasos:");
5977
5977
  console.log("1. Importa el ".concat(isIcon ? "icono" : "componente", ":"));
5978
+ componentNamePascal = convertToPascalCase(componentName);
5978
5979
  importPath = "./components/".concat(folderName, "/").concat(fileName.replace(".tsx", ""));
5979
- console.log(" import { ".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), " } from '").concat(importPath, "'"));
5980
- console.log("2. Usa el ".concat(isIcon ? "icono" : "componente", ":"));
5981
- console.log(" <".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), " />"));
5980
+ console.log(" import { ".concat(componentNamePascal, " } from '").concat(importPath, "'"));
5981
+ // Mostrar dependencias si las hay
5982
+ if (!isIcon && componentDependencies[componentName.toLowerCase()]) {
5983
+ dependencies = componentDependencies[componentName.toLowerCase()];
5984
+ console.log("2. Tambi\u00E9n se instalaron las dependencias:");
5985
+ dependencies.forEach(function (dep) {
5986
+ var depPascal = convertToPascalCase(dep);
5987
+ var depFolder = dep.startsWith("icon-") ? "onpe-icons" : dep.startsWith("modal") ? "onpe-modals" : "onpe-ui";
5988
+ console.log(" import { ".concat(depPascal, " } from './components/").concat(depFolder, "/").concat(depPascal, "'"));
5989
+ });
5990
+ console.log("3. Usa el ".concat(isIcon ? "icono" : "componente", ":"));
5991
+ }
5992
+ else {
5993
+ console.log("2. Usa el ".concat(isIcon ? "icono" : "componente", ":"));
5994
+ }
5995
+ console.log(" <".concat(componentNamePascal, " />"));
5982
5996
  return [3 /*break*/, 13];
5983
5997
  case 12:
5984
5998
  error_1 = _a.sent();
@@ -5988,14 +6002,85 @@ function addComponent(componentName) {
5988
6002
  });
5989
6003
  });
5990
6004
  }
6005
+ function convertToPascalCase(name) {
6006
+ // Convertir kebab-case a PascalCase
6007
+ // Ejemplo: "icon-android" → "IconAndroid"
6008
+ return name
6009
+ .split("-")
6010
+ .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase(); })
6011
+ .join("");
6012
+ }
5991
6013
  function personalizeComponent(code, componentName) {
5992
- // Solo agregar comentario, sin cambiar nada
5993
- var personalizedCode = "// Componente ".concat(componentName.charAt(0).toUpperCase() + componentName.slice(1), " copiado tal cual\n// Puedes modificar los colores y estilos seg\u00FAn tus necesidades\n\n").concat(code);
5994
- return personalizedCode;
6014
+ var componentNamePascal = convertToPascalCase(componentName);
6015
+ // Mapeo de componentes y sus nuevas ubicaciones
6016
+ var componentPaths = {
6017
+ // Componentes básicos → onpe-ui
6018
+ Button: "./components/onpe-ui/Button",
6019
+ Overlay: "./components/onpe-ui/Overlay",
6020
+ Portal: "./components/onpe-ui/Portal",
6021
+ Show: "./components/onpe-ui/Show",
6022
+ // Modales → onpe-modals
6023
+ Modal: "./components/onpe-modals/Modal",
6024
+ ModalConfirm: "./components/onpe-modals/ModalConfirm",
6025
+ ModalLoading: "./components/onpe-modals/ModalLoading",
6026
+ ModalBrowserIncompatible: "./components/onpe-modals/ModalBrowserIncompatible",
6027
+ ModalSystemIncompatible: "./components/onpe-modals/ModalSystemIncompatible",
6028
+ // Iconos → onpe-icons
6029
+ IconCheck: "./components/onpe-icons/IconCheck",
6030
+ IconClose: "./components/onpe-icons/IconClose",
6031
+ IconWarning: "./components/onpe-icons/IconWarning",
6032
+ IconSpinnerDesktop: "./components/onpe-icons/IconSpinnerDesktop",
6033
+ IconSpinnerMobile: "./components/onpe-icons/IconSpinnerMobile",
6034
+ IconChrome: "./components/onpe-icons/IconChrome",
6035
+ IconChromeColor: "./components/onpe-icons/IconChromeColor",
6036
+ IconEdge: "./components/onpe-icons/IconEdge",
6037
+ IconEdgeColor: "./components/onpe-icons/IconEdgeColor",
6038
+ IconMozilla: "./components/onpe-icons/IconMozilla",
6039
+ IconMozillaColor: "./components/onpe-icons/IconMozillaColor",
6040
+ IconSafari: "./components/onpe-icons/IconSafari",
6041
+ IconSafariColor: "./components/onpe-icons/IconSafariColor",
6042
+ IconAndroid: "./components/onpe-icons/IconAndroid",
6043
+ IconApple: "./components/onpe-icons/IconApple",
6044
+ IconWindow: "./components/onpe-icons/IconWindow",
6045
+ };
6046
+ // Reemplazar las rutas de importación
6047
+ var personalizedCode = code;
6048
+ // Reemplazar imports relativos con las nuevas rutas
6049
+ Object.entries(componentPaths).forEach(function (_a) {
6050
+ var component = _a[0], newPath = _a[1];
6051
+ var oldPatterns = [
6052
+ // Patrones básicos
6053
+ "from \"../".concat(component, "/").concat(component, "\""),
6054
+ "from \"../".concat(component, "\""),
6055
+ // Patrones de iconos con rutas completas
6056
+ "from \"../../icons/Actions/".concat(component, "/").concat(component, "\""),
6057
+ "from \"../../icons/Actions/".concat(component, "\""),
6058
+ "from \"../../icons/Browsers/".concat(component, "/").concat(component, "\""),
6059
+ "from \"../../icons/Browsers/".concat(component, "\""),
6060
+ "from \"../../icons/OperatingSystems/".concat(component, "/").concat(component, "\""),
6061
+ "from \"../../icons/OperatingSystems/".concat(component, "\""),
6062
+ "from \"../../icons/ONPE/".concat(component, "/").concat(component, "\""),
6063
+ "from \"../../icons/ONPE/".concat(component, "\""),
6064
+ // Patrones con más niveles de profundidad
6065
+ "from \"../../../icons/Actions/".concat(component, "/").concat(component, "\""),
6066
+ "from \"../../../icons/Actions/".concat(component, "\""),
6067
+ "from \"../../../icons/Browsers/".concat(component, "/").concat(component, "\""),
6068
+ "from \"../../../icons/Browsers/".concat(component, "\""),
6069
+ "from \"../../../icons/OperatingSystems/".concat(component, "/").concat(component, "\""),
6070
+ "from \"../../../icons/OperatingSystems/".concat(component, "\""),
6071
+ "from \"../../../icons/ONPE/".concat(component, "/").concat(component, "\""),
6072
+ "from \"../../../icons/ONPE/".concat(component, "\""),
6073
+ ];
6074
+ oldPatterns.forEach(function (pattern) {
6075
+ personalizedCode = personalizedCode.replace(pattern, "from \"".concat(newPath, "\""));
6076
+ });
6077
+ });
6078
+ var finalCode = "// Componente ".concat(componentNamePascal, " copiado y ajustado para la nueva estructura\n// Las rutas de importaci\u00F3n han sido actualizadas autom\u00E1ticamente\n\n").concat(personalizedCode);
6079
+ return finalCode;
5995
6080
  }
5996
6081
 
5997
6082
  var program = new Command();
5998
- program.name("onpe-ui").description("CLI para instalar componentes ONPE UI").version("1.0.42");
6083
+ program.name("onpe-ui").description("CLI para instalar componentes ONPE UI").version("1.0.44");
5999
6084
  program
6000
6085
  .command("add <component>")
6001
6086
  .description("Agregar un componente ONPE UI al proyecto")
package/dist/components.esm.js CHANGED
@@ -198,7 +198,7 @@ var Modal = function (_a) {
198
198
  return (jsx(Portal, { children: jsxs("div", { className: classNames([
199
199
  isOpen ? (topAbsolute ? "opacity-100 z-100" : "opacity-100 z-50") : "opacity-0 -z-10",
200
200
  "fixed top-0 w-full h-screen grid place-items-center ",
201
- ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "z-20 grid place-items-center relative", children: [jsx("div", { className: classNames([
201
+ ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "relative z-20 grid place-items-center", children: [jsx("div", { className: classNames([
202
202
  "relative",
203
203
  whitoutBackground
204
204
  ? "flex flex-col items-center justify-center"
package/dist/components.js CHANGED
@@ -198,7 +198,7 @@ var Modal = function (_a) {
198
198
  return (jsx(Portal, { children: jsxs("div", { className: classNames([
199
199
  isOpen ? (topAbsolute ? "opacity-100 z-100" : "opacity-100 z-50") : "opacity-0 -z-10",
200
200
  "fixed top-0 w-full h-screen grid place-items-center ",
201
- ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "z-20 grid place-items-center relative", children: [jsx("div", { className: classNames([
201
+ ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "relative z-20 grid place-items-center", children: [jsx("div", { className: classNames([
202
202
  "relative",
203
203
  whitoutBackground
204
204
  ? "flex flex-col items-center justify-center"
package/dist/index.esm.js CHANGED
@@ -198,7 +198,7 @@ var Modal = function (_a) {
198
198
  return (jsx(Portal, { children: jsxs("div", { className: classNames([
199
199
  isOpen ? (topAbsolute ? "opacity-100 z-100" : "opacity-100 z-50") : "opacity-0 -z-10",
200
200
  "fixed top-0 w-full h-screen grid place-items-center ",
201
- ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "z-20 grid place-items-center relative", children: [jsx("div", { className: classNames([
201
+ ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "relative z-20 grid place-items-center", children: [jsx("div", { className: classNames([
202
202
  "relative",
203
203
  whitoutBackground
204
204
  ? "flex flex-col items-center justify-center"
package/dist/index.js CHANGED
@@ -198,7 +198,7 @@ var Modal = function (_a) {
198
198
  return (jsx(Portal, { children: jsxs("div", { className: classNames([
199
199
  isOpen ? (topAbsolute ? "opacity-100 z-100" : "opacity-100 z-50") : "opacity-0 -z-10",
200
200
  "fixed top-0 w-full h-screen grid place-items-center ",
201
- ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "z-20 grid place-items-center relative", children: [jsx("div", { className: classNames([
201
+ ]), children: [jsx(Overlay, { show: isOpen, onClick: closeDisabled ? undefined : onClose, color: overlayColor }), jsxs("div", { className: "relative z-20 grid place-items-center", children: [jsx("div", { className: classNames([
202
202
  "relative",
203
203
  whitoutBackground
204
204
  ? "flex flex-col items-center justify-center"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onpe/ui",
3
- "version": "1.0.44",
3
+ "version": "1.0.46",
4
4
  "type": "module",
5
5
  "description": "Librería completa de UI para ONPE - Componentes, Hooks, Utils y Librerías",
6
6
  "main": "dist/index.js",