@xsmusices/ui 1.43.0 → 1.44.0

package/index.d.ts

@@ -3199,7 +3199,7 @@ declare class XSListComponent {
     label: _angular_core.InputSignal<string | undefined>;
     loadingAll: _angular_core.InputSignal<boolean>;
     initialLoading: _angular_core.InputSignal<boolean>;
-    columns: _angular_core.InputSignal<1 | 2 | 3>;
+    columns: _angular_core.InputSignal<2 | 1 | 3>;
     isLink: _angular_core.InputSignal<boolean>;
     size: _angular_core.InputSignal<"small" | "normal" | "profile">;
     hasScroll: _angular_core.InputSignal<boolean | "lg" | "xl" | "mobile">;
@@ -3562,7 +3562,7 @@ declare class XSBodyOverflowService {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<XSBodyOverflowService>;
 }
 
-type XSModalType = 'bottom-sheet' | 'centered';
+type XSModalType = 'bottom-sheet' | 'centered' | 'side-panel';
 interface XSModalInjectedComponent<T = unknown> {
     modalData?: T;
     modalResult?: {
@@ -4995,7 +4995,7 @@ declare class XSSendScraperComponent implements OnInit {
     protected stepLabels: _angular_core.Signal<string[]>;
     protected showSourceSelection: _angular_core.Signal<boolean>;
     protected canSearch: _angular_core.Signal<boolean>;
-    protected primaryVariant: _angular_core.Signal<"youtube" | "soundcloud">;
+    protected primaryVariant: _angular_core.Signal<"soundcloud" | "youtube">;
     protected activeFormFields: _angular_core.Signal<FormlyFieldConfig<_ngx_formly_core.FormlyFieldProps & {
         [additionalProperties: string]: any;
     }>[]>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xsmusices/ui",
-  "version": "1.43.0",
+  "version": "1.44.0",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },

package/fesm2022/xsmusices-ui-xs-modal.xsstory-B96CYHF0.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"xsmusices-ui-xs-modal.xsstory-B96CYHF0.mjs","sources":["../../../projects/xs-ui/src/lib/components/base/modal/modal-example.component.ts","../../../projects/xs-ui/src/lib/components/base/modal/modal-example.component.html","../../../projects/xs-ui/src/lib/components/base/modal/xs-modal.xsstory.ts"],"sourcesContent":["import {\n  Component,\n  input,\n  inject,\n  ChangeDetectionStrategy,\n} from '@angular/core';\nimport { XSModalService } from './xs-modal.service';\nimport { XSButtonComponent } from '../button/xs-button.component';\nimport { XSModalImageSearchComponent } from './types/image-search/xs-modal-image-search.component';\n\n@Component({\n  selector: 'modal-example',\n  host: { 'modal-example-host': '' },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [XSButtonComponent],\n  templateUrl: './modal-example.component.html',\n})\nexport class ModalExampleComponent {\n  activeModal = input<\n    | 'confirm'\n    | 'info'\n    | 'input'\n    | 'claim'\n    | 'imageSearch'\n    | 'imageSearchSources'\n    | null\n  >();\n\n  private modalService = inject(XSModalService);\n\n  openConfirm(): void {\n    this.modalService\n      .openConfirm({\n        title: 'Confirmar eliminación',\n        subTitle:\n          '¿Estás seguro de que quieres eliminar este elemento?',\n        labelAccept: 'Sí, eliminar',\n        labelCancel: 'Cancelar',\n        type: 'centered',\n      })\n      .subscribe((_result) => {});\n  }\n\n  openInfo(): void {\n    this.modalService\n      .openInfo({\n        title: 'Información importante',\n        info: '<p>Este es un mensaje <strong>importante</strong> que el usuario debe leer.</p><p>Contiene información crítica sobre el sistema.</p>',\n        labelClose: 'Entendido',\n        type: 'centered',\n      })\n      .subscribe(() => {});\n  }\n\n  openInput(): void {\n    this.modalService\n      .openInput({\n        title: 'Ingrese su nombre',\n        subTitle: 'Necesitamos su nombre para continuar',\n        placeholder: 'Escriba su nombre aquí...',\n        minLength: 2,\n        maxLength: 50,\n        labelAccept: 'Guardar',\n        labelCancel: 'Cancelar',\n        type: 'centered',\n      })\n      .subscribe((_result) => {});\n  }\n\n  openClaim(): void {\n    this.modalService\n      .openClaim({\n        title: 'Reclamar elemento',\n        subTitle: 'Esta acción requiere justificación',\n        warningMsg:\n          '¿Estás seguro de que quieres reclamar este elemento?',\n        enterReason:\n          'Por favor explica el motivo de la reclamación',\n        labelAccept: 'Reclamar',\n        labelCancel: 'Cancelar',\n        type: 'centered',\n      })\n      .subscribe((_result) => {});\n  }\n\n  openImageSearch(): void {\n    this.modalService\n      .open(XSModalImageSearchComponent, {\n        type: 'bottom-sheet',\n        title: 'Scraping de imágenes',\n        subTitle: 'Busca y selecciona una imagen',\n        data: {\n          q: 'music',\n          searchImages: async (query: string, limit: number) => {\n            const images = Array.from(\n              { length: limit },\n              (_, i) =>\n                `https://picsum.photos/seed/${encodeURIComponent(query)}${i}/300/300`,\n            );\n            return { images };\n          },\n        },\n      })\n      .subscribe((_result) => {});\n  }\n\n  openImageSearchWithSources(): void {\n    const mockSoundcloudSearch = async (query: string) => {\n      return {\n        images: [\n          `https://picsum.photos/seed/soundcloud-${encodeURIComponent(query)}/300/300`,\n        ],\n      };\n    };\n\n    const mockGoogleSearch = async (\n      query: string,\n      limit: number,\n      start?: number,\n    ) => {\n      const totalResults = 15;\n      const offset = start ?? 1;\n      const images = Array.from(\n        { length: Math.min(limit, totalResults - offset + 1) },\n        (_, i) =>\n          `https://picsum.photos/seed/${encodeURIComponent(query)}-g-${offset + i}/300/300`,\n      );\n      return { images, totalResults };\n    };\n\n    this.modalService\n      .open(XSModalImageSearchComponent, {\n        type: 'bottom-sheet',\n        title: 'Scraping de imágenes',\n        subTitle: 'Busca en Google Images y SoundCloud',\n        data: {\n          q: 'music',\n          sources: [\n            {\n              id: 'google',\n              label: 'Google Images',\n              searchImages: mockGoogleSearch,\n            },\n            {\n              id: 'soundcloud',\n              label: 'SoundCloud',\n              searchImages: mockSoundcloudSearch,\n            },\n          ],\n        },\n      })\n      .subscribe((_result) => {});\n  }\n}\n","    <div class=\"p-4\">\n      <div class=\"grid grid-cols-1 gap-4\">\n        @if (activeModal() === 'confirm' || !activeModal()) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Confirmación'\"\n            (onClick)=\"openConfirm()\"\n          ></xs-button>\n        }\n        @if (activeModal() === 'info' || !activeModal()) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Información'\"\n            (onClick)=\"openInfo()\"\n          ></xs-button>\n        }\n        @if (activeModal() === 'input' || !activeModal()) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Input'\"\n            (onClick)=\"openInput()\"\n          ></xs-button>\n        }\n        @if (activeModal() === 'claim' || !activeModal()) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Reclamo'\"\n            (onClick)=\"openClaim()\"\n          ></xs-button>\n        }\n        @if (\n          activeModal() === 'imageSearch' || !activeModal()\n        ) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Búsqueda de Imágenes'\"\n            (onClick)=\"openImageSearch()\"\n            class=\"mb-2\"\n          ></xs-button>\n        }\n        @if (\n          activeModal() === 'imageSearchSources' ||\n          !activeModal()\n        ) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir con Google + SoundCloud'\"\n            (onClick)=\"openImageSearchWithSources()\"\n          ></xs-button>\n        }\n      </div>\n    </div>\n","import { StoryMeta } from '../../../story.types';\nimport { ModalExampleComponent } from './modal-example.component';\n\nexport const story: StoryMeta = {\n  id: 'modal',\n  name: 'Modal',\n  type: 'component',\n  subtype: 'Base',\n  status: 'active',\n  usage: ['admin', 'app', 'monitor'],\n  updated: '2026-05-30T12:00:00.000Z',\n  created: '2025-07-29T15:06:52.383Z',\n  description:\n    'Componente Modal con diferentes tipos predefinidos y soporte multi-idioma automático con traducciones expandidas.',\n  component: ModalExampleComponent,\n  selector: 'xs-modal',\n  multilanguage: true,\n  inputs: [\n    {\n      key: 'activeModal',\n      label: 'Modal activo',\n      type: 'select',\n      options: [\n        'confirm',\n        'info',\n        'input',\n        'claim',\n        'imageSearch',\n        'imageSearchSources',\n      ],\n      default: null,\n    },\n  ],\n  examples: [\n    {\n      name: 'Confirm Modal',\n      description:\n        'Modal de confirmación para acciones del usuario',\n      inputs: {\n        activeModal: 'confirm',\n      },\n    },\n    {\n      name: 'Info Modal',\n      description:\n        'Modal de información para mostrar mensajes al usuario',\n      inputs: {\n        activeModal: 'info',\n      },\n    },\n    {\n      name: 'Input Modal',\n      description:\n        'Modal para solicitar entrada de datos del usuario',\n      inputs: {\n        activeModal: 'input',\n      },\n    },\n    {\n      name: 'Claim Modal',\n      description:\n        'Modal de reclamación con campo de justificación',\n      inputs: {\n        activeModal: 'claim',\n      },\n    },\n    {\n      name: 'Image Search Modal',\n      description:\n        'Modal de búsqueda de imágenes con input y resultados en grid',\n      inputs: {\n        activeModal: 'imageSearch',\n      },\n    },\n    {\n      name: 'Image Search con Google + SoundCloud',\n      description:\n        'Modal de búsqueda de imágenes con múltiples fuentes: Google Images y SoundCloud',\n      inputs: {\n        activeModal: 'imageSearchSources',\n      },\n    },\n  ],\n  coverage: {\n    statements: 38,\n    branches: 11,\n    functions: 45,\n    lines: 38,\n  },\n};\n"],"names":[],"mappings":"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"}