valtech-components 4.0.87 → 4.0.89
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.
- package/esm2022/lib/components/molecules/popover-selector/popover-selector.component.mjs +3 -3
- package/esm2022/lib/components/organisms/attachment-uploader/attachment-uploader.component.mjs +63 -6
- package/esm2022/lib/services/i18n/default-content.mjs +7 -1
- package/esm2022/lib/version.mjs +2 -2
- package/fesm2022/valtech-components.mjs +70 -7
- package/fesm2022/valtech-components.mjs.map +1 -1
- package/lib/components/organisms/attachment-uploader/attachment-uploader.component.d.ts +9 -0
- package/lib/version.d.ts +1 -1
- package/package.json +1 -1
|
@@ -56,7 +56,7 @@ import { BrowserMultiFormatReader } from '@zxing/browser';
|
|
|
56
56
|
* Current version of valtech-components.
|
|
57
57
|
* This is automatically updated during the publish process.
|
|
58
58
|
*/
|
|
59
|
-
const VERSION = '4.0.
|
|
59
|
+
const VERSION = '4.0.89';
|
|
60
60
|
|
|
61
61
|
// Control de estado de refresco (singleton a nivel de módulo)
|
|
62
62
|
let isRefreshing = false;
|
|
@@ -7085,6 +7085,9 @@ const VALTECH_DEFAULT_CONTENT = {
|
|
|
7085
7085
|
attachCamera: 'Usar cámara',
|
|
7086
7086
|
attachMaxCount: 'Límite de {count} archivos alcanzado',
|
|
7087
7087
|
attachUploadFailed: 'Error al subir el archivo',
|
|
7088
|
+
attachCapture: 'Capturar',
|
|
7089
|
+
attachCancel: 'Cancelar',
|
|
7090
|
+
attachCameraError: 'No se pudo acceder a la cámara',
|
|
7088
7091
|
titlePlaceholder: 'Describe brevemente...',
|
|
7089
7092
|
titleValidation: 'El título debe tener entre 5 y 200 caracteres',
|
|
7090
7093
|
descriptionPlaceholder: 'Proporciona más detalles...',
|
|
@@ -7239,6 +7242,9 @@ const VALTECH_DEFAULT_CONTENT = {
|
|
|
7239
7242
|
attachCamera: 'Use camera',
|
|
7240
7243
|
attachMaxCount: 'Limit of {count} files reached',
|
|
7241
7244
|
attachUploadFailed: 'Error uploading file',
|
|
7245
|
+
attachCapture: 'Capture',
|
|
7246
|
+
attachCancel: 'Cancel',
|
|
7247
|
+
attachCameraError: 'Could not access the camera',
|
|
7242
7248
|
titlePlaceholder: 'Describe briefly...',
|
|
7243
7249
|
titleValidation: 'Title must be between 5 and 200 characters',
|
|
7244
7250
|
descriptionPlaceholder: 'Provide more details...',
|
|
@@ -16745,7 +16751,7 @@ class PopoverSelectorComponent {
|
|
|
16745
16751
|
</ion-select-option>
|
|
16746
16752
|
</ion-select>
|
|
16747
16753
|
</div>
|
|
16748
|
-
`, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.popover-selector-container{display:inline-block;width:auto}.popover-selector-container .selector-label{display:block;margin-bottom:8px;font-weight:600;color:var(--ion-color-dark, #1a1a1a)}.popover-selector-select{display:inline-block;width:auto}.popover-selector-select .selector-trigger{--background: transparent;--background-hover: transparent;--background-activated: transparent;--background-focused: transparent;--box-shadow: none;--border-radius: 24px;display:inline-flex;align-items:center;min-width:auto;width:auto;height:auto;min-height:40px;padding:10px 20px;margin:0;background:var(--ion-color-light, #f8f9fa);border:1.5px solid rgba(0,0,0,.3);border-radius:24px;box-shadow:0 2px 8px #00000014;transition:all .2s ease}.popover-selector-select .selector-trigger:hover:not([disabled]){background:var(--ion-color-light-shade, #e9ecef);transform:translateY(-1px);box-shadow:0 4px 12px #0000001f}.popover-selector-select .selector-trigger:active{transform:translateY(0);box-shadow:0 2px 6px #00000026}.popover-selector-select .selector-trigger:focus-visible{outline:2px solid var(--ion-color-primary, #3880ff);outline-offset:-2px}.popover-selector-select .selector-trigger .trigger-text{display:inline-block;margin:0 8px 0 0;font-weight:600;font-size:.875rem;color:var(--ion-color-dark, #1a1a1a);white-space:nowrap;line-height:1.4}.popover-selector-select .selector-trigger .chevron-icon{font-size:1rem;color:var(--ion-color-medium, #92949c);transition:transform .2s ease;margin-left:4px}.popover-selector-select .selector-trigger ion-icon[slot=start]{margin-right:8px;font-size:1rem;color:var(--ion-color-medium-shade, #808289)}.popover-selector-select .selector-trigger.select-expanded{background:var(--ion-color-light-shade, #e9ecef);border-radius:24px}.popover-selector-select .selector-trigger.select-expanded .chevron-icon{transform:rotate(180deg);color:var(--ion-color-primary, #3880ff)}.popover-selector-select .selector-trigger[disabled]{opacity:.6;pointer-events:none;background:var(--ion-color-light-tint, #f4f5f8);box-shadow:none;transform:none}.option-content{display:flex;align-items:center;gap:12px;padding:6px 0}.option-content .option-icon{font-size:1.125rem;width:18px;height:18px;opacity:.8;color:var(--ion-color-medium-shade, #808289)}.option-content span{font-weight:500;color:var(--ion-color-dark, #1a1a1a);line-height:1.4}.popover-selector-container.size-small .selector-trigger{min-height:32px;padding:6px 12px;border-radius:18px}.popover-selector-container.size-small .selector-trigger .trigger-text{font-size:.75rem}.popover-selector-container.size-small .selector-trigger .chevron-icon,.popover-selector-container.size-small .selector-trigger ion-icon[slot=start]{font-size:.875rem}.popover-selector-container.size-large .selector-trigger{min-height:48px;padding:14px 20px;border-radius:28px}.popover-selector-container.size-large .selector-trigger .trigger-text{font-size:1rem}.popover-selector-container.size-large .selector-trigger .chevron-icon,.popover-selector-container.size-large .selector-trigger ion-icon[slot=start]{font-size:1.125rem}@media (max-width: 768px){.popover-selector-container .selector-trigger{min-height:38px;padding:9px 14px}.popover-selector-container .selector-trigger .trigger-text{font-size:.8125rem}}:host-context(.dark) .popover-selector-container .selector-label,:host-context(.ion-palette-dark) .popover-selector-container .selector-label,:host-context(html.ion-palette-dark) .popover-selector-container .selector-label,:host-context(body.dark) .popover-selector-container .selector-label,:host-context([data-theme=dark]) .popover-selector-container .selector-label{color:var(--ion-color-light, #f4f5f8)}:host-context(.dark) .popover-selector-container .selector-trigger,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger,:host-context(body.dark) .popover-selector-container .selector-trigger,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger{background:#ffffff1f;border-color:#fff6}:host-context(.dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(body.dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context([data-theme=dark]) .popover-selector-container .selector-trigger:hover:not([disabled]){background:#fff3}:host-context(.dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(body.dark) .popover-selector-container .selector-trigger .trigger-text,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger .trigger-text{color:var(--ion-color-light, #f4f5f8)}:host-context(.dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(.dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(body.dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(body.dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context([data-theme=dark]) .popover-selector-container .selector-trigger .chevron-icon,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger ion-icon[slot=start]{color:var(--ion-color-light-shade, #d7d8da)}:host-context(.dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(body.dark) .popover-selector-container .selector-trigger.select-expanded,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger.select-expanded{background:#ffffff2e}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "errorText", "expandedIcon", "fill", "helperText", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }] }); }
|
|
16754
|
+
`, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.popover-selector-container{display:inline-block;width:auto}.popover-selector-container .selector-label{display:block;margin-bottom:8px;font-weight:600;color:var(--ion-color-dark, #1a1a1a)}.popover-selector-select{display:inline-block;width:auto}.popover-selector-select .selector-trigger{--background: transparent;--background-hover: transparent;--background-activated: transparent;--background-focused: transparent;--box-shadow: none;--border-radius: 24px;display:inline-flex;align-items:center;min-width:auto;width:auto;height:auto;min-height:40px;padding:10px 20px;margin:0;background:var(--ion-color-light, #f8f9fa);border:1.5px solid var(--ion-color-primary, #3880ff);border-radius:24px;box-shadow:0 2px 8px #00000014;transition:all .2s ease}.popover-selector-select .selector-trigger:hover:not([disabled]){background:var(--ion-color-light-shade, #e9ecef);transform:translateY(-1px);box-shadow:0 4px 12px #0000001f}.popover-selector-select .selector-trigger:active{transform:translateY(0);box-shadow:0 2px 6px #00000026}.popover-selector-select .selector-trigger:focus-visible{outline:none;box-shadow:0 2px 8px #00000014,0 0 0 3px color-mix(in srgb,var(--ion-color-primary, #3880ff) 35%,transparent)}.popover-selector-select .selector-trigger .trigger-text{display:inline-block;margin:0 8px 0 0;font-weight:600;font-size:.875rem;color:var(--ion-color-dark, #1a1a1a);white-space:nowrap;line-height:1.4}.popover-selector-select .selector-trigger .chevron-icon{font-size:1rem;color:var(--ion-color-medium, #92949c);transition:transform .2s ease;margin-left:4px}.popover-selector-select .selector-trigger ion-icon[slot=start]{margin-right:8px;font-size:1rem;color:var(--ion-color-medium-shade, #808289)}.popover-selector-select .selector-trigger.select-expanded{background:var(--ion-color-light-shade, #e9ecef);border-radius:24px;box-shadow:0 2px 8px #00000014,0 0 0 3px color-mix(in srgb,var(--ion-color-primary, #3880ff) 25%,transparent)}.popover-selector-select .selector-trigger.select-expanded .chevron-icon{transform:rotate(180deg);color:var(--ion-color-primary, #3880ff)}.popover-selector-select .selector-trigger[disabled]{opacity:.6;pointer-events:none;background:var(--ion-color-light-tint, #f4f5f8);box-shadow:none;transform:none}.option-content{display:flex;align-items:center;gap:12px;padding:6px 0}.option-content .option-icon{font-size:1.125rem;width:18px;height:18px;opacity:.8;color:var(--ion-color-medium-shade, #808289)}.option-content span{font-weight:500;color:var(--ion-color-dark, #1a1a1a);line-height:1.4}.popover-selector-container.size-small .selector-trigger{min-height:32px;padding:6px 12px;border-radius:18px}.popover-selector-container.size-small .selector-trigger .trigger-text{font-size:.75rem}.popover-selector-container.size-small .selector-trigger .chevron-icon,.popover-selector-container.size-small .selector-trigger ion-icon[slot=start]{font-size:.875rem}.popover-selector-container.size-large .selector-trigger{min-height:48px;padding:14px 20px;border-radius:28px}.popover-selector-container.size-large .selector-trigger .trigger-text{font-size:1rem}.popover-selector-container.size-large .selector-trigger .chevron-icon,.popover-selector-container.size-large .selector-trigger ion-icon[slot=start]{font-size:1.125rem}@media (max-width: 768px){.popover-selector-container .selector-trigger{min-height:38px;padding:9px 14px}.popover-selector-container .selector-trigger .trigger-text{font-size:.8125rem}}:host-context(.dark) .popover-selector-container .selector-label,:host-context(.ion-palette-dark) .popover-selector-container .selector-label,:host-context(html.ion-palette-dark) .popover-selector-container .selector-label,:host-context(body.dark) .popover-selector-container .selector-label,:host-context([data-theme=dark]) .popover-selector-container .selector-label{color:var(--ion-color-light, #f4f5f8)}:host-context(.dark) .popover-selector-container .selector-trigger,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger,:host-context(body.dark) .popover-selector-container .selector-trigger,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger{background:#ffffff1f;border-color:#fff6}:host-context(.dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(body.dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context([data-theme=dark]) .popover-selector-container .selector-trigger:hover:not([disabled]){background:#fff3}:host-context(.dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(body.dark) .popover-selector-container .selector-trigger .trigger-text,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger .trigger-text{color:var(--ion-color-light, #f4f5f8)}:host-context(.dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(.dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(body.dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(body.dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context([data-theme=dark]) .popover-selector-container .selector-trigger .chevron-icon,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger ion-icon[slot=start]{color:var(--ion-color-light-shade, #d7d8da)}:host-context(.dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(body.dark) .popover-selector-container .selector-trigger.select-expanded,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger.select-expanded{background:#ffffff2e}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "errorText", "expandedIcon", "fill", "helperText", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }] }); }
|
|
16749
16755
|
}
|
|
16750
16756
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PopoverSelectorComponent, decorators: [{
|
|
16751
16757
|
type: Component,
|
|
@@ -16786,7 +16792,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
16786
16792
|
</ion-select-option>
|
|
16787
16793
|
</ion-select>
|
|
16788
16794
|
</div>
|
|
16789
|
-
`, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.popover-selector-container{display:inline-block;width:auto}.popover-selector-container .selector-label{display:block;margin-bottom:8px;font-weight:600;color:var(--ion-color-dark, #1a1a1a)}.popover-selector-select{display:inline-block;width:auto}.popover-selector-select .selector-trigger{--background: transparent;--background-hover: transparent;--background-activated: transparent;--background-focused: transparent;--box-shadow: none;--border-radius: 24px;display:inline-flex;align-items:center;min-width:auto;width:auto;height:auto;min-height:40px;padding:10px 20px;margin:0;background:var(--ion-color-light, #f8f9fa);border:1.5px solid
|
|
16795
|
+
`, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.popover-selector-container{display:inline-block;width:auto}.popover-selector-container .selector-label{display:block;margin-bottom:8px;font-weight:600;color:var(--ion-color-dark, #1a1a1a)}.popover-selector-select{display:inline-block;width:auto}.popover-selector-select .selector-trigger{--background: transparent;--background-hover: transparent;--background-activated: transparent;--background-focused: transparent;--box-shadow: none;--border-radius: 24px;display:inline-flex;align-items:center;min-width:auto;width:auto;height:auto;min-height:40px;padding:10px 20px;margin:0;background:var(--ion-color-light, #f8f9fa);border:1.5px solid var(--ion-color-primary, #3880ff);border-radius:24px;box-shadow:0 2px 8px #00000014;transition:all .2s ease}.popover-selector-select .selector-trigger:hover:not([disabled]){background:var(--ion-color-light-shade, #e9ecef);transform:translateY(-1px);box-shadow:0 4px 12px #0000001f}.popover-selector-select .selector-trigger:active{transform:translateY(0);box-shadow:0 2px 6px #00000026}.popover-selector-select .selector-trigger:focus-visible{outline:none;box-shadow:0 2px 8px #00000014,0 0 0 3px color-mix(in srgb,var(--ion-color-primary, #3880ff) 35%,transparent)}.popover-selector-select .selector-trigger .trigger-text{display:inline-block;margin:0 8px 0 0;font-weight:600;font-size:.875rem;color:var(--ion-color-dark, #1a1a1a);white-space:nowrap;line-height:1.4}.popover-selector-select .selector-trigger .chevron-icon{font-size:1rem;color:var(--ion-color-medium, #92949c);transition:transform .2s ease;margin-left:4px}.popover-selector-select .selector-trigger ion-icon[slot=start]{margin-right:8px;font-size:1rem;color:var(--ion-color-medium-shade, #808289)}.popover-selector-select .selector-trigger.select-expanded{background:var(--ion-color-light-shade, #e9ecef);border-radius:24px;box-shadow:0 2px 8px #00000014,0 0 0 3px color-mix(in srgb,var(--ion-color-primary, #3880ff) 25%,transparent)}.popover-selector-select .selector-trigger.select-expanded .chevron-icon{transform:rotate(180deg);color:var(--ion-color-primary, #3880ff)}.popover-selector-select .selector-trigger[disabled]{opacity:.6;pointer-events:none;background:var(--ion-color-light-tint, #f4f5f8);box-shadow:none;transform:none}.option-content{display:flex;align-items:center;gap:12px;padding:6px 0}.option-content .option-icon{font-size:1.125rem;width:18px;height:18px;opacity:.8;color:var(--ion-color-medium-shade, #808289)}.option-content span{font-weight:500;color:var(--ion-color-dark, #1a1a1a);line-height:1.4}.popover-selector-container.size-small .selector-trigger{min-height:32px;padding:6px 12px;border-radius:18px}.popover-selector-container.size-small .selector-trigger .trigger-text{font-size:.75rem}.popover-selector-container.size-small .selector-trigger .chevron-icon,.popover-selector-container.size-small .selector-trigger ion-icon[slot=start]{font-size:.875rem}.popover-selector-container.size-large .selector-trigger{min-height:48px;padding:14px 20px;border-radius:28px}.popover-selector-container.size-large .selector-trigger .trigger-text{font-size:1rem}.popover-selector-container.size-large .selector-trigger .chevron-icon,.popover-selector-container.size-large .selector-trigger ion-icon[slot=start]{font-size:1.125rem}@media (max-width: 768px){.popover-selector-container .selector-trigger{min-height:38px;padding:9px 14px}.popover-selector-container .selector-trigger .trigger-text{font-size:.8125rem}}:host-context(.dark) .popover-selector-container .selector-label,:host-context(.ion-palette-dark) .popover-selector-container .selector-label,:host-context(html.ion-palette-dark) .popover-selector-container .selector-label,:host-context(body.dark) .popover-selector-container .selector-label,:host-context([data-theme=dark]) .popover-selector-container .selector-label{color:var(--ion-color-light, #f4f5f8)}:host-context(.dark) .popover-selector-container .selector-trigger,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger,:host-context(body.dark) .popover-selector-container .selector-trigger,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger{background:#ffffff1f;border-color:#fff6}:host-context(.dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context(body.dark) .popover-selector-container .selector-trigger:hover:not([disabled]),:host-context([data-theme=dark]) .popover-selector-container .selector-trigger:hover:not([disabled]){background:#fff3}:host-context(.dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger .trigger-text,:host-context(body.dark) .popover-selector-container .selector-trigger .trigger-text,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger .trigger-text{color:var(--ion-color-light, #f4f5f8)}:host-context(.dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(.dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context(body.dark) .popover-selector-container .selector-trigger .chevron-icon,:host-context(body.dark) .popover-selector-container .selector-trigger ion-icon[slot=start],:host-context([data-theme=dark]) .popover-selector-container .selector-trigger .chevron-icon,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger ion-icon[slot=start]{color:var(--ion-color-light-shade, #d7d8da)}:host-context(.dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(.ion-palette-dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(html.ion-palette-dark) .popover-selector-container .selector-trigger.select-expanded,:host-context(body.dark) .popover-selector-container .selector-trigger.select-expanded,:host-context([data-theme=dark]) .popover-selector-container .selector-trigger.select-expanded{background:#ffffff2e}\n"] }]
|
|
16790
16796
|
}], ctorParameters: () => [], propDecorators: { props: [{
|
|
16791
16797
|
type: Input
|
|
16792
16798
|
}], selectionChange: [{
|
|
@@ -30906,6 +30912,8 @@ class AttachmentUploaderComponent {
|
|
|
30906
30912
|
this.i18n = inject(I18nService);
|
|
30907
30913
|
this.feedbackService = inject(FeedbackService, { optional: true });
|
|
30908
30914
|
this.attachments = signal([]);
|
|
30915
|
+
this.showCameraOverlay = signal(false);
|
|
30916
|
+
this.cameraStream = null;
|
|
30909
30917
|
this.maxFiles = computed(() => this.props().maxFiles ?? 5);
|
|
30910
30918
|
this.accept = computed(() => this.props().accept ?? 'image/jpeg,image/png,image/webp,application/pdf');
|
|
30911
30919
|
this.maxReached = computed(() => this.attachments().length >= this.maxFiles());
|
|
@@ -30921,10 +30929,59 @@ class AttachmentUploaderComponent {
|
|
|
30921
30929
|
imageOutline,
|
|
30922
30930
|
});
|
|
30923
30931
|
}
|
|
30932
|
+
async openCamera() {
|
|
30933
|
+
if (!navigator.mediaDevices?.getUserMedia) {
|
|
30934
|
+
this.cameraPicker.nativeElement.click();
|
|
30935
|
+
return;
|
|
30936
|
+
}
|
|
30937
|
+
try {
|
|
30938
|
+
this.cameraStream = await navigator.mediaDevices.getUserMedia({
|
|
30939
|
+
video: { facingMode: { ideal: 'environment' }, width: { ideal: 1920 }, height: { ideal: 1080 } },
|
|
30940
|
+
});
|
|
30941
|
+
this.showCameraOverlay.set(true);
|
|
30942
|
+
// El video element se renderiza después del signal → esperar un tick
|
|
30943
|
+
setTimeout(() => {
|
|
30944
|
+
if (this.cameraVideo?.nativeElement) {
|
|
30945
|
+
this.cameraVideo.nativeElement.srcObject = this.cameraStream;
|
|
30946
|
+
}
|
|
30947
|
+
}, 50);
|
|
30948
|
+
}
|
|
30949
|
+
catch {
|
|
30950
|
+
// Permiso denegado o dispositivo sin cámara → fallback file picker
|
|
30951
|
+
this.cameraPicker.nativeElement.click();
|
|
30952
|
+
}
|
|
30953
|
+
}
|
|
30954
|
+
capturePhoto() {
|
|
30955
|
+
const video = this.cameraVideo?.nativeElement;
|
|
30956
|
+
if (!video)
|
|
30957
|
+
return;
|
|
30958
|
+
const canvas = document.createElement('canvas');
|
|
30959
|
+
canvas.width = video.videoWidth;
|
|
30960
|
+
canvas.height = video.videoHeight;
|
|
30961
|
+
canvas.getContext('2d').drawImage(video, 0, 0);
|
|
30962
|
+
canvas.toBlob(blob => {
|
|
30963
|
+
if (!blob)
|
|
30964
|
+
return;
|
|
30965
|
+
const file = new File([blob], `foto_${Date.now()}.jpg`, { type: 'image/jpeg' });
|
|
30966
|
+
this.closeCamera();
|
|
30967
|
+
this.processFiles([file]);
|
|
30968
|
+
}, 'image/jpeg', 0.9);
|
|
30969
|
+
}
|
|
30970
|
+
closeCamera() {
|
|
30971
|
+
this.cameraStream?.getTracks().forEach(t => t.stop());
|
|
30972
|
+
this.cameraStream = null;
|
|
30973
|
+
if (this.cameraVideo?.nativeElement) {
|
|
30974
|
+
this.cameraVideo.nativeElement.srcObject = null;
|
|
30975
|
+
}
|
|
30976
|
+
this.showCameraOverlay.set(false);
|
|
30977
|
+
}
|
|
30924
30978
|
async onFilesSelected(event) {
|
|
30925
30979
|
const input = event.target;
|
|
30926
30980
|
const files = Array.from(input.files ?? []);
|
|
30927
30981
|
input.value = '';
|
|
30982
|
+
this.processFiles(files);
|
|
30983
|
+
}
|
|
30984
|
+
processFiles(files) {
|
|
30928
30985
|
const available = this.maxFiles() - this.attachments().length;
|
|
30929
30986
|
const toProcess = files.slice(0, available);
|
|
30930
30987
|
for (const file of toProcess) {
|
|
@@ -30940,7 +30997,7 @@ class AttachmentUploaderComponent {
|
|
|
30940
30997
|
quality: 0.8,
|
|
30941
30998
|
maxWidth: 1920,
|
|
30942
30999
|
maxHeight: 1920,
|
|
30943
|
-
convertSize: 2 * 1024 * 1024,
|
|
31000
|
+
convertSize: 2 * 1024 * 1024,
|
|
30944
31001
|
success(result) {
|
|
30945
31002
|
resolve(new File([result], file.name, { type: result.type }));
|
|
30946
31003
|
},
|
|
@@ -30976,12 +31033,18 @@ class AttachmentUploaderComponent {
|
|
|
30976
31033
|
return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
|
|
30977
31034
|
}
|
|
30978
31035
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AttachmentUploaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
30979
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: AttachmentUploaderComponent, isStandalone: true, selector: "val-attachment-uploader", inputs: { props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { attachmentsChange: "attachmentsChange" }, ngImport: i0, template: "<div class=\"attachment-uploader\">\n @if (props().title) {\n <val-title class=\"attachment-title\" [props]=\"{ content: props().title, size: 'small', color: 'dark', bold: false }\" />\n }\n\n <input #filePicker type=\"file\" [accept]=\"accept()\" multiple class=\"hidden-input\" (change)=\"onFilesSelected($event)\" />\n\n <div class=\"attachment-actions\">\n <ion-button fill=\"outline\" color=\"dark\" size=\"small\" [disabled]=\"isDisabled()\" (click)=\"filePicker.click()\">\n <ion-icon slot=\"start\" name=\"attach-outline\"></ion-icon>\n {{ i18n.t('attachAdd') }}\n </ion-button>\n
|
|
31036
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: AttachmentUploaderComponent, isStandalone: true, selector: "val-attachment-uploader", inputs: { props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { attachmentsChange: "attachmentsChange" }, viewQueries: [{ propertyName: "cameraPicker", first: true, predicate: ["cameraPicker"], descendants: true }, { propertyName: "cameraVideo", first: true, predicate: ["cameraVideo"], descendants: true }], ngImport: i0, template: "<div class=\"attachment-uploader\">\n @if (props().title) {\n <val-title class=\"attachment-title\" [props]=\"{ content: props().title, size: 'small', color: 'dark', bold: false }\" />\n }\n\n <!-- file picker est\u00E1ndar -->\n <input #filePicker type=\"file\" [accept]=\"accept()\" multiple class=\"hidden-input\" (change)=\"onFilesSelected($event)\" />\n <!-- fallback c\u00E1mara: solo se dispara si getUserMedia falla/denegado -->\n <input\n #cameraPicker\n type=\"file\"\n accept=\"image/*\"\n capture=\"environment\"\n class=\"hidden-input\"\n (change)=\"onFilesSelected($event)\"\n />\n\n <div class=\"attachment-actions\">\n <ion-button fill=\"outline\" color=\"dark\" size=\"small\" [disabled]=\"isDisabled()\" (click)=\"filePicker.click()\">\n <ion-icon slot=\"start\" name=\"attach-outline\"></ion-icon>\n {{ i18n.t('attachAdd') }}\n </ion-button>\n <ion-button fill=\"outline\" color=\"dark\" size=\"small\" [disabled]=\"isDisabled()\" (click)=\"openCamera()\">\n <ion-icon slot=\"start\" name=\"camera-outline\"></ion-icon>\n {{ i18n.t('attachCamera') }}\n </ion-button>\n </div>\n\n @if (maxReached()) {\n <ion-note color=\"warning\" class=\"max-note\">\n {{ i18n.t('attachMaxCount', '_global', { count: maxFiles().toString() }) }}\n </ion-note>\n } @if (attachments().length > 0) {\n <div class=\"attachment-list\">\n @for (item of attachments(); track item.id) {\n <div class=\"attachment-item\" [class]=\"'status-' + item.status\">\n <ion-icon\n class=\"file-icon\"\n [name]=\"item.file.type.startsWith('image/') ? 'image-outline' : 'document-outline'\"\n ></ion-icon>\n <div class=\"file-info\">\n <span class=\"file-name\">{{ item.file.name }}</span>\n <span class=\"file-size\">{{ formatSize(item.file.size) }}</span>\n </div>\n\n @if (item.status === 'uploading') {\n <ion-spinner class=\"status-icon\" name=\"circular\"></ion-spinner>\n } @else if (item.status === 'ready') {\n <ion-icon class=\"status-icon\" name=\"checkmark-circle-outline\" color=\"success\"></ion-icon>\n } @else if (item.status === 'error') {\n <ion-icon class=\"status-icon\" name=\"close-circle-outline\" color=\"danger\"></ion-icon>\n } @if (item.status !== 'uploading') {\n <ion-button fill=\"clear\" size=\"small\" color=\"dark\" (click)=\"remove(item.id)\">\n <ion-icon slot=\"icon-only\" name=\"close-outline\"></ion-icon>\n </ion-button>\n } @if (item.status === 'error' && item.error) {\n <ion-note color=\"danger\" class=\"error-note\">{{ item.error }}</ion-note>\n }\n </div>\n }\n </div>\n } @if (props().hint) {\n <p class=\"attachment-hint\">{{ props().hint }}</p>\n }\n</div>\n\n<!-- Overlay de c\u00E1mara (getUserMedia) -->\n@if (showCameraOverlay()) {\n<div class=\"camera-overlay\" (click)=\"closeCamera()\">\n <div class=\"camera-modal\" (click)=\"$event.stopPropagation()\">\n <video #cameraVideo autoplay playsinline class=\"camera-preview\"></video>\n <div class=\"camera-controls\">\n <ion-button fill=\"outline\" color=\"dark\" (click)=\"closeCamera()\"> {{ i18n.t('attachCancel') }} </ion-button>\n <ion-button color=\"dark\" shape=\"round\" (click)=\"capturePhoto()\">\n <ion-icon slot=\"start\" name=\"camera-outline\"></ion-icon>\n {{ i18n.t('attachCapture') }}\n </ion-button>\n </div>\n </div>\n</div>\n}\n", styles: [".hidden-input{display:none}.camera-overlay{position:fixed;inset:0;z-index:9999;background:#000000d9;display:flex;align-items:center;justify-content:center}.camera-modal{display:flex;flex-direction:column;gap:16px;padding:16px;max-width:min(640px,95vw);width:100%}.camera-preview{width:100%;border-radius:12px;background:#000;aspect-ratio:16/9;object-fit:cover}.camera-controls{display:flex;justify-content:center;gap:12px}.camera-controls ion-button{margin:0;--color: #fff;--border-color: rgba(255, 255, 255, .5)}.attachment-uploader{display:flex;flex-direction:column;gap:8px}.attachment-title{display:block;margin-bottom:2px}.attachment-hint{margin:2px 0 0;text-align:right;font-size:.75rem;line-height:1.4;color:var(--ion-color-dark)}.attachment-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.attachment-actions ion-button{margin:0;height:32px}.attachment-list{display:flex;flex-direction:column;gap:4px}.attachment-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:var(--ion-background-color, #fff);border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .08));flex-wrap:wrap}.attachment-item.status-error{border-color:var(--ion-color-danger)}.file-icon{font-size:1.375rem;color:var(--ion-text-color);flex-shrink:0}.file-info{flex:1;min-width:0;display:flex;flex-direction:column}.file-name{font-size:.8125rem;color:var(--ion-text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-size{font-size:.6875rem;color:var(--ion-color-medium)}:host-context(.dark) .attachment-item,:host-context(.ion-palette-dark) .attachment-item,:host-context(html.ion-palette-dark) .attachment-item,:host-context(body.dark) .attachment-item,:host-context([data-theme=dark]) .attachment-item{background:#ffffff0a;border-color:#ffffff1f}:host-context(.dark) .attachment-item.status-error,:host-context(.ion-palette-dark) .attachment-item.status-error,:host-context(html.ion-palette-dark) .attachment-item.status-error,:host-context(body.dark) .attachment-item.status-error,:host-context([data-theme=dark]) .attachment-item.status-error{border-color:var(--ion-color-danger)}.status-icon{font-size:1.25rem;flex-shrink:0}.error-note{font-size:.6875rem;width:100%}.max-note{font-size:.75rem}\n"], dependencies: [{ kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonNote, selector: "ion-note", inputs: ["color", "mode"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
30980
31037
|
}
|
|
30981
31038
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AttachmentUploaderComponent, decorators: [{
|
|
30982
31039
|
type: Component,
|
|
30983
|
-
args: [{ selector: 'val-attachment-uploader', standalone: true, imports: [IonButton, IonIcon, IonNote, IonSpinner, TitleComponent], template: "<div class=\"attachment-uploader\">\n @if (props().title) {\n <val-title class=\"attachment-title\" [props]=\"{ content: props().title, size: 'small', color: 'dark', bold: false }\" />\n }\n\n <input #filePicker type=\"file\" [accept]=\"accept()\" multiple class=\"hidden-input\" (change)=\"onFilesSelected($event)\" />\n\n <div class=\"attachment-actions\">\n <ion-button fill=\"outline\" color=\"dark\" size=\"small\" [disabled]=\"isDisabled()\" (click)=\"filePicker.click()\">\n <ion-icon slot=\"start\" name=\"attach-outline\"></ion-icon>\n {{ i18n.t('attachAdd') }}\n </ion-button>\n
|
|
30984
|
-
}], ctorParameters: () => []
|
|
31040
|
+
args: [{ selector: 'val-attachment-uploader', standalone: true, imports: [IonButton, IonIcon, IonNote, IonSpinner, TitleComponent], encapsulation: ViewEncapsulation.None, template: "<div class=\"attachment-uploader\">\n @if (props().title) {\n <val-title class=\"attachment-title\" [props]=\"{ content: props().title, size: 'small', color: 'dark', bold: false }\" />\n }\n\n <!-- file picker est\u00E1ndar -->\n <input #filePicker type=\"file\" [accept]=\"accept()\" multiple class=\"hidden-input\" (change)=\"onFilesSelected($event)\" />\n <!-- fallback c\u00E1mara: solo se dispara si getUserMedia falla/denegado -->\n <input\n #cameraPicker\n type=\"file\"\n accept=\"image/*\"\n capture=\"environment\"\n class=\"hidden-input\"\n (change)=\"onFilesSelected($event)\"\n />\n\n <div class=\"attachment-actions\">\n <ion-button fill=\"outline\" color=\"dark\" size=\"small\" [disabled]=\"isDisabled()\" (click)=\"filePicker.click()\">\n <ion-icon slot=\"start\" name=\"attach-outline\"></ion-icon>\n {{ i18n.t('attachAdd') }}\n </ion-button>\n <ion-button fill=\"outline\" color=\"dark\" size=\"small\" [disabled]=\"isDisabled()\" (click)=\"openCamera()\">\n <ion-icon slot=\"start\" name=\"camera-outline\"></ion-icon>\n {{ i18n.t('attachCamera') }}\n </ion-button>\n </div>\n\n @if (maxReached()) {\n <ion-note color=\"warning\" class=\"max-note\">\n {{ i18n.t('attachMaxCount', '_global', { count: maxFiles().toString() }) }}\n </ion-note>\n } @if (attachments().length > 0) {\n <div class=\"attachment-list\">\n @for (item of attachments(); track item.id) {\n <div class=\"attachment-item\" [class]=\"'status-' + item.status\">\n <ion-icon\n class=\"file-icon\"\n [name]=\"item.file.type.startsWith('image/') ? 'image-outline' : 'document-outline'\"\n ></ion-icon>\n <div class=\"file-info\">\n <span class=\"file-name\">{{ item.file.name }}</span>\n <span class=\"file-size\">{{ formatSize(item.file.size) }}</span>\n </div>\n\n @if (item.status === 'uploading') {\n <ion-spinner class=\"status-icon\" name=\"circular\"></ion-spinner>\n } @else if (item.status === 'ready') {\n <ion-icon class=\"status-icon\" name=\"checkmark-circle-outline\" color=\"success\"></ion-icon>\n } @else if (item.status === 'error') {\n <ion-icon class=\"status-icon\" name=\"close-circle-outline\" color=\"danger\"></ion-icon>\n } @if (item.status !== 'uploading') {\n <ion-button fill=\"clear\" size=\"small\" color=\"dark\" (click)=\"remove(item.id)\">\n <ion-icon slot=\"icon-only\" name=\"close-outline\"></ion-icon>\n </ion-button>\n } @if (item.status === 'error' && item.error) {\n <ion-note color=\"danger\" class=\"error-note\">{{ item.error }}</ion-note>\n }\n </div>\n }\n </div>\n } @if (props().hint) {\n <p class=\"attachment-hint\">{{ props().hint }}</p>\n }\n</div>\n\n<!-- Overlay de c\u00E1mara (getUserMedia) -->\n@if (showCameraOverlay()) {\n<div class=\"camera-overlay\" (click)=\"closeCamera()\">\n <div class=\"camera-modal\" (click)=\"$event.stopPropagation()\">\n <video #cameraVideo autoplay playsinline class=\"camera-preview\"></video>\n <div class=\"camera-controls\">\n <ion-button fill=\"outline\" color=\"dark\" (click)=\"closeCamera()\"> {{ i18n.t('attachCancel') }} </ion-button>\n <ion-button color=\"dark\" shape=\"round\" (click)=\"capturePhoto()\">\n <ion-icon slot=\"start\" name=\"camera-outline\"></ion-icon>\n {{ i18n.t('attachCapture') }}\n </ion-button>\n </div>\n </div>\n</div>\n}\n", styles: [".hidden-input{display:none}.camera-overlay{position:fixed;inset:0;z-index:9999;background:#000000d9;display:flex;align-items:center;justify-content:center}.camera-modal{display:flex;flex-direction:column;gap:16px;padding:16px;max-width:min(640px,95vw);width:100%}.camera-preview{width:100%;border-radius:12px;background:#000;aspect-ratio:16/9;object-fit:cover}.camera-controls{display:flex;justify-content:center;gap:12px}.camera-controls ion-button{margin:0;--color: #fff;--border-color: rgba(255, 255, 255, .5)}.attachment-uploader{display:flex;flex-direction:column;gap:8px}.attachment-title{display:block;margin-bottom:2px}.attachment-hint{margin:2px 0 0;text-align:right;font-size:.75rem;line-height:1.4;color:var(--ion-color-dark)}.attachment-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.attachment-actions ion-button{margin:0;height:32px}.attachment-list{display:flex;flex-direction:column;gap:4px}.attachment-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:var(--ion-background-color, #fff);border:1px solid var(--ion-color-light-shade, rgba(0, 0, 0, .08));flex-wrap:wrap}.attachment-item.status-error{border-color:var(--ion-color-danger)}.file-icon{font-size:1.375rem;color:var(--ion-text-color);flex-shrink:0}.file-info{flex:1;min-width:0;display:flex;flex-direction:column}.file-name{font-size:.8125rem;color:var(--ion-text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-size{font-size:.6875rem;color:var(--ion-color-medium)}:host-context(.dark) .attachment-item,:host-context(.ion-palette-dark) .attachment-item,:host-context(html.ion-palette-dark) .attachment-item,:host-context(body.dark) .attachment-item,:host-context([data-theme=dark]) .attachment-item{background:#ffffff0a;border-color:#ffffff1f}:host-context(.dark) .attachment-item.status-error,:host-context(.ion-palette-dark) .attachment-item.status-error,:host-context(html.ion-palette-dark) .attachment-item.status-error,:host-context(body.dark) .attachment-item.status-error,:host-context([data-theme=dark]) .attachment-item.status-error{border-color:var(--ion-color-danger)}.status-icon{font-size:1.25rem;flex-shrink:0}.error-note{font-size:.6875rem;width:100%}.max-note{font-size:.75rem}\n"] }]
|
|
31041
|
+
}], ctorParameters: () => [], propDecorators: { cameraPicker: [{
|
|
31042
|
+
type: ViewChild,
|
|
31043
|
+
args: ['cameraPicker']
|
|
31044
|
+
}], cameraVideo: [{
|
|
31045
|
+
type: ViewChild,
|
|
31046
|
+
args: ['cameraVideo']
|
|
31047
|
+
}] } });
|
|
30985
31048
|
|
|
30986
31049
|
/**
|
|
30987
31050
|
* Configuración de espaciado predefinida
|