@arquimedes.co/eureka-forms 3.0.58-new-steps → 3.0.59-new-steps

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.
@@ -1,22 +1,28 @@
1
1
  .input {
2
2
  width: 100%;
3
3
  box-sizing: border-box;
4
- height: 33px;
4
+ height: 31px;
5
5
  padding: 6px 12px;
6
6
  font-size: 1rem;
7
- color: var(--eureka-text, #333);
7
+ font-family: inherit;
8
+ color: var(--eureka-text, #293241);
8
9
  background-color: var(--eureka-bg, #fff);
9
- border: 1px solid var(--eureka-outline, #ccc);
10
+ border: 1px solid var(--eureka-outline, #b8b8b8);
10
11
  border-radius: 10px;
11
12
  outline: none;
12
13
  }
13
14
 
14
- .input:hover:not(:disabled) {
15
- border-color: var(--eureka-primary, #1976d2);
15
+ .input::placeholder {
16
+ color: var(--eureka-text, #293241);
17
+ opacity: 0.5;
18
+ }
19
+
20
+ .input:hover:not(:disabled):not(:read-only) {
21
+ border-color: var(--eureka-primary, #3d5a7f);
16
22
  }
17
23
 
18
- .input:focus {
19
- border-color: var(--eureka-primary, #1976d2);
24
+ .input:focus:not(:read-only) {
25
+ border-color: var(--eureka-primary, #3d5a7f);
20
26
  border-width: 2px;
21
27
  padding: 5px 11px;
22
28
  }
@@ -40,7 +46,7 @@
40
46
  overflow-y: auto;
41
47
  padding: 4px;
42
48
  background-color: var(--eureka-bg, #fff);
43
- border: 1px solid var(--eureka-outline, #ccc);
49
+ border: 1px solid var(--eureka-outline, #b8b8b8);
44
50
  border-radius: 10px;
45
51
  box-shadow: 0 4px 16px rgb(0 0 0 / 12%);
46
52
  }
@@ -68,7 +74,7 @@
68
74
 
69
75
  .item[data-highlighted],
70
76
  .item:hover {
71
- background-color: var(--eureka-primary, #1976d2);
77
+ background-color: var(--eureka-primary, #3d5a7f);
72
78
  color: #fff;
73
79
  }
74
80
 
@@ -5,13 +5,13 @@
5
5
 
6
6
  /* Mismo alto, radio y borde que los inputs del form (ErkTextField small) */
7
7
  .button {
8
- height: 33px;
9
- width: 33px;
8
+ height: 31px;
9
+ width: 31px;
10
10
  box-sizing: border-box;
11
- border: 1px solid var(--eureka-outline, #d9dee6);
11
+ border: 1px solid var(--eureka-outline, #b8b8b8);
12
12
  border-radius: 10px;
13
13
  background-color: var(--eureka-bg, #fff);
14
- color: var(--eureka-text, #333);
14
+ color: var(--eureka-text, #293241);
15
15
  display: grid;
16
16
  place-items: center;
17
17
  padding: 0;
@@ -26,12 +26,12 @@
26
26
 
27
27
  .button:hover:not(:disabled) {
28
28
  background-color: rgba(0, 0, 0, 0.04);
29
- border-color: var(--eureka-primary, #1976d2);
30
- color: var(--eureka-primary, #1976d2);
29
+ border-color: var(--eureka-primary, #3d5a7f);
30
+ color: var(--eureka-primary, #3d5a7f);
31
31
  }
32
32
 
33
33
  .button:focus-visible {
34
- outline: 2px solid var(--eureka-primary, #1976d2);
34
+ outline: 2px solid var(--eureka-primary, #3d5a7f);
35
35
  outline-offset: 1px;
36
36
  }
37
37
 
@@ -121,6 +121,8 @@ function ErkLocationField({ value, onChange, allowedModes, addressFields, region
121
121
  if (readOnly) {
122
122
  return (_jsx("div", { className: styles.readOnlyContainer, children: _jsxs("div", { className: styles.readOnlyCard, children: [_jsx("div", { className: styles.readOnlyIcon, children: _jsx(LocationIcon, { fill: "var(--eureka-primary)" }) }), _jsxs("div", { className: styles.readOnlyDetails, children: [value?.name && _jsx("span", { className: styles.readOnlyName, children: value.name }), _jsx("span", { className: styles.readOnlyAddress, children: value?.address ?? 'Ubicación no proporcionada' }), value?.latitude !== undefined && value?.longitude !== undefined && (_jsxs("span", { className: styles.readOnlyCoords, children: ["Coordenadas: ", value.latitude.toFixed(6), ", ", value.longitude.toFixed(6)] }))] })] }) }));
123
123
  }
124
- return (_jsxs("div", { className: styles.container, children: [_jsx("div", { className: styles.inputRow, children: value?.address ? (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.grow, children: _jsx(ErkTextField, { label: "Ubicaci\u00F3n seleccionada", value: value.address, readOnly: true, error: error, helperText: helperText, required: required, inputRef: inputRef }) }), canManual && (_jsx(ErkIconButton, { title: "Editar direcci\u00F3n manualmente", className: styles.withLabelOffset, onClick: openManual, children: _jsx(EditIcon, { fill: "currentColor" }) })), _jsx(ErkIconButton, { title: "Limpiar selecci\u00F3n", className: styles.withLabelOffset, onClick: clearValue, children: _jsx(CloseIcon, { fill: "currentColor" }) })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.grow, children: canGoogle ? (_jsx(ErkAddressAutocomplete, { value: value, onChange: handleGoogle, regionCodes: regionCodes, error: error, required: required, inputRef: inputRef })) : canManual ? (_jsx(ErkTextField, { label: "Ingresa una ubicaci\u00F3n...", value: value?.address ?? '', onChange: (text) => onChange(text ? { source: LocationInputMode.MANUAL, address: text } : null), error: error, helperText: helperText, required: required, inputRef: inputRef })) : (_jsx(ErkTextField, { label: "Usa el bot\u00F3n para obtener tu ubicaci\u00F3n", value: "", readOnly: true, error: error, helperText: helperText, required: required, inputRef: inputRef })) }), canGps && (_jsx(ErkIconButton, { title: "Obtener ubicaci\u00F3n por GPS", className: canGoogle ? undefined : styles.withLabelOffset, loading: gpsLoading, onClick: handleGps, children: _jsx(LocationIcon, { fill: "currentColor" }) })), canManual && (_jsx(ErkIconButton, { title: "Ingresar direcci\u00F3n manualmente", className: canGoogle ? undefined : styles.withLabelOffset, onClick: openManual, children: _jsx(EditIcon, { fill: "currentColor" }) }))] })) }), (gpsError ?? (!value?.address && canGoogle && helperText)) && (_jsx("div", { className: error || gpsError ? styles.errorText : styles.helperText, children: gpsError ?? helperText })), _jsxs(Dialog, { open: manualOpen, onClose: () => setManualOpen(false), maxWidth: "sm", fullWidth: true, slotProps: { paper: { className: styles.dialogPaper } }, children: [_jsx(DialogTitle, { className: styles.dialogTitle, children: "Ingresar Direcci\u00F3n" }), _jsx(DialogContent, { className: styles.dialogContent, children: _jsxs("div", { className: styles.manualGrid, children: [_jsx("div", { className: styles.manualRow, children: _jsx("div", { className: styles.col12, children: manualField('street', 'Calle / Carrera / Avenida (Línea 1)', true) }) }), _jsxs("div", { className: styles.manualRow, children: [_jsx("div", { className: styles.col6, children: manualField('streetNumber', 'Número / Portal') }), _jsx("div", { className: styles.col6, children: manualField('unit', 'Apto / Oficina / Interior') })] }), _jsxs("div", { className: styles.manualRow, children: [_jsx("div", { className: styles.col6, children: manualField('neighborhood', 'Barrio / Zona') }), _jsx("div", { className: styles.col6, children: manualField('city', 'Ciudad', true) })] }), _jsxs("div", { className: styles.manualRow, children: [_jsx("div", { className: styles.col4, children: manualField('state', 'Estado / Provincia / Dpto') }), _jsx("div", { className: styles.col4, children: manualField('postalCode', 'Código Postal') }), _jsx("div", { className: styles.col4, children: manualField('country', 'País', true) })] })] }) }), _jsxs(DialogActions, { style: { padding: '16px 0 0 0', gap: '12px' }, children: [_jsx(ErkButton, { text: "Cancelar", variant: "outlined", onClick: () => setManualOpen(false) }), _jsx(ErkButton, { text: "Guardar", variant: "contained", disabled: !canSaveManual, onClick: saveManual })] })] })] }));
124
+ return (_jsxs("div", { className: styles.container, children: [_jsx("div", { className: styles.inputRow, children: value?.address ? (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.grow, children: _jsx("input", { ref: inputRef, className: error ? `${styles.plainInput} ${styles.plainInputError}` : styles.plainInput, value: value.address, readOnly: true, "aria-label": "Ubicaci\u00F3n seleccionada" }) }), canManual && (_jsx(ErkIconButton, { title: "Editar direcci\u00F3n manualmente", onClick: openManual, children: _jsx(EditIcon, { fill: "currentColor" }) })), _jsx(ErkIconButton, { title: "Limpiar selecci\u00F3n", onClick: clearValue, children: _jsx(CloseIcon, { fill: "currentColor" }) })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.grow, children: canGoogle ? (_jsx(ErkAddressAutocomplete, { value: value, onChange: handleGoogle, regionCodes: regionCodes, error: error, required: required, inputRef: inputRef })) : canManual ? (_jsx("input", { ref: inputRef, className: error ? `${styles.plainInput} ${styles.plainInputError}` : styles.plainInput, placeholder: "Ingresa una ubicaci\u00F3n...", value: value?.address ?? '', required: required, onChange: (e) => onChange(e.target.value
125
+ ? { source: LocationInputMode.MANUAL, address: e.target.value }
126
+ : null) })) : (_jsx("input", { ref: inputRef, className: error ? `${styles.plainInput} ${styles.plainInputError}` : styles.plainInput, placeholder: "Usa el bot\u00F3n para obtener tu ubicaci\u00F3n", value: "", readOnly: true })) }), canGps && (_jsx(ErkIconButton, { title: "Obtener ubicaci\u00F3n por GPS", loading: gpsLoading, onClick: handleGps, children: _jsx(LocationIcon, { fill: "currentColor" }) })), canManual && (_jsx(ErkIconButton, { title: "Ingresar direcci\u00F3n manualmente", onClick: openManual, children: _jsx(EditIcon, { fill: "currentColor" }) }))] })) }), (gpsError ?? helperText) && (_jsx("div", { className: error || gpsError ? styles.errorText : styles.helperText, children: gpsError ?? helperText })), _jsxs(Dialog, { open: manualOpen, onClose: () => setManualOpen(false), maxWidth: "sm", fullWidth: true, slotProps: { paper: { className: styles.dialogPaper } }, children: [_jsx(DialogTitle, { className: styles.dialogTitle, children: "Ingresar Direcci\u00F3n" }), _jsx(DialogContent, { className: styles.dialogContent, children: _jsxs("div", { className: styles.manualGrid, children: [_jsx("div", { className: styles.manualRow, children: _jsx("div", { className: styles.col12, children: manualField('street', 'Calle / Carrera / Avenida (Línea 1)', true) }) }), _jsxs("div", { className: styles.manualRow, children: [_jsx("div", { className: styles.col6, children: manualField('streetNumber', 'Número / Portal') }), _jsx("div", { className: styles.col6, children: manualField('unit', 'Apto / Oficina / Interior') })] }), _jsxs("div", { className: styles.manualRow, children: [_jsx("div", { className: styles.col6, children: manualField('neighborhood', 'Barrio / Zona') }), _jsx("div", { className: styles.col6, children: manualField('city', 'Ciudad', true) })] }), _jsxs("div", { className: styles.manualRow, children: [_jsx("div", { className: styles.col4, children: manualField('state', 'Estado / Provincia / Dpto') }), _jsx("div", { className: styles.col4, children: manualField('postalCode', 'Código Postal') }), _jsx("div", { className: styles.col4, children: manualField('country', 'País', true) })] })] }) }), _jsxs(DialogActions, { style: { padding: '16px 0 0 0', gap: '12px' }, children: [_jsx(ErkButton, { text: "Cancelar", variant: "outlined", onClick: () => setManualOpen(false) }), _jsx(ErkButton, { text: "Guardar", variant: "contained", disabled: !canSaveManual, onClick: saveManual })] })] })] }));
125
127
  }
126
128
  export default ErkLocationField;
@@ -18,9 +18,38 @@
18
18
  min-width: 0;
19
19
  }
20
20
 
21
- /* Compensa el margen superior que ErkTextField agrega cuando tiene label */
22
- .withLabelOffset {
23
- margin-top: 5px;
21
+ /* Mismo input del buscador de direcciones, para estados sin autocomplete */
22
+ .plainInput {
23
+ width: 100%;
24
+ box-sizing: border-box;
25
+ height: 31px;
26
+ padding: 6px 12px;
27
+ font-size: 1rem;
28
+ font-family: inherit;
29
+ color: var(--eureka-text, #293241);
30
+ background-color: var(--eureka-bg, #fff);
31
+ border: 1px solid var(--eureka-outline, #b8b8b8);
32
+ border-radius: 10px;
33
+ outline: none;
34
+ }
35
+
36
+ .plainInput::placeholder {
37
+ color: var(--eureka-text, #293241);
38
+ opacity: 0.5;
39
+ }
40
+
41
+ .plainInput:hover:not(:disabled):not(:read-only) {
42
+ border-color: var(--eureka-primary, #3d5a7f);
43
+ }
44
+
45
+ .plainInput:focus:not(:read-only) {
46
+ border-color: var(--eureka-primary, #3d5a7f);
47
+ border-width: 2px;
48
+ padding: 5px 11px;
49
+ }
50
+
51
+ .plainInputError {
52
+ border-color: var(--eureka-error, #e53935);
24
53
  }
25
54
 
26
55
  .helperText {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@arquimedes.co/eureka-forms",
3
3
  "repository": "git://github.com/Arquimede5/Eureka-Forms.git",
4
- "version":"3.0.58-new-steps",
4
+ "version":"3.0.59-new-steps",
5
5
  "scripts": {
6
6
  "watch": "tsgo --noEmit --watch --project tsconfig.app.json",
7
7
  "start": "vite",