@xsmusices/ui 1.43.1 → 1.44.2

package/index.d.ts

@@ -121,7 +121,7 @@ interface XSItemData {
 
 declare class XSItemActionComponent {
     item: _angular_core.InputSignal<XSItemData>;
-    size: _angular_core.InputSignal<"small" | "profile" | "normal">;
+    size: _angular_core.InputSignal<"small" | "normal" | "profile">;
     isLink: _angular_core.InputSignal<boolean>;
     showBorder: _angular_core.InputSignal<boolean>;
     rounded: _angular_core.InputSignal<boolean>;
@@ -244,7 +244,7 @@ declare class XSItemCardComponent {
     get typeForImage(): XSGenericItemType;
     get isVerified(): boolean | "";
     get isLiked(): boolean | undefined;
-    get truncateForEvent(): 16 | 19 | 30 | 18 | 21 | 28 | 31 | 33;
+    get truncateForEvent(): 16 | 30 | 18 | 19 | 21 | 28 | 31 | 33;
     private getNavigationPath;
     onClickItem(event?: Event): void;
     onClickEditItem(): void;
@@ -334,7 +334,7 @@ declare class XSItemsSliderTitleButtonsComponent {
     manage: _angular_core.InputSignal<boolean>;
     state: _angular_core.InputSignal<boolean>;
     total: _angular_core.InputSignal<number>;
-    view: _angular_core.InputSignal<"list" | "cards">;
+    view: _angular_core.InputSignal<"cards" | "list">;
     hasViewButtons: _angular_core.InputSignal<boolean>;
     hasSoundcloudItems: _angular_core.InputSignal<boolean>;
     tabs: _angular_core.InputSignal<{
@@ -347,7 +347,7 @@ declare class XSItemsSliderTitleButtonsComponent {
     }>;
     texts: _angular_core.InputSignal<XSItemsSliderTexts>;
     isPlayingAll: _angular_core.InputSignal<boolean>;
-    onClickChangeView: _angular_core.OutputEmitterRef<"list" | "cards">;
+    onClickChangeView: _angular_core.OutputEmitterRef<"cards" | "list">;
     onClickPlayAll: _angular_core.OutputEmitterRef<void>;
     onClickSort: _angular_core.OutputEmitterRef<void>;
     onChangeState: _angular_core.OutputEmitterRef<void>;
@@ -393,7 +393,7 @@ declare class XSItemsSliderComponent implements AfterViewInit, OnDestroy, OnInit
     items: _angular_core.InputSignal<XSItemData[]>;
     typeFrom: _angular_core.InputSignal<XSItemData | undefined>;
     total: _angular_core.InputSignal<number>;
-    view: _angular_core.ModelSignal<"list" | "cards">;
+    view: _angular_core.ModelSignal<"cards" | "list">;
     hasViewButtons: _angular_core.InputSignal<boolean>;
     loading: _angular_core.InputSignal<{
         items: boolean;
@@ -514,7 +514,7 @@ declare class XSButtonComponent {
     ariaLabel: _angular_core.InputSignal<string | undefined>;
     borderRadius: _angular_core.InputSignal<string | undefined>;
     isGrouped: _angular_core.ModelSignal<boolean>;
-    groupPosition: _angular_core.ModelSignal<"middle" | "first" | "last" | undefined>;
+    groupPosition: _angular_core.ModelSignal<"first" | "middle" | "last" | undefined>;
     click: _angular_core.OutputEmitterRef<MouseEvent>;
     onClick: _angular_core.OutputEmitterRef<MouseEvent>;
     protected _normalizedIcon: _angular_core.Signal<XSButtonIcon | null>;
@@ -2041,7 +2041,7 @@ declare class XSButtonGroupService {
 declare class XSIconComponent {
     private library;
     icon: _angular_core.InputSignal<string | string[] | [IconPrefix, IconName] | _fortawesome_fontawesome_common_types.IconLookup>;
-    size: _angular_core.InputSignal<"sm" | "lg" | "normal" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl">;
+    size: _angular_core.InputSignal<"sm" | "normal" | "xs" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl">;
     class: _angular_core.InputSignal<string>;
     resolvedIcon: _angular_core.Signal<IconProp | IconDefinition>;
     isValidIcon: _angular_core.Signal<boolean>;
@@ -2302,9 +2302,9 @@ declare class XSImageComponent {
     alt: _angular_core.InputSignal<string | undefined>;
     width: _angular_core.InputSignal<string | number | undefined>;
     height: _angular_core.InputSignal<string | number | undefined>;
-    size: _angular_core.InputSignal<"sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "full" | undefined>;
-    rounded: _angular_core.InputSignal<"sm" | "none" | "md" | "lg" | "xl" | "2xl" | "full" | "3xl" | undefined>;
-    objectFit: _angular_core.InputSignal<"fill" | "none" | "contain" | "cover" | "scale-down" | undefined>;
+    size: _angular_core.InputSignal<"md" | "sm" | "xs" | "lg" | "xl" | "2xl" | "full" | undefined>;
+    rounded: _angular_core.InputSignal<"md" | "sm" | "lg" | "xl" | "2xl" | "full" | "none" | "3xl" | undefined>;
+    objectFit: _angular_core.InputSignal<"cover" | "fill" | "none" | "contain" | "scale-down" | undefined>;
     clickable: _angular_core.InputSignal<boolean | undefined>;
     item: _angular_core.InputSignal<XSImageItem | null | undefined>;
     typeItem: _angular_core.InputSignal<string | undefined>;
@@ -2354,7 +2354,7 @@ declare class XSStatsCardComponent {
         likes?: number;
         comments?: number;
     } | undefined>;
-    type: _angular_core.InputSignal<"visits" | "comments" | "likes">;
+    type: _angular_core.InputSignal<"comments" | "likes" | "visits">;
     stats: _angular_core.InputSignal<{
         currentValue: number;
         differencePercent: string;
@@ -3201,8 +3201,8 @@ declare class XSListComponent {
     initialLoading: _angular_core.InputSignal<boolean>;
     columns: _angular_core.InputSignal<1 | 2 | 3>;
     isLink: _angular_core.InputSignal<boolean>;
-    size: _angular_core.InputSignal<"small" | "profile" | "normal">;
-    hasScroll: _angular_core.InputSignal<boolean | "mobile" | "lg" | "xl">;
+    size: _angular_core.InputSignal<"small" | "normal" | "profile">;
+    hasScroll: _angular_core.InputSignal<boolean | "lg" | "xl" | "mobile">;
     class: _angular_core.InputSignal<string | undefined>;
     rounded: _angular_core.InputSignal<boolean>;
     showChevron: _angular_core.InputSignal<boolean>;
@@ -3266,7 +3266,7 @@ type XSFormlyOptions = FormlyFormOptions;
 declare class XSFormlyComponent implements AfterViewInit {
     private translateService;
     form: FormGroup<{}>;
-    readonly layout: _angular_core.InputSignal<"stack" | "grid">;
+    readonly layout: _angular_core.InputSignal<"grid" | "stack">;
     readonly gridClass: _angular_core.InputSignal<string>;
     readonly size: _angular_core.InputSignal<"normal" | "compact">;
     readonly fields: _angular_core.InputSignal<XSFormlyFields>;
@@ -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?: {
@@ -3580,6 +3580,12 @@ interface XSModalOptions {
     title?: string;
     subTitle?: string;
     buttons?: XSButtonI[];
+    /**
+     * Reservado: actualmente sin efecto en el layout (el contenido
+     * ya desplaza de forma independiente y el footer es persistente
+     * por construcción flex). Se conserva por compatibilidad para
+     * un futuro control de overflow del contenido.
+     */
     hasOverflow?: boolean;
     closeOnBackdropClick?: boolean;
 }
@@ -4673,7 +4679,7 @@ declare class XSProfileExclusiveComponent {
         exclusive?: boolean;
     }>;
     readonly type: _angular_core.InputSignal<"artist" | "media">;
-    readonly subType: _angular_core.InputSignal<"podcast" | "radioshow" | "set" | "track" | undefined>;
+    readonly subType: _angular_core.InputSignal<"set" | "track" | "podcast" | "radioshow" | undefined>;
     readonly message: _angular_core.InputSignal<string>;
     readonly link: _angular_core.InputSignal<boolean>;
     urlLogo: string;
@@ -4764,7 +4770,7 @@ interface ProfileImageItem {
 declare class XSProfileImageComponent implements OnInit {
     readonly item: _angular_core.InputSignal<ProfileImageItem>;
     readonly type: _angular_core.InputSignal<"artist" | "event" | "equipment" | "media" | "organization" | "site">;
-    readonly subType: _angular_core.InputSignal<"club" | "collective" | "festival" | "label" | "medio" | "podcast" | "promoter" | "radio" | "radioshow" | "set" | "track" | undefined>;
+    readonly subType: _angular_core.InputSignal<"club" | "festival" | "set" | "track" | "podcast" | "radioshow" | "promoter" | "label" | "collective" | "radio" | "medio" | undefined>;
     readonly totalDays: _angular_core.InputSignal<number | undefined>;
     readonly heightImage: _angular_core.InputSignal<number>;
     readonly viewTransitionName: _angular_core.InputSignal<string | undefined>;
@@ -4995,7 +5001,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<"soundcloud" | "youtube">;
+    protected primaryVariant: _angular_core.Signal<"youtube" | "soundcloud">;
     protected activeFormFields: _angular_core.Signal<FormlyFieldConfig<_ngx_formly_core.FormlyFieldProps & {
         [additionalProperties: string]: any;
     }>[]>;
@@ -5473,7 +5479,7 @@ declare class XSTableItemsComponent<TType extends string = XSTableHeaderType, TI
     getRemainingPercentage(item: TItem): number;
     getUrlStatsPage: (item: TItem) => string;
     getNameOrCategoryEvent(event: string, type: 'name' | 'category' | 'value'): string | null;
-    getSubStatePromotion(item: TItem): "finished" | "inProgress" | "schedule";
+    getSubStatePromotion(item: TItem): "schedule" | "finished" | "inProgress";
     getColorForType(type: string): string;
     getColorForStyle(style: TItem): string;
     getLevelName: (item: TItem) => string | undefined;
@@ -5595,7 +5601,7 @@ declare class XSItemTypeComponent {
     itemType: _angular_core.InputSignal<XSGenericItemType>;
     isLink: _angular_core.InputSignal<boolean>;
     showChevron: _angular_core.InputSignal<boolean>;
-    size: _angular_core.InputSignal<"small" | "profile" | "normal">;
+    size: _angular_core.InputSignal<"small" | "normal" | "profile">;
     rounded: _angular_core.InputSignal<boolean>;
     loading: _angular_core.InputSignal<boolean>;
     readonly onClick: _angular_core.OutputEmitterRef<XSItemData>;
@@ -5607,7 +5613,7 @@ declare abstract class XSItemTypeBaseComponent {
     item: _angular_core.InputSignal<XSItemData>;
     isLink: _angular_core.InputSignal<boolean>;
     showChevron: _angular_core.InputSignal<boolean>;
-    size: _angular_core.InputSignal<"small" | "profile" | "normal">;
+    size: _angular_core.InputSignal<"small" | "normal" | "profile">;
     rounded: _angular_core.InputSignal<boolean>;
     loading: _angular_core.InputSignal<boolean>;
     readonly onClick: _angular_core.OutputEmitterRef<XSItemData>;
@@ -5825,7 +5831,7 @@ declare class XSMapInfoBlockComponent implements OnChanges {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XSMapInfoBlockComponent, "xs-map-info-block", never, { "item": { "alias": "item"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "subtype": { "alias": "subtype"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "showEvents": { "alias": "showEvents"; "required": false; "isSignal": true; }; }, { "type": "typeChange"; "subtype": "subtypeChange"; "clickItem": "clickItem"; "clickEvent": "clickEvent"; "closeClick": "closeClick"; }, never, ["[custom-info]", "*"], true, never>;
 }
 
-declare const STANDALONE_PIPES: (typeof XSDateFormatPipe | typeof CountryFlagPipe | typeof ImageApiPipe | typeof TruncateTextPipe | typeof SliceArrayPipe | typeof DateLongPipe | typeof NumberDaysPipe | typeof VisitsMonthTotalPipe | typeof RandomImagePipe | typeof TimeAgoPipe | typeof TableLinkPipe | typeof TitleMediaPipe | typeof SocialPipe | typeof IncludeEventPipe | typeof FilterArrayPipe | typeof XSFindLabelByValuePipe)[];
+declare const STANDALONE_PIPES: (typeof CountryFlagPipe | typeof CountryNamePipe | typeof DateLongPipe | typeof XSDateFormatPipe | typeof ImageApiPipe | typeof SliceArrayPipe | typeof TruncateTextPipe | typeof NumberDaysPipe | typeof VisitsMonthTotalPipe | typeof RandomImagePipe | typeof TimeAgoPipe | typeof TableLinkPipe | typeof TitleMediaPipe | typeof SocialPipe | typeof IncludeEventPipe | typeof FilterArrayPipe | typeof XSFindLabelByValuePipe)[];
 
 declare const LIB_STORIES: Array<() => Promise<any>>;
 

package/package.json

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

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

@@ -1,199 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, inject, ChangeDetectionStrategy, Component } from '@angular/core';
-import { XSModalService, XSModalImageSearchComponent, XSButtonComponent } from './xsmusices-ui.mjs';
-
-class ModalExampleComponent {
-    activeModal = input(...(ngDevMode ? [undefined, { debugName: "activeModal" }] : []));
-    modalService = inject(XSModalService);
-    openConfirm() {
-        this.modalService
-            .openConfirm({
-            title: 'Confirmar eliminación',
-            subTitle: '¿Estás seguro de que quieres eliminar este elemento?',
-            labelAccept: 'Sí, eliminar',
-            labelCancel: 'Cancelar',
-            type: 'centered',
-        })
-            .subscribe((_result) => { });
-    }
-    openInfo() {
-        this.modalService
-            .openInfo({
-            title: 'Información importante',
-            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>',
-            labelClose: 'Entendido',
-            type: 'centered',
-        })
-            .subscribe(() => { });
-    }
-    openInput() {
-        this.modalService
-            .openInput({
-            title: 'Ingrese su nombre',
-            subTitle: 'Necesitamos su nombre para continuar',
-            placeholder: 'Escriba su nombre aquí...',
-            minLength: 2,
-            maxLength: 50,
-            labelAccept: 'Guardar',
-            labelCancel: 'Cancelar',
-            type: 'centered',
-        })
-            .subscribe((_result) => { });
-    }
-    openClaim() {
-        this.modalService
-            .openClaim({
-            title: 'Reclamar elemento',
-            subTitle: 'Esta acción requiere justificación',
-            warningMsg: '¿Estás seguro de que quieres reclamar este elemento?',
-            enterReason: 'Por favor explica el motivo de la reclamación',
-            labelAccept: 'Reclamar',
-            labelCancel: 'Cancelar',
-            type: 'centered',
-        })
-            .subscribe((_result) => { });
-    }
-    openImageSearch() {
-        this.modalService
-            .open(XSModalImageSearchComponent, {
-            type: 'bottom-sheet',
-            title: 'Scraping de imágenes',
-            subTitle: 'Busca y selecciona una imagen',
-            data: {
-                q: 'music',
-                searchImages: async (query, limit) => {
-                    const images = Array.from({ length: limit }, (_, i) => `https://picsum.photos/seed/${encodeURIComponent(query)}${i}/300/300`);
-                    return { images };
-                },
-            },
-        })
-            .subscribe((_result) => { });
-    }
-    openImageSearchWithSources() {
-        const mockSoundcloudSearch = async (query) => {
-            return {
-                images: [
-                    `https://picsum.photos/seed/soundcloud-${encodeURIComponent(query)}/300/300`,
-                ],
-            };
-        };
-        const mockGoogleSearch = async (query, limit, start) => {
-            const totalResults = 15;
-            const offset = start ?? 1;
-            const images = Array.from({ length: Math.min(limit, totalResults - offset + 1) }, (_, i) => `https://picsum.photos/seed/${encodeURIComponent(query)}-g-${offset + i}/300/300`);
-            return { images, totalResults };
-        };
-        this.modalService
-            .open(XSModalImageSearchComponent, {
-            type: 'bottom-sheet',
-            title: 'Scraping de imágenes',
-            subTitle: 'Busca en Google Images y SoundCloud',
-            data: {
-                q: 'music',
-                sources: [
-                    {
-                        id: 'google',
-                        label: 'Google Images',
-                        searchImages: mockGoogleSearch,
-                    },
-                    {
-                        id: 'soundcloud',
-                        label: 'SoundCloud',
-                        searchImages: mockSoundcloudSearch,
-                    },
-                ],
-            },
-        })
-            .subscribe((_result) => { });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.33", ngImport: i0, type: ModalExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.33", type: ModalExampleComponent, isStandalone: true, selector: "modal-example", inputs: { activeModal: { classPropertyName: "activeModal", publicName: "activeModal", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "modal-example-host": "" } }, ngImport: i0, template: "    <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\u00F3n'\"\n            (onClick)=\"openConfirm()\"\n          ></xs-button>\n        }\n        @if (activeModal() === 'info' || !activeModal()) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Informaci\u00F3n'\"\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\u00FAsqueda de Im\u00E1genes'\"\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", dependencies: [{ kind: "component", type: XSButtonComponent, selector: "xs-button", inputs: ["id", "label", "type", "icon", "action", "customClass", "variant", "layout", "badgeCount", "isFull", "disabled", "loading", "title", "ariaLabel", "borderRadius", "isGrouped", "groupPosition"], outputs: ["isGroupedChange", "groupPositionChange", "click", "onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImport: i0, type: ModalExampleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'modal-example', host: { 'modal-example-host': '' }, changeDetection: ChangeDetectionStrategy.OnPush, imports: [XSButtonComponent], template: "    <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\u00F3n'\"\n            (onClick)=\"openConfirm()\"\n          ></xs-button>\n        }\n        @if (activeModal() === 'info' || !activeModal()) {\n          <xs-button\n            variant=\"primary\"\n            [label]=\"'Abrir Modal de Informaci\u00F3n'\"\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\u00FAsqueda de Im\u00E1genes'\"\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" }]
-        }], propDecorators: { activeModal: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeModal", required: false }] }] } });
-
-const story = {
-    id: 'modal',
-    name: 'Modal',
-    type: 'component',
-    subtype: 'Base',
-    status: 'active',
-    usage: ['admin', 'app', 'monitor'],
-    updated: '2026-05-30T12:00:00.000Z',
-    created: '2025-07-29T15:06:52.383Z',
-    description: 'Componente Modal con diferentes tipos predefinidos y soporte multi-idioma automático con traducciones expandidas.',
-    component: ModalExampleComponent,
-    selector: 'xs-modal',
-    multilanguage: true,
-    inputs: [
-        {
-            key: 'activeModal',
-            label: 'Modal activo',
-            type: 'select',
-            options: [
-                'confirm',
-                'info',
-                'input',
-                'claim',
-                'imageSearch',
-                'imageSearchSources',
-            ],
-            default: null,
-        },
-    ],
-    examples: [
-        {
-            name: 'Confirm Modal',
-            description: 'Modal de confirmación para acciones del usuario',
-            inputs: {
-                activeModal: 'confirm',
-            },
-        },
-        {
-            name: 'Info Modal',
-            description: 'Modal de información para mostrar mensajes al usuario',
-            inputs: {
-                activeModal: 'info',
-            },
-        },
-        {
-            name: 'Input Modal',
-            description: 'Modal para solicitar entrada de datos del usuario',
-            inputs: {
-                activeModal: 'input',
-            },
-        },
-        {
-            name: 'Claim Modal',
-            description: 'Modal de reclamación con campo de justificación',
-            inputs: {
-                activeModal: 'claim',
-            },
-        },
-        {
-            name: 'Image Search Modal',
-            description: 'Modal de búsqueda de imágenes con input y resultados en grid',
-            inputs: {
-                activeModal: 'imageSearch',
-            },
-        },
-        {
-            name: 'Image Search con Google + SoundCloud',
-            description: 'Modal de búsqueda de imágenes con múltiples fuentes: Google Images y SoundCloud',
-            inputs: {
-                activeModal: 'imageSearchSources',
-            },
-        },
-    ],
-    coverage: {
-        statements: 38,
-        branches: 11,
-        functions: 45,
-        lines: 38,
-    },
-};
-
-export { story };
-//# sourceMappingURL=xsmusices-ui-xs-modal.xsstory-B96CYHF0.mjs.map

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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"}