@agorapulse/ui-components 17.5.0-beta.2 → 17.5.1-beta.0

package/fesm2022/agorapulse-ui-components-social-button.mjs

@@ -110,7 +110,7 @@ class SocialButtonComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SocialButtonComponent, deps: [{ token: i1.SymbolRegistry }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: SocialButtonComponent, isStandalone: true, selector: "ap-social-button", inputs: { ariaLabel: "ariaLabel", disabled: ["disabled", "disabled", booleanAttribute], name: "name", loading: "loading", network: "network", buttonType: "buttonType" }, outputs: { click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "disabled || null" } }, providers: [], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], hostDirectives: [{ directive: i2.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    role=\"button\"\n    [class.stroked]=\"buttonType === 'stroked'\"\n    [class.facebook]=\"network === 'facebook'\"\n    [class.twitter]=\"network === 'twitter'\"\n    [class.x]=\"network === 'X'\"\n    [class.instagram]=\"network === 'instagram'\"\n    [class.linkedin]=\"network === 'linkedin'\"\n    [class.youtube]=\"network === 'youtube'\"\n    [class.tiktok]=\"network === 'tiktok'\"\n    [class.microsoft]=\"network === 'microsoft'\"\n    [class.google-my-business]=\"network === 'googleMyBusiness'\"\n    [class.google]=\"network === 'google'\"\n    [class.pinterest]=\"network === 'pinterest'\"\n    [class.loading]=\"loading\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\">\n    @if (!loading) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolIdPerNetwork[network][buttonType]\" />\n    }\n    @if (loading) {\n        <ap-loader\n            [color]=\"buttonType === 'default' ? 'white' : network\"\n            [diameter]=\"16\" />\n    }\n    <ng-content select=\"span\" />\n</button>\n", styles: ["ap-social-button{display:inline-flex;position:relative}ap-social-button[disabled]{pointer-events:none}ap-social-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:var(--comp-button-spacing);max-height:var(--comp-button-height);min-height:var(--comp-button-height);width:100%}ap-social-button button ap-loader{display:flex;justify-content:center;align-items:center}ap-social-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-social-button button.loading{pointer-events:none}ap-social-button button:disabled{pointer-events:none}@media (hover: hover){ap-social-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-social-button button span{font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-social-button button.facebook{background-color:var(--ref-color-facebook-100)}ap-social-button button.facebook span,ap-social-button button.facebook ap-symbol{color:var(--ref-color-white)}ap-social-button button.facebook:hover{background-color:#398af3}ap-social-button button.facebook:active:not(:disabled){background-color:#6ea9f7}ap-social-button button.facebook:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.facebook.loading{background-color:#6ea9f7}ap-social-button button.facebook.stroked{background:transparent;border:1px solid var(--ref-color-facebook-100)}ap-social-button button.facebook.stroked span{color:var(--ref-color-facebook-100)}ap-social-button button.facebook.stroked:hover{background:transparent;border-color:#398af3}ap-social-button button.facebook.stroked:hover span{color:#398af3}ap-social-button button.facebook.stroked:active:not(:disabled){background:transparent;border-color:#5da0f6}ap-social-button button.facebook.stroked:active:not(:disabled) span{color:#5da0f6}ap-social-button button.facebook.stroked:focus:not(:disabled):not(:active){background:transparent;border-color:var(--ref-color-facebook-100)}ap-social-button button.facebook.stroked:disabled{opacity:.2}ap-social-button button.facebook.stroked.loading{background:transparent;border-color:#5da0f6}ap-social-button button.facebook.stroked.loading span{color:#5da0f6}ap-social-button button.twitter,ap-social-button button.x{background-color:var(--ref-color-x-100)}ap-social-button button.twitter span,ap-social-button button.twitter ap-symbol,ap-social-button button.x span,ap-social-button button.x ap-symbol{color:var(--ref-color-white)}ap-social-button button.twitter:hover,ap-social-button button.x:hover{background-color:#313131}ap-social-button button.twitter:active:not(:disabled),ap-social-button button.x:active:not(:disabled){background-color:#626262}ap-social-button button.twitter:disabled,ap-social-button button.x:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.twitter.loading,ap-social-button button.x.loading{background-color:#626262}ap-social-button button.twitter.stroked,ap-social-button button.x.stroked{background:transparent;border:1px solid var(--ref-color-x-100)}ap-social-button button.twitter.stroked span,ap-social-button button.twitter.stroked ap-symbol,ap-social-button button.x.stroked span,ap-social-button button.x.stroked ap-symbol{color:var(--ref-color-x-100)}ap-social-button button.twitter.stroked:hover,ap-social-button button.x.stroked:hover{background:transparent;border-color:#313131}ap-social-button button.twitter.stroked:hover span,ap-social-button button.x.stroked:hover span{color:#313131}ap-social-button button.twitter.stroked:disabled,ap-social-button button.x.stroked:disabled{border:1px solid var(--ref-color-grey-20)}ap-social-button button.twitter.stroked:disabled ap-symbol,ap-social-button button.x.stroked:disabled ap-symbol{opacity:.2}ap-social-button button.twitter.stroked:disabled span,ap-social-button button.x.stroked:disabled span{color:var(--ref-color-grey-20)}ap-social-button button.twitter.stroked:active:not(:disabled),ap-social-button button.x.stroked:active:not(:disabled){border-color:#626262;background:transparent}ap-social-button button.twitter.stroked:active:not(:disabled) span,ap-social-button button.x.stroked:active:not(:disabled) span{color:#626262}ap-social-button button.twitter.stroked:focus:not(:disabled):not(:active),ap-social-button button.x.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-x-100);background:transparent}ap-social-button button.twitter.stroked.loading,ap-social-button button.x.stroked.loading{border-color:var(--ref-color-x-100);background:transparent}ap-social-button button.instagram{background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5)}ap-social-button button.instagram span,ap-social-button button.instagram ap-symbol{color:var(--ref-color-white)}ap-social-button button.instagram ap-symbol{box-shadow:0 0 4px #0000001f;border-radius:8px}ap-social-button button.instagram:hover{background:linear-gradient(90deg,#fee49a,#fcb178 26.56%,#dc478a 50.52%,#a942d1 73.96%,#6b75db)}ap-social-button button.instagram:active:not(:disabled){background:linear-gradient(90deg,#fff3d1,#fcb178 26.56%,#e576a8 50.52%,#bd6fdc 73.96%,#989fe6)}ap-social-button button.instagram:disabled{background:var(--ref-color-grey-20)}ap-social-button button.instagram.loading{background:linear-gradient(90deg,#fff3d1,#fcb178 26.56%,#e576a8 50.52%,#bd6fdc 73.96%,#989fe6)}ap-social-button button.instagram.stroked{background:transparent;border:solid 1px transparent;overflow:visible}ap-social-button button.instagram.stroked:after{content:\"\";position:absolute;border-radius:4px;padding:1px;background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5);inset:-.9px -1px -1px;z-index:1;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;height:calc(var(--comp-button-height) - 2px)}ap-social-button button.instagram.stroked span{background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;z-index:2}ap-social-button button.instagram.stroked ap-symbol{box-shadow:none;z-index:2}ap-social-button button.instagram.stroked:hover{background:transparent}ap-social-button button.instagram.stroked:hover:before{background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5)}ap-social-button button.instagram.stroked:active:not(:disabled){background:transparent}ap-social-button button.instagram.stroked:focus:not(:disabled):not(:active){background:transparent}ap-social-button button.instagram.stroked:disabled{opacity:.2}ap-social-button button.instagram.stroked.loading{background:transparent}ap-social-button button.linkedin{background-color:var(--ref-color-linkedin-100)}ap-social-button button.linkedin span,ap-social-button button.linkedin ap-symbol{color:var(--ref-color-white)}ap-social-button button.linkedin:hover{background-color:#2c78ce}ap-social-button button.linkedin:active:not(:disabled){background-color:#5795db}ap-social-button button.linkedin:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.linkedin.loading{background-color:#5795db}ap-social-button button.linkedin.stroked{background:transparent;border:1px solid var(--ref-color-linkedin-100)}ap-social-button button.linkedin.stroked span{color:var(--ref-color-linkedin-100)}ap-social-button button.linkedin.stroked:hover{background:transparent;border-color:#2c78ce}ap-social-button button.linkedin.stroked:hover span{color:#2c78ce}ap-social-button button.linkedin.stroked:active:not(:disabled){border-color:#5795db;background:transparent}ap-social-button button.linkedin.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-linkedin-100);background:transparent}ap-social-button button.linkedin.stroked:disabled{opacity:.2}ap-social-button button.linkedin.stroked.loading{border-color:var(--ref-color-linkedin-100);background:transparent}ap-social-button button.youtube{background-color:var(--ref-color-youtube-100)}ap-social-button button.youtube span,ap-social-button button.youtube ap-symbol{color:var(--ref-color-white)}ap-social-button button.youtube:hover{background-color:#f94242}ap-social-button button.youtube:active:not(:disabled){background-color:#fe5d5d}ap-social-button button.youtube:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.youtube.loading{background-color:#fe5d5d}ap-social-button button.youtube.stroked{background:transparent;border:1px solid var(--ref-color-youtube-100)}ap-social-button button.youtube.stroked span{color:var(--ref-color-youtube-100)}ap-social-button button.youtube.stroked:hover{background:transparent;border-color:#f94242}ap-social-button button.youtube.stroked:hover span{color:#f94242}ap-social-button button.youtube.stroked:active:not(:disabled){border-color:#fe5d5d;color:#fe5d5d;background:transparent}ap-social-button button.youtube.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-youtube-100);background:transparent}ap-social-button button.youtube.stroked:disabled{opacity:.2}ap-social-button button.youtube.stroked.loading{border-color:var(--ref-color-youtube-100);background:transparent}ap-social-button button.pinterest{background-color:var(--ref-color-pinterest-100)}ap-social-button button.pinterest span,ap-social-button button.pinterest ap-symbol{color:var(--ref-color-white)}ap-social-button button.pinterest:hover{background-color:#eb4242}ap-social-button button.pinterest:active:not(:disabled){background-color:#f47171}ap-social-button button.pinterest:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.pinterest.loading{background-color:#fcbbbb}ap-social-button button.pinterest.stroked{background:transparent;border:1px solid var(--ref-color-pinterest-100)}ap-social-button button.pinterest.stroked span{color:var(--ref-color-pinterest-100)}ap-social-button button.pinterest.stroked:hover{background:transparent;border-color:#eb4242}ap-social-button button.pinterest.stroked:hover span{color:#eb4242}ap-social-button button.pinterest.stroked:active:not(:disabled){border-color:#f47171;color:#f47171;background:transparent}ap-social-button button.pinterest.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-pinterest-100);background:transparent}ap-social-button button.pinterest.stroked:disabled{opacity:.2}ap-social-button button.pinterest.stroked.loading{border-color:var(--ref-color-pinterest-100);background:transparent}ap-social-button button.tiktok{background-color:var(--ref-color-tiktok-default-100)}ap-social-button button.tiktok span,ap-social-button button.tiktok ap-symbol{color:var(--ref-color-white)}ap-social-button button.tiktok:hover{background-color:#202020}ap-social-button button.tiktok:active:not(:disabled){background-color:#2e2e2e}ap-social-button button.tiktok:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.tiktok.loading{background-color:#2e2e2e}ap-social-button button.tiktok.stroked{background:transparent;border:1px solid var(--ref-color-tiktok-default-100)}ap-social-button button.tiktok.stroked span{color:var(--ref-color-tiktok-default-100)}ap-social-button button.tiktok.stroked:hover{background:transparent;border-color:#202020}ap-social-button button.tiktok.stroked:hover span{color:#202020}ap-social-button button.tiktok.stroked:active:not(:disabled){border-color:#2e2e2e;background:transparent}ap-social-button button.tiktok.stroked:active:not(:disabled) span{color:#2e2e2e}ap-social-button button.tiktok.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-twitter-100--ref-color-tiktok-default-100);background:transparent}ap-social-button button.tiktok.stroked:disabled{opacity:.2}ap-social-button button.tiktok.stroked.loading{border-color:var(--ref-color-twitter-100--ref-color-tiktok-default-100);background:transparent}ap-social-button button.google,ap-social-button button.microsoft,ap-social-button button.google-my-business{background:transparent;border-width:1px;border-style:solid;color:var(--ref-color-grey-80);border-color:var(--ref-color-grey-20)}ap-social-button button.google ap-symbol,ap-social-button button.microsoft ap-symbol,ap-social-button button.google-my-business ap-symbol{color:var(--ref-color-grey-80)}ap-social-button button.google:hover,ap-social-button button.microsoft:hover,ap-social-button button.google-my-business:hover{border-color:var(--ref-color-grey-40)}ap-social-button button.google:active:not(:disabled),ap-social-button button.microsoft:active:not(:disabled),ap-social-button button.google-my-business:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-social-button button.google:focus:not(:disabled):not(:active),ap-social-button button.microsoft:focus:not(:disabled):not(:active),ap-social-button button.google-my-business:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-social-button button.google:disabled,ap-social-button button.microsoft:disabled,ap-social-button button.google-my-business:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-social-button button.google:disabled ap-symbol,ap-social-button button.microsoft:disabled ap-symbol,ap-social-button button.google-my-business:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-social-button button.google.loading,ap-social-button button.microsoft.loading,ap-social-button button.google-my-business.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-social-button button.google.loading ap-symbol,ap-social-button button.microsoft.loading ap-symbol,ap-social-button button.google-my-business.loading ap-symbol{color:var(--ref-color-grey-40)}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "component", type: LoaderComponent, selector: "ap-loader", inputs: ["color", "diameter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: SocialButtonComponent, isStandalone: true, selector: "ap-social-button", inputs: { ariaLabel: "ariaLabel", disabled: ["disabled", "disabled", booleanAttribute], name: "name", loading: "loading", network: "network", buttonType: "buttonType" }, outputs: { click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "disabled || null" } }, providers: [], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], hostDirectives: [{ directive: i2.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    role=\"button\"\n    [class.stroked]=\"buttonType === 'stroked'\"\n    [class.facebook]=\"network === 'facebook'\"\n    [class.twitter]=\"network === 'twitter'\"\n    [class.x]=\"network === 'X'\"\n    [class.instagram]=\"network === 'instagram'\"\n    [class.linkedin]=\"network === 'linkedin'\"\n    [class.youtube]=\"network === 'youtube'\"\n    [class.tiktok]=\"network === 'tiktok'\"\n    [class.microsoft]=\"network === 'microsoft'\"\n    [class.google-my-business]=\"network === 'googleMyBusiness'\"\n    [class.google]=\"network === 'google'\"\n    [class.pinterest]=\"network === 'pinterest'\"\n    [class.loading]=\"loading\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\">\n    @if (!loading) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolIdPerNetwork[network][buttonType]\" />\n    }\n    @if (loading) {\n        <ap-loader\n            [color]=\"buttonType === 'default' ? 'white' : network\"\n            [diameter]=\"16\" />\n    }\n    <ng-content select=\"span\" />\n</button>\n", styles: ["ap-social-button{display:inline-flex;position:relative}ap-social-button[disabled]{pointer-events:none}ap-social-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:var(--comp-button-spacing);max-height:var(--comp-button-height);min-height:var(--comp-button-height);width:100%}ap-social-button button ap-loader{display:flex;justify-content:center;align-items:center}ap-social-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-social-button button.loading{pointer-events:none}ap-social-button button:disabled{pointer-events:none}@media (hover: hover){ap-social-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-social-button button span{font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-social-button button.facebook{background-color:var(--ref-color-facebook-100)}ap-social-button button.facebook span,ap-social-button button.facebook ap-symbol{color:var(--ref-color-white)}ap-social-button button.facebook:hover{background-color:#398af3}ap-social-button button.facebook:active:not(:disabled){background-color:#6ea9f7}ap-social-button button.facebook:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.facebook.loading{background-color:#6ea9f7}ap-social-button button.facebook.stroked{background:transparent;border:1px solid var(--ref-color-facebook-100)}ap-social-button button.facebook.stroked span{color:var(--ref-color-facebook-100)}ap-social-button button.facebook.stroked:hover{background:transparent;border-color:#398af3}ap-social-button button.facebook.stroked:hover span{color:#398af3}ap-social-button button.facebook.stroked:active:not(:disabled){background:transparent;border-color:#5da0f6}ap-social-button button.facebook.stroked:active:not(:disabled) span{color:#5da0f6}ap-social-button button.facebook.stroked:focus:not(:disabled):not(:active){background:transparent;border-color:var(--ref-color-facebook-100)}ap-social-button button.facebook.stroked:disabled{opacity:.2}ap-social-button button.facebook.stroked.loading{background:transparent;border-color:#5da0f6}ap-social-button button.facebook.stroked.loading span{color:#5da0f6}ap-social-button button.twitter,ap-social-button button.x{background-color:var(--ref-color-x-100)}ap-social-button button.twitter span,ap-social-button button.twitter ap-symbol,ap-social-button button.x span,ap-social-button button.x ap-symbol{color:var(--ref-color-white)}ap-social-button button.twitter:hover,ap-social-button button.x:hover{background-color:#313131}ap-social-button button.twitter:active:not(:disabled),ap-social-button button.x:active:not(:disabled){background-color:#626262}ap-social-button button.twitter:disabled,ap-social-button button.x:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.twitter.loading,ap-social-button button.x.loading{background-color:#626262}ap-social-button button.twitter.stroked,ap-social-button button.x.stroked{background:transparent;border:1px solid var(--ref-color-x-100)}ap-social-button button.twitter.stroked span,ap-social-button button.twitter.stroked ap-symbol,ap-social-button button.x.stroked span,ap-social-button button.x.stroked ap-symbol{color:var(--ref-color-x-100)}ap-social-button button.twitter.stroked:hover,ap-social-button button.x.stroked:hover{background:transparent;border-color:#313131}ap-social-button button.twitter.stroked:hover span,ap-social-button button.x.stroked:hover span{color:#313131}ap-social-button button.twitter.stroked:disabled,ap-social-button button.x.stroked:disabled{border:1px solid var(--ref-color-grey-20)}ap-social-button button.twitter.stroked:disabled ap-symbol,ap-social-button button.x.stroked:disabled ap-symbol{opacity:.2}ap-social-button button.twitter.stroked:disabled span,ap-social-button button.x.stroked:disabled span{color:var(--ref-color-grey-20)}ap-social-button button.twitter.stroked:active:not(:disabled),ap-social-button button.x.stroked:active:not(:disabled){border-color:#626262;background:transparent}ap-social-button button.twitter.stroked:active:not(:disabled) span,ap-social-button button.x.stroked:active:not(:disabled) span{color:#626262}ap-social-button button.twitter.stroked:focus:not(:disabled):not(:active),ap-social-button button.x.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-x-100);background:transparent}ap-social-button button.twitter.stroked.loading,ap-social-button button.x.stroked.loading{border-color:var(--ref-color-x-100);background:transparent}ap-social-button button.instagram{background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5)}ap-social-button button.instagram span,ap-social-button button.instagram ap-symbol{color:var(--ref-color-white)}ap-social-button button.instagram ap-symbol{box-shadow:0 0 4px #0000001f;border-radius:8px}ap-social-button button.instagram:hover{background:linear-gradient(90deg,#fee49a,#fcb178 26.56%,#dc478a 50.52%,#a942d1 73.96%,#6b75db)}ap-social-button button.instagram:active:not(:disabled){background:linear-gradient(90deg,#fff3d1,#fcb178 26.56%,#e576a8 50.52%,#bd6fdc 73.96%,#989fe6)}ap-social-button button.instagram:disabled{background:var(--ref-color-grey-20)}ap-social-button button.instagram.loading{background:linear-gradient(90deg,#fff3d1,#fcb178 26.56%,#e576a8 50.52%,#bd6fdc 73.96%,#989fe6)}ap-social-button button.instagram.stroked{background:transparent;border:solid 1px transparent;overflow:visible}ap-social-button button.instagram.stroked:after{content:\"\";position:absolute;border-radius:4px;padding:1px;background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5);inset:-.9px -1px -1px;z-index:1;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;height:calc(var(--comp-button-height) - 2px)}ap-social-button button.instagram.stroked span{background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;z-index:2}ap-social-button button.instagram.stroked ap-symbol{box-shadow:none;z-index:2}ap-social-button button.instagram.stroked:hover{background:transparent}ap-social-button button.instagram.stroked:hover:before{background:linear-gradient(90deg,#feda75,#fa7e1e 26.56%,#d62976 50.52%,#962fbf 73.96%,#4f5bd5)}ap-social-button button.instagram.stroked:active:not(:disabled){background:transparent}ap-social-button button.instagram.stroked:focus:not(:disabled):not(:active){background:transparent}ap-social-button button.instagram.stroked:disabled{opacity:.2}ap-social-button button.instagram.stroked.loading{background:transparent}ap-social-button button.linkedin{background-color:var(--ref-color-linkedin-100)}ap-social-button button.linkedin span,ap-social-button button.linkedin ap-symbol{color:var(--ref-color-white)}ap-social-button button.linkedin:hover{background-color:#2c78ce}ap-social-button button.linkedin:active:not(:disabled){background-color:#5795db}ap-social-button button.linkedin:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.linkedin.loading{background-color:#5795db}ap-social-button button.linkedin.stroked{background:transparent;border:1px solid var(--ref-color-linkedin-100)}ap-social-button button.linkedin.stroked span{color:var(--ref-color-linkedin-100)}ap-social-button button.linkedin.stroked:hover{background:transparent;border-color:#2c78ce}ap-social-button button.linkedin.stroked:hover span{color:#2c78ce}ap-social-button button.linkedin.stroked:active:not(:disabled){border-color:#5795db;background:transparent}ap-social-button button.linkedin.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-linkedin-100);background:transparent}ap-social-button button.linkedin.stroked:disabled{opacity:.2}ap-social-button button.linkedin.stroked.loading{border-color:var(--ref-color-linkedin-100);background:transparent}ap-social-button button.youtube{background-color:var(--ref-color-youtube-100)}ap-social-button button.youtube span,ap-social-button button.youtube ap-symbol{color:var(--ref-color-white)}ap-social-button button.youtube:hover{background-color:#f94242}ap-social-button button.youtube:active:not(:disabled){background-color:#fe5d5d}ap-social-button button.youtube:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.youtube.loading{background-color:#fe5d5d}ap-social-button button.youtube.stroked{background:transparent;border:1px solid var(--ref-color-youtube-100)}ap-social-button button.youtube.stroked span{color:var(--ref-color-youtube-100)}ap-social-button button.youtube.stroked:hover{background:transparent;border-color:#f94242}ap-social-button button.youtube.stroked:hover span{color:#f94242}ap-social-button button.youtube.stroked:active:not(:disabled){border-color:#fe5d5d;color:#fe5d5d;background:transparent}ap-social-button button.youtube.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-youtube-100);background:transparent}ap-social-button button.youtube.stroked:disabled{opacity:.2}ap-social-button button.youtube.stroked.loading{border-color:var(--ref-color-youtube-100);background:transparent}ap-social-button button.pinterest{background-color:var(--ref-color-pinterest-100)}ap-social-button button.pinterest span,ap-social-button button.pinterest ap-symbol{color:var(--ref-color-white)}ap-social-button button.pinterest:hover{background-color:#eb4242}ap-social-button button.pinterest:active:not(:disabled){background-color:#f47171}ap-social-button button.pinterest:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.pinterest.loading{background-color:#fcbbbb}ap-social-button button.pinterest.stroked{background:transparent;border:1px solid var(--ref-color-pinterest-100)}ap-social-button button.pinterest.stroked span{color:var(--ref-color-pinterest-100)}ap-social-button button.pinterest.stroked:hover{background:transparent;border-color:#eb4242}ap-social-button button.pinterest.stroked:hover span{color:#eb4242}ap-social-button button.pinterest.stroked:active:not(:disabled){border-color:#f47171;color:#f47171;background:transparent}ap-social-button button.pinterest.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-pinterest-100);background:transparent}ap-social-button button.pinterest.stroked:disabled{opacity:.2}ap-social-button button.pinterest.stroked.loading{border-color:var(--ref-color-pinterest-100);background:transparent}ap-social-button button.tiktok{background-color:var(--ref-color-tiktok-default-100)}ap-social-button button.tiktok span,ap-social-button button.tiktok ap-symbol{color:var(--ref-color-white)}ap-social-button button.tiktok:hover{background-color:#202020}ap-social-button button.tiktok:active:not(:disabled){background-color:#2e2e2e}ap-social-button button.tiktok:disabled{background-color:var(--ref-color-grey-20)}ap-social-button button.tiktok.loading{background-color:#2e2e2e}ap-social-button button.tiktok.stroked{background:transparent;border:1px solid var(--ref-color-tiktok-default-100)}ap-social-button button.tiktok.stroked span{color:var(--ref-color-tiktok-default-100)}ap-social-button button.tiktok.stroked:hover{background:transparent;border-color:#202020}ap-social-button button.tiktok.stroked:hover span{color:#202020}ap-social-button button.tiktok.stroked:active:not(:disabled){border-color:#2e2e2e;background:transparent}ap-social-button button.tiktok.stroked:active:not(:disabled) span{color:#2e2e2e}ap-social-button button.tiktok.stroked:focus:not(:disabled):not(:active){border-color:var(--ref-color-twitter-100--ref-color-tiktok-default-100);background:transparent}ap-social-button button.tiktok.stroked:disabled{opacity:.2}ap-social-button button.tiktok.stroked.loading{border-color:var(--ref-color-twitter-100--ref-color-tiktok-default-100);background:transparent}ap-social-button button.google,ap-social-button button.microsoft,ap-social-button button.google-my-business{background:transparent;border-width:1px;border-style:solid;color:var(--ref-color-grey-80);border-color:var(--ref-color-grey-20)}ap-social-button button.google ap-symbol,ap-social-button button.microsoft ap-symbol,ap-social-button button.google-my-business ap-symbol{color:var(--ref-color-grey-80)}ap-social-button button.google:hover,ap-social-button button.microsoft:hover,ap-social-button button.google-my-business:hover{border-color:var(--ref-color-grey-40)}ap-social-button button.google:active:not(:disabled),ap-social-button button.microsoft:active:not(:disabled),ap-social-button button.google-my-business:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-social-button button.google:focus:not(:disabled):not(:active),ap-social-button button.microsoft:focus:not(:disabled):not(:active),ap-social-button button.google-my-business:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-social-button button.google:disabled,ap-social-button button.microsoft:disabled,ap-social-button button.google-my-business:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-social-button button.google:disabled ap-symbol,ap-social-button button.microsoft:disabled ap-symbol,ap-social-button button.google-my-business:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-social-button button.google.loading,ap-social-button button.microsoft.loading,ap-social-button button.google-my-business.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-social-button button.google.loading ap-symbol,ap-social-button button.microsoft.loading ap-symbol,ap-social-button button.google-my-business.loading ap-symbol{color:var(--ref-color-grey-40)}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "component", type: LoaderComponent, selector: "ap-loader", inputs: ["color", "diameter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SocialButtonComponent, decorators: [{
             type: Component,

package/fesm2022/agorapulse-ui-components-social-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"agorapulse-ui-components-social-button.mjs","sources":["../../../libs/ui-components/social-button/src/social-button.component.ts","../../../libs/ui-components/social-button/src/social-button.component.html","../../../libs/ui-components/social-button/src/agorapulse-ui-components-social-button.ts"],"sourcesContent":["import {\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    inject,\n    Input,\n    Output,\n    ViewChild,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { LoaderComponent } from '@agorapulse/ui-animations';\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport {\n    apFacebook,\n    apInstagramOutline,\n    apLinkedin,\n    apLinkedinOfficial,\n    apPinterestIcon,\n    apPinterestOfficial,\n    apTiktokOfficial,\n    apTiktokWhiteOfficial,\n    apXOfficial,\n    apXWhiteOfficial,\n    apYoutube,\n    apYoutubeOfficial,\n    SymbolComponent,\n    SymbolRegistry,\n} from '@agorapulse/ui-symbol';\n\ntype Service =\n    | 'facebook'\n    | 'instagram'\n    | 'twitter'\n    | 'linkedin'\n    | 'youtube'\n    | 'tiktok'\n    | 'google'\n    | 'googleMyBusiness'\n    | 'microsoft'\n    | 'pinterest'\n    | 'X';\ntype SocialButtonType = 'default' | 'stroked';\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-social-button',\n    styleUrls: ['./social-button.component.scss'],\n    standalone: true,\n    imports: [SymbolComponent, LoaderComponent],\n    providers: [],\n    templateUrl: './social-button.component.html',\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [BaseButtonDirective],\n    // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n    host: {\n        '[attr.disabled]': 'disabled || null',\n    },\n})\nexport class SocialButtonComponent {\n    readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n    @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n    @Input() ariaLabel = '';\n    @Input({\n        transform: booleanAttribute,\n    })\n    disabled = false;\n    @Input({\n        required: true,\n    })\n    name = '';\n    @Input() loading = false;\n    @Input() network: Service = 'facebook';\n    @Input() buttonType: SocialButtonType = 'default';\n\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() click: EventEmitter<MouseEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n    symbolIdPerNetwork: Record<Service, Record<SocialButtonType, string>> = {\n        facebook: {\n            default: 'facebook',\n            stroked: 'facebook-official',\n        },\n        instagram: {\n            default: 'instagram-outline',\n            stroked: 'instagram-official',\n        },\n        twitter: {\n            default: 'x-white-official',\n            stroked: 'x-official',\n        },\n        X: {\n            default: 'x-white-official',\n            stroked: 'x-official',\n        },\n        linkedin: {\n            default: 'linkedin',\n            stroked: 'linkedin-official',\n        },\n        youtube: {\n            default: 'youtube',\n            stroked: 'youtube-official',\n        },\n        tiktok: {\n            default: 'tiktok-white-official',\n            stroked: 'tiktok-official',\n        },\n        google: {\n            default: 'google-icon',\n            stroked: 'google-official',\n        },\n        microsoft: {\n            default: 'microsoft-icon',\n            stroked: 'microsoft-official',\n        },\n        googleMyBusiness: {\n            default: 'google-my-business-icon',\n            stroked: 'google-my-business-official',\n        },\n        pinterest: {\n            default: 'pinterest-icon',\n            stroked: 'pinterest-official',\n        },\n    };\n\n    constructor(private symbolRegistry: SymbolRegistry) {\n        this.symbolRegistry.registerSymbols([\n            apFacebook,\n            apLinkedin,\n            apLinkedinOfficial,\n            apYoutubeOfficial,\n            apYoutube,\n            apInstagramOutline,\n            apTiktokOfficial,\n            apTiktokWhiteOfficial,\n            apPinterestIcon,\n            apPinterestOfficial,\n            apXOfficial,\n            apXWhiteOfficial,\n        ]);\n    }\n\n    focused: boolean = false;\n\n    onClickHandle($event: MouseEvent): void {\n        if (this.disabled || this.loading) {\n            return;\n        }\n        $event.stopImmediatePropagation();\n        this.click.emit($event);\n        this.buttonElement.nativeElement.blur();\n        this.blur.emit($event);\n    }\n\n    onBlurHandle($event: FocusEvent): void {\n        this.focused = false;\n        this.blur.emit($event);\n    }\n\n    onFocusHandle($event: FocusEvent): void {\n        this.focused = true;\n        this.focus.emit($event);\n    }\n\n    @HostListener('window:keyup.space', ['$event'])\n    onSpaceKeyUp(event: KeyboardEvent) {\n        if (this.focused && !this.disabled && !this.loading) {\n            event.preventDefault();\n            this.buttonElement.nativeElement.click();\n        }\n    }\n}\n","<button\n    #button\n    role=\"button\"\n    [class.stroked]=\"buttonType === 'stroked'\"\n    [class.facebook]=\"network === 'facebook'\"\n    [class.twitter]=\"network === 'twitter'\"\n    [class.x]=\"network === 'X'\"\n    [class.instagram]=\"network === 'instagram'\"\n    [class.linkedin]=\"network === 'linkedin'\"\n    [class.youtube]=\"network === 'youtube'\"\n    [class.tiktok]=\"network === 'tiktok'\"\n    [class.microsoft]=\"network === 'microsoft'\"\n    [class.google-my-business]=\"network === 'googleMyBusiness'\"\n    [class.google]=\"network === 'google'\"\n    [class.pinterest]=\"network === 'pinterest'\"\n    [class.loading]=\"loading\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\">\n    @if (!loading) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolIdPerNetwork[network][buttonType]\" />\n    }\n    @if (loading) {\n        <ap-loader\n            [color]=\"buttonType === 'default' ? 'white' : network\"\n            [diameter]=\"16\" />\n    }\n    <ng-content select=\"span\" />\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"agorapulse-ui-components-social-button.mjs","sources":["../../../libs/ui-components/social-button/src/social-button.component.ts","../../../libs/ui-components/social-button/src/social-button.component.html","../../../libs/ui-components/social-button/src/agorapulse-ui-components-social-button.ts"],"sourcesContent":["import {\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    inject,\n    Input,\n    Output,\n    ViewChild,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { LoaderComponent } from '@agorapulse/ui-animations';\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport {\n    apFacebook,\n    apInstagramOutline,\n    apLinkedin,\n    apLinkedinOfficial,\n    apPinterestIcon,\n    apPinterestOfficial,\n    apTiktokOfficial,\n    apTiktokWhiteOfficial,\n    apXOfficial,\n    apXWhiteOfficial,\n    apYoutube,\n    apYoutubeOfficial,\n    SymbolComponent,\n    SymbolRegistry,\n} from '@agorapulse/ui-symbol';\n\ntype Service =\n    | 'facebook'\n    | 'instagram'\n    | 'twitter'\n    | 'linkedin'\n    | 'youtube'\n    | 'tiktok'\n    | 'google'\n    | 'googleMyBusiness'\n    | 'microsoft'\n    | 'pinterest'\n    | 'X';\ntype SocialButtonType = 'default' | 'stroked';\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-social-button',\n    styleUrls: ['./social-button.component.scss'],\n    standalone: true,\n    imports: [SymbolComponent, LoaderComponent],\n    providers: [],\n    templateUrl: './social-button.component.html',\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [BaseButtonDirective],\n    // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n    host: {\n        '[attr.disabled]': 'disabled || null',\n    },\n})\nexport class SocialButtonComponent {\n    readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n    @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n    @Input() ariaLabel = '';\n    @Input({\n        transform: booleanAttribute,\n    })\n    disabled = false;\n    @Input({\n        required: true,\n    })\n    name = '';\n    @Input() loading = false;\n    @Input() network: Service = 'facebook';\n    @Input() buttonType: SocialButtonType = 'default';\n\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() click: EventEmitter<MouseEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n    symbolIdPerNetwork: Record<Service, Record<SocialButtonType, string>> = {\n        facebook: {\n            default: 'facebook',\n            stroked: 'facebook-official',\n        },\n        instagram: {\n            default: 'instagram-outline',\n            stroked: 'instagram-official',\n        },\n        twitter: {\n            default: 'x-white-official',\n            stroked: 'x-official',\n        },\n        X: {\n            default: 'x-white-official',\n            stroked: 'x-official',\n        },\n        linkedin: {\n            default: 'linkedin',\n            stroked: 'linkedin-official',\n        },\n        youtube: {\n            default: 'youtube',\n            stroked: 'youtube-official',\n        },\n        tiktok: {\n            default: 'tiktok-white-official',\n            stroked: 'tiktok-official',\n        },\n        google: {\n            default: 'google-icon',\n            stroked: 'google-official',\n        },\n        microsoft: {\n            default: 'microsoft-icon',\n            stroked: 'microsoft-official',\n        },\n        googleMyBusiness: {\n            default: 'google-my-business-icon',\n            stroked: 'google-my-business-official',\n        },\n        pinterest: {\n            default: 'pinterest-icon',\n            stroked: 'pinterest-official',\n        },\n    };\n\n    constructor(private symbolRegistry: SymbolRegistry) {\n        this.symbolRegistry.registerSymbols([\n            apFacebook,\n            apLinkedin,\n            apLinkedinOfficial,\n            apYoutubeOfficial,\n            apYoutube,\n            apInstagramOutline,\n            apTiktokOfficial,\n            apTiktokWhiteOfficial,\n            apPinterestIcon,\n            apPinterestOfficial,\n            apXOfficial,\n            apXWhiteOfficial,\n        ]);\n    }\n\n    focused: boolean = false;\n\n    onClickHandle($event: MouseEvent): void {\n        if (this.disabled || this.loading) {\n            return;\n        }\n        $event.stopImmediatePropagation();\n        this.click.emit($event);\n        this.buttonElement.nativeElement.blur();\n        this.blur.emit($event);\n    }\n\n    onBlurHandle($event: FocusEvent): void {\n        this.focused = false;\n        this.blur.emit($event);\n    }\n\n    onFocusHandle($event: FocusEvent): void {\n        this.focused = true;\n        this.focus.emit($event);\n    }\n\n    @HostListener('window:keyup.space', ['$event'])\n    onSpaceKeyUp(event: KeyboardEvent) {\n        if (this.focused && !this.disabled && !this.loading) {\n            event.preventDefault();\n            this.buttonElement.nativeElement.click();\n        }\n    }\n}\n","<button\n    #button\n    role=\"button\"\n    [class.stroked]=\"buttonType === 'stroked'\"\n    [class.facebook]=\"network === 'facebook'\"\n    [class.twitter]=\"network === 'twitter'\"\n    [class.x]=\"network === 'X'\"\n    [class.instagram]=\"network === 'instagram'\"\n    [class.linkedin]=\"network === 'linkedin'\"\n    [class.youtube]=\"network === 'youtube'\"\n    [class.tiktok]=\"network === 'tiktok'\"\n    [class.microsoft]=\"network === 'microsoft'\"\n    [class.google-my-business]=\"network === 'googleMyBusiness'\"\n    [class.google]=\"network === 'google'\"\n    [class.pinterest]=\"network === 'pinterest'\"\n    [class.loading]=\"loading\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\">\n    @if (!loading) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolIdPerNetwork[network][buttonType]\" />\n    }\n    @if (loading) {\n        <ap-loader\n            [color]=\"buttonType === 'default' ? 'white' : network\"\n            [diameter]=\"16\" />\n    }\n    <ng-content select=\"span\" />\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/agorapulse-ui-components-split-button.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, EventEmitter, SimpleChange, booleanAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, ViewChild, Input, ContentChild, Output, HostListener } from '@angular/core';
+import { inject, EventEmitter, booleanAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, ViewChild, Input, ContentChild, Output, HostListener } from '@angular/core';
 import * as i1 from '@agorapulse/ui-components/directives';
 import { BaseButtonDirective } from '@agorapulse/ui-components/directives';
 import { SymbolRegistry, apChevronDown, SymbolComponent } from '@agorapulse/ui-symbol';
@@ -31,12 +31,9 @@ class SplitButtonComponent {
     constructor() {
         this.symbolRegistry.registerSymbols([apChevronDown]);
     }
-    ngAfterViewChecked() {
+    ngAfterContentInit() {
         if (this.symbolComponent) {
-            this.symbolComponent.size = 'sm';
-            this.symbolComponent.ngOnChanges({
-                size: new SimpleChange(null, this.symbolComponent.size, false),
-            });
+            this.symbolComponent.size.set('sm');
         }
     }
     onSplitButtonClickHandle($event) {
@@ -71,7 +68,7 @@ class SplitButtonComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SplitButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.3", type: SplitButtonComponent, isStandalone: true, selector: "ap-split-button", inputs: { ariaLabel: "ariaLabel", disabled: ["disabled", "disabled", booleanAttribute], name: "name", config: "config", menuTrigger: "menuTrigger", splitDisabled: "splitDisabled", symbolPosition: "symbolPosition", splitButtonDataTest: "splitButtonDataTest" }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", mainButtonClick: "mainButtonClick", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "(disabled && splitDisabled)  || null" } }, providers: [], queries: [{ propertyName: "symbolComponent", first: true, predicate: SymbolComponent, descendants: true }], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }, { propertyName: "splitButtonElement", first: true, predicate: ["splitButton"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    <ng-content select=\"ap-symbol\" />\n</button>\n<button\n    #splitButton\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"splitDisabled.toString()\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n</button>\n", styles: ["ap-split-button{--loading-bar-width: 50px;display:inline-flex;gap:1px;position:relative}ap-split-button[disabled]{pointer-events:none}ap-split-button button{border:none;position:relative;padding:var(--comp-split-button-padding-horizontal) var(--comp-split-button-padding-vertical);max-height:var(--comp-button-height);min-height:var(--comp-button-height);overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px}ap-split-button button.inverse{flex-direction:row-reverse}ap-split-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-split-button button:disabled{pointer-events:none}@media (hover: hover){ap-split-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px;z-index:10}}ap-split-button button span{font-size:var(--comp-split-button-text-size);font-family:var(--comp-split-button-text-font-family);line-height:var(--comp-split-button-text-line-height);font-weight:var(--comp-split-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-split-button button.loading{pointer-events:none}ap-split-button button.primary span,ap-split-button button.primary ap-symbol{color:var(--ref-color-white)}ap-split-button button.primary.orange{background:var(--ref-color-orange-100)}ap-split-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-split-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-split-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-split-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-split-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-split-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-split-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-split-button button:first-child{border-top-left-radius:var(--comp-split-button-border-radius);border-bottom-left-radius:var(--comp-split-button-border-radius)}ap-split-button button:last-child{border-top-right-radius:var(--comp-split-button-border-radius);border-bottom-right-radius:var(--comp-split-button-border-radius);padding:var(--comp-split-button-padding-horizontal) 10px var(--comp-split-button-padding-horizontal) 10px}ap-split-button button ap-symbol{will-change:transform;transition:.2s ease-in-out}ap-split-button button ap-symbol.opened{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.3", type: SplitButtonComponent, isStandalone: true, selector: "ap-split-button", inputs: { ariaLabel: "ariaLabel", disabled: ["disabled", "disabled", booleanAttribute], name: "name", config: "config", menuTrigger: "menuTrigger", splitDisabled: "splitDisabled", symbolPosition: "symbolPosition", splitButtonDataTest: "splitButtonDataTest" }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", mainButtonClick: "mainButtonClick", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "(disabled && splitDisabled)  || null" } }, providers: [], queries: [{ propertyName: "symbolComponent", first: true, predicate: SymbolComponent, descendants: true }], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }, { propertyName: "splitButtonElement", first: true, predicate: ["splitButton"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    <ng-content select=\"ap-symbol\" />\n</button>\n<button\n    #splitButton\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"splitDisabled.toString()\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n</button>\n", styles: ["ap-split-button{--loading-bar-width: 50px;display:inline-flex;gap:1px;position:relative}ap-split-button[disabled]{pointer-events:none}ap-split-button button{border:none;position:relative;padding:var(--comp-split-button-padding-horizontal) var(--comp-split-button-padding-vertical);max-height:var(--comp-button-height);min-height:var(--comp-button-height);overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px}ap-split-button button.inverse{flex-direction:row-reverse}ap-split-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-split-button button:disabled{pointer-events:none}@media (hover: hover){ap-split-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px;z-index:10}}ap-split-button button span{font-size:var(--comp-split-button-text-size);font-family:var(--comp-split-button-text-font-family);line-height:var(--comp-split-button-text-line-height);font-weight:var(--comp-split-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-split-button button.loading{pointer-events:none}ap-split-button button.primary span,ap-split-button button.primary ap-symbol{color:var(--ref-color-white)}ap-split-button button.primary.orange{background:var(--ref-color-orange-100)}ap-split-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-split-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-split-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-split-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-split-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-split-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-split-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-split-button button:first-child{border-top-left-radius:var(--comp-split-button-border-radius);border-bottom-left-radius:var(--comp-split-button-border-radius)}ap-split-button button:last-child{border-top-right-radius:var(--comp-split-button-border-radius);border-bottom-right-radius:var(--comp-split-button-border-radius);padding:var(--comp-split-button-padding-horizontal) 10px var(--comp-split-button-padding-horizontal) 10px}ap-split-button button ap-symbol{will-change:transform;transition:.2s ease-in-out}ap-split-button button ap-symbol.opened{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SplitButtonComponent, decorators: [{
             type: Component,

package/fesm2022/agorapulse-ui-components-split-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"agorapulse-ui-components-split-button.mjs","sources":["../../../libs/ui-components/split-button/src/split-button.component.ts","../../../libs/ui-components/split-button/src/split-button.component.html","../../../libs/ui-components/split-button/src/agorapulse-ui-components-split-button.ts"],"sourcesContent":["import {\n    AfterViewChecked,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    ContentChild,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    inject,\n    Input,\n    Output,\n    SimpleChange,\n    ViewChild,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport { apChevronDown, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport { MatMenu, MatMenuModule } from '@angular/material/menu';\n\ntype SplitButtonConfig = { style: 'primary'; color: 'orange' | 'blue' };\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-split-button',\n    styleUrls: ['./split-button.component.scss'],\n    standalone: true,\n    imports: [SymbolComponent, MatMenuModule],\n    providers: [],\n    templateUrl: './split-button.component.html',\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [BaseButtonDirective],\n    // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n    host: {\n        '[attr.disabled]': '(disabled && splitDisabled)  || null',\n    },\n})\nexport class SplitButtonComponent implements AfterViewChecked {\n    private symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n    readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n    @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n    @Input() ariaLabel: string = '';\n    @Input({\n        transform: booleanAttribute,\n    })\n    disabled: boolean = false;\n    @Input({\n        required: true,\n    })\n    name = '';\n    @Input({\n        required: true,\n    })\n    config!: SplitButtonConfig;\n    @Input() menuTrigger: MatMenu | null = null;\n    @Input() splitDisabled: boolean = false;\n    @Input() symbolPosition: 'left' | 'right' = 'right';\n    @Input() splitButtonDataTest: string | undefined = undefined;\n\n    @ViewChild('splitButton') splitButtonElement!: ElementRef<HTMLButtonElement>;\n\n    @ContentChild(SymbolComponent) symbolComponent!: SymbolComponent;\n\n    @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n    @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n    @Output() mainButtonClick: EventEmitter<MouseEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n    menuOpen = false;\n\n    constructor() {\n        this.symbolRegistry.registerSymbols([apChevronDown]);\n    }\n\n    ngAfterViewChecked(): void {\n        if (this.symbolComponent) {\n            this.symbolComponent.size = 'sm';\n            this.symbolComponent.ngOnChanges({\n                size: new SimpleChange(null, this.symbolComponent.size, false),\n            });\n        }\n    }\n\n    onSplitButtonClickHandle($event: MouseEvent): void {\n        $event.stopImmediatePropagation();\n    }\n\n    handleMenuOpened(): void {\n        this.menuOpened.emit();\n        this.menuOpen = true;\n        this.buttonElement.nativeElement.blur();\n        this.splitButtonElement.nativeElement.blur();\n    }\n\n    handleMenuClosed(): void {\n        this.menuClosed.emit();\n        this.menuOpen = false;\n        this.buttonElement.nativeElement.blur();\n        this.splitButtonElement.nativeElement.blur();\n    }\n\n    focused: boolean = false;\n\n    onClickHandle($event: MouseEvent): void {\n        if (this.disabled) {\n            return;\n        }\n        $event.stopImmediatePropagation();\n        this.mainButtonClick.emit($event);\n        this.buttonElement.nativeElement.blur();\n        this.blur.emit($event);\n    }\n\n    @HostListener('window:keyup.space', ['$event'])\n    onSpaceKeyUp(event: KeyboardEvent) {\n        if (this.focused) {\n            event.preventDefault();\n            this.buttonElement.nativeElement.click();\n        }\n    }\n}\n","<button\n    #button\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    <ng-content select=\"ap-symbol\" />\n</button>\n<button\n    #splitButton\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"splitDisabled.toString()\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"agorapulse-ui-components-split-button.mjs","sources":["../../../libs/ui-components/split-button/src/split-button.component.ts","../../../libs/ui-components/split-button/src/split-button.component.html","../../../libs/ui-components/split-button/src/agorapulse-ui-components-split-button.ts"],"sourcesContent":["import {\n    AfterContentInit,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    ContentChild,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    inject,\n    Input,\n    Output,\n    ViewChild,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport { apChevronDown, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport { MatMenu, MatMenuModule } from '@angular/material/menu';\n\ntype SplitButtonConfig = { style: 'primary'; color: 'orange' | 'blue' };\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-split-button',\n    styleUrls: ['./split-button.component.scss'],\n    standalone: true,\n    imports: [SymbolComponent, MatMenuModule],\n    providers: [],\n    templateUrl: './split-button.component.html',\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [BaseButtonDirective],\n    // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n    host: {\n        '[attr.disabled]': '(disabled && splitDisabled)  || null',\n    },\n})\nexport class SplitButtonComponent implements AfterContentInit {\n    private symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n    readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n    @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n    @Input() ariaLabel: string = '';\n    @Input({\n        transform: booleanAttribute,\n    })\n    disabled: boolean = false;\n    @Input({\n        required: true,\n    })\n    name = '';\n    @Input({\n        required: true,\n    })\n    config!: SplitButtonConfig;\n    @Input() menuTrigger: MatMenu | null = null;\n    @Input() splitDisabled: boolean = false;\n    @Input() symbolPosition: 'left' | 'right' = 'right';\n    @Input() splitButtonDataTest: string | undefined = undefined;\n\n    @ViewChild('splitButton') splitButtonElement!: ElementRef<HTMLButtonElement>;\n\n    @ContentChild(SymbolComponent) symbolComponent!: SymbolComponent;\n\n    @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n    @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n    @Output() mainButtonClick: EventEmitter<MouseEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n    menuOpen = false;\n\n    constructor() {\n        this.symbolRegistry.registerSymbols([apChevronDown]);\n    }\n\n    ngAfterContentInit() {\n        if (this.symbolComponent) {\n            this.symbolComponent.size.set('sm');\n        }\n    }\n\n    onSplitButtonClickHandle($event: MouseEvent): void {\n        $event.stopImmediatePropagation();\n    }\n\n    handleMenuOpened(): void {\n        this.menuOpened.emit();\n        this.menuOpen = true;\n        this.buttonElement.nativeElement.blur();\n        this.splitButtonElement.nativeElement.blur();\n    }\n\n    handleMenuClosed(): void {\n        this.menuClosed.emit();\n        this.menuOpen = false;\n        this.buttonElement.nativeElement.blur();\n        this.splitButtonElement.nativeElement.blur();\n    }\n\n    focused: boolean = false;\n\n    onClickHandle($event: MouseEvent): void {\n        if (this.disabled) {\n            return;\n        }\n        $event.stopImmediatePropagation();\n        this.mainButtonClick.emit($event);\n        this.buttonElement.nativeElement.blur();\n        this.blur.emit($event);\n    }\n\n    @HostListener('window:keyup.space', ['$event'])\n    onSpaceKeyUp(event: KeyboardEvent) {\n        if (this.focused) {\n            event.preventDefault();\n            this.buttonElement.nativeElement.click();\n        }\n    }\n}\n","<button\n    #button\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    <ng-content select=\"ap-symbol\" />\n</button>\n<button\n    #splitButton\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"splitDisabled.toString()\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;MAqCa,oBAAoB,CAAA;AACrB,IAAA,cAAc,GAAmB,MAAM,CAAC,cAAc,CAAC,CAAC;IACvD,mBAAmB,GAAwB,MAAM,CAAC,mBAAmB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;AAE3E,IAAA,aAAa,CAAiC;IAE1D,SAAS,GAAW,EAAE,CAAC;IAIhC,QAAQ,GAAY,KAAK,CAAC;IAI1B,IAAI,GAAG,EAAE,CAAC;AAIV,IAAA,MAAM,CAAqB;IAClB,WAAW,GAAmB,IAAI,CAAC;IACnC,aAAa,GAAY,KAAK,CAAC;IAC/B,cAAc,GAAqB,OAAO,CAAC;IAC3C,mBAAmB,GAAuB,SAAS,CAAC;AAEnC,IAAA,kBAAkB,CAAiC;AAE9C,IAAA,eAAe,CAAmB;AAEvD,IAAA,UAAU,GAAuB,IAAI,YAAY,EAAE,CAAC;AACpD,IAAA,UAAU,GAAuB,IAAI,YAAY,EAAE,CAAC;AACpD,IAAA,eAAe,GAA6B,IAAI,YAAY,EAAE,CAAC;;AAE/D,IAAA,KAAK,GAA6B,IAAI,YAAY,EAAE,CAAC;;AAErD,IAAA,IAAI,GAA6B,IAAI,YAAY,EAAE,CAAC;IAE9D,QAAQ,GAAG,KAAK,CAAC;AAEjB,IAAA,WAAA,GAAA;QACI,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC;KACxD;IAED,kBAAkB,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,eAAe,EAAE;YACtB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;SACvC;KACJ;AAED,IAAA,wBAAwB,CAAC,MAAkB,EAAA;QACvC,MAAM,CAAC,wBAAwB,EAAE,CAAC;KACrC;IAED,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;AACvB,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;AACrB,QAAA,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;AACxC,QAAA,IAAI,CAAC,kBAAkB,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;KAChD;IAED,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;AACvB,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;AACtB,QAAA,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;AACxC,QAAA,IAAI,CAAC,kBAAkB,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;KAChD;IAED,OAAO,GAAY,KAAK,CAAC;AAEzB,IAAA,aAAa,CAAC,MAAkB,EAAA;AAC5B,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,OAAO;SACV;QACD,MAAM,CAAC,wBAAwB,EAAE,CAAC;AAClC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AAClC,QAAA,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;AACxC,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAC1B;AAGD,IAAA,YAAY,CAAC,KAAoB,EAAA;AAC7B,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YACd,KAAK,CAAC,cAAc,EAAE,CAAC;AACvB,YAAA,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;SAC5C;KACJ;uGApFQ,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;2FAApB,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,WAAA,EAAA,QAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAQd,gBAAgB,CAAA,EAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EAAA,QAAA,EAAA,WAAA,EAAA,aAAA,EAAA,aAAA,EAAA,eAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,EAAA,OAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,eAAA,EAAA,sCAAA,EAAA,EAAA,EAAA,SAAA,EAjBpB,EAAE,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAmCC,eAAe,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,eAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,QAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,oBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,aAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,cAAA,EAAA,CAAA,EAAA,SAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC/DjC,k5CAuCA,EAAA,MAAA,EAAA,CAAA,m5FAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDZc,eAAe,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,OAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,6CAAA,EAAA,MAAA,EAAA,CAAA,sBAAA,EAAA,mBAAA,EAAA,oBAAA,EAAA,4BAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,YAAA,EAAA,aAAA,CAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAU/B,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAfhC,SAAS;sCACW,uBAAuB,CAAC,MAAM,EACrC,QAAA,EAAA,iBAAiB,cAEf,IAAI,EAAA,OAAA,EACP,CAAC,eAAe,EAAE,aAAa,CAAC,EAC9B,SAAA,EAAA,EAAE,iBAEE,iBAAiB,CAAC,IAAI,EACrB,cAAA,EAAA,CAAC,mBAAmB,CAAC,EAE/B,IAAA,EAAA;AACF,wBAAA,iBAAiB,EAAE,sCAAsC;AAC5D,qBAAA,EAAA,QAAA,EAAA,k5CAAA,EAAA,MAAA,EAAA,CAAA,m5FAAA,CAAA,EAAA,CAAA;wDAMoB,aAAa,EAAA,CAAA;sBAAjC,SAAS;uBAAC,QAAQ,CAAA;gBAEV,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBAIN,QAAQ,EAAA,CAAA;sBAHP,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA;AACH,wBAAA,SAAS,EAAE,gBAAgB;AAC9B,qBAAA,CAAA;gBAKD,IAAI,EAAA,CAAA;sBAHH,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA;AACH,wBAAA,QAAQ,EAAE,IAAI;AACjB,qBAAA,CAAA;gBAKD,MAAM,EAAA,CAAA;sBAHL,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA;AACH,wBAAA,QAAQ,EAAE,IAAI;AACjB,qBAAA,CAAA;gBAEQ,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBACG,aAAa,EAAA,CAAA;sBAArB,KAAK;gBACG,cAAc,EAAA,CAAA;sBAAtB,KAAK;gBACG,mBAAmB,EAAA,CAAA;sBAA3B,KAAK;gBAEoB,kBAAkB,EAAA,CAAA;sBAA3C,SAAS;uBAAC,aAAa,CAAA;gBAEO,eAAe,EAAA,CAAA;sBAA7C,YAAY;uBAAC,eAAe,CAAA;gBAEnB,UAAU,EAAA,CAAA;sBAAnB,MAAM;gBACG,UAAU,EAAA,CAAA;sBAAnB,MAAM;gBACG,eAAe,EAAA,CAAA;sBAAxB,MAAM;gBAEG,KAAK,EAAA,CAAA;sBAAd,MAAM;gBAEG,IAAI,EAAA,CAAA;sBAAb,MAAM;gBA6CP,YAAY,EAAA,CAAA;sBADX,YAAY;uBAAC,oBAAoB,EAAE,CAAC,QAAQ,CAAC,CAAA;;;AEnHlD;;AAEG;;;;"}

package/fesm2022/agorapulse-ui-components-stepper.mjs

@@ -21,7 +21,7 @@ class StepperComponent {
         this.stepClicked.emit(step);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: StepperComponent, isStandalone: true, selector: "ap-stepper", inputs: { currentStep: "currentStep", steps: "steps" }, outputs: { stepClicked: "stepClicked" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"main\">\n    @for (step of steps; track step; let index = $index; let last = $last) {\n        <span class=\"item\">\n            <span\n                [ngClass]=\"{\n                    number: true,\n                    active: index === currentIndex,\n                    'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n                    'not-yet-active': currentIndex < index && !step.visited\n                }\">\n                {{ index + 1 }}\n            </span>\n            <span\n                class=\"text\"\n                [ngClass]=\"{ clickable: step.clickable }\"\n                (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n                {{ step.name }}\n            </span>\n            @if (!last) {\n                <ap-symbol\n                    symbolId=\"chevron-right\"\n                    size=\"sm\" />\n            }\n        </span>\n    }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid #ff0000}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #ffffff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:transparent}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:transparent}[border=transparent]{border:1px solid transparent}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.active{font-weight:700}.main{display:flex}.main .item{height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:transparent;color:#178dfe}.main .item .text{padding-left:8px;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: StepperComponent, isStandalone: true, selector: "ap-stepper", inputs: { currentStep: "currentStep", steps: "steps" }, outputs: { stepClicked: "stepClicked" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"main\">\n    @for (step of steps; track step; let index = $index; let last = $last) {\n        <span class=\"item\">\n            <span\n                [ngClass]=\"{\n                    number: true,\n                    active: index === currentIndex,\n                    'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n                    'not-yet-active': currentIndex < index && !step.visited\n                }\">\n                {{ index + 1 }}\n            </span>\n            <span\n                class=\"text\"\n                [ngClass]=\"{ clickable: step.clickable }\"\n                (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n                {{ step.name }}\n            </span>\n            @if (!last) {\n                <ap-symbol\n                    symbolId=\"chevron-right\"\n                    size=\"sm\" />\n            }\n        </span>\n    }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid #ff0000}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #ffffff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:transparent}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:transparent}[border=transparent]{border:1px solid transparent}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.active{font-weight:700}.main{display:flex}.main .item{height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:transparent;color:#178dfe}.main .item .text{padding-left:8px;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StepperComponent, decorators: [{
             type: Component,

package/fesm2022/agorapulse-ui-components-stepper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"agorapulse-ui-components-stepper.mjs","sources":["../../../libs/ui-components/stepper/src/stepper.component.ts","../../../libs/ui-components/stepper/src/stepper.component.html","../../../libs/ui-components/stepper/src/agorapulse-ui-components-stepper.ts"],"sourcesContent":["import { SymbolComponent } from '@agorapulse/ui-symbol';\nimport { NgClass } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';\nimport { Step } from './step.model';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-stepper',\n    templateUrl: './stepper.component.html',\n    styleUrls: ['./stepper.component.scss'],\n    standalone: true,\n    imports: [SymbolComponent, NgClass],\n})\nexport class StepperComponent implements OnChanges {\n    @Input() currentStep: Step | undefined = undefined;\n    @Input({\n        required: true,\n    })\n    steps: Step[] = []; // Immutable after init.\n    @Output() stepClicked: EventEmitter<Step> = new EventEmitter<Step>();\n\n    stepTexts: { [index: number]: string } = {};\n    currentIndex = 0;\n\n    ngOnChanges(): void {\n        if (this.steps?.length > 0 && this.currentStep) {\n            this.currentIndex = this.steps.findIndex(step => step.id === this.currentStep?.id);\n        } else {\n            this.currentIndex = 0;\n        }\n    }\n\n    clickCurrentStep(step: Step): void {\n        this.stepClicked.emit(step);\n    }\n}\n","<div class=\"main\">\n    @for (step of steps; track step; let index = $index; let last = $last) {\n        <span class=\"item\">\n            <span\n                [ngClass]=\"{\n                    number: true,\n                    active: index === currentIndex,\n                    'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n                    'not-yet-active': currentIndex < index && !step.visited\n                }\">\n                {{ index + 1 }}\n            </span>\n            <span\n                class=\"text\"\n                [ngClass]=\"{ clickable: step.clickable }\"\n                (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n                {{ step.name }}\n            </span>\n            @if (!last) {\n                <ap-symbol\n                    symbolId=\"chevron-right\"\n                    size=\"sm\" />\n            }\n        </span>\n    }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;MAaa,gBAAgB,CAAA;IAChB,WAAW,GAAqB,SAAS,CAAC;AAInD,IAAA,KAAK,GAAW,EAAE,CAAC;AACT,IAAA,WAAW,GAAuB,IAAI,YAAY,EAAQ,CAAC;IAErE,SAAS,GAAgC,EAAE,CAAC;IAC5C,YAAY,GAAG,CAAC,CAAC;IAEjB,WAAW,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE;YAC5C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;SACtF;aAAM;AACH,YAAA,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;SACzB;KACJ;AAED,IAAA,gBAAgB,CAAC,IAAU,EAAA;AACvB,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC/B;uGArBQ,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,ECb7B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,+7BA0BA,EDfc,MAAA,EAAA,CAAA,4uMAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,eAAe,6FAAE,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAEzB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;sCACW,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,YAAY,EAAA,UAAA,EAGV,IAAI,EAAA,OAAA,EACP,CAAC,eAAe,EAAE,OAAO,CAAC,EAAA,QAAA,EAAA,+7BAAA,EAAA,MAAA,EAAA,CAAA,4uMAAA,CAAA,EAAA,CAAA;8BAG1B,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBAIN,KAAK,EAAA,CAAA;sBAHJ,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA;AACH,wBAAA,QAAQ,EAAE,IAAI;AACjB,qBAAA,CAAA;gBAES,WAAW,EAAA,CAAA;sBAApB,MAAM;;;AEnBX;;AAEG;;;;"}
+{"version":3,"file":"agorapulse-ui-components-stepper.mjs","sources":["../../../libs/ui-components/stepper/src/stepper.component.ts","../../../libs/ui-components/stepper/src/stepper.component.html","../../../libs/ui-components/stepper/src/agorapulse-ui-components-stepper.ts"],"sourcesContent":["import { SymbolComponent } from '@agorapulse/ui-symbol';\nimport { NgClass } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';\nimport { Step } from './step.model';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-stepper',\n    templateUrl: './stepper.component.html',\n    styleUrls: ['./stepper.component.scss'],\n    standalone: true,\n    imports: [SymbolComponent, NgClass],\n})\nexport class StepperComponent implements OnChanges {\n    @Input() currentStep: Step | undefined = undefined;\n    @Input({\n        required: true,\n    })\n    steps: Step[] = []; // Immutable after init.\n    @Output() stepClicked: EventEmitter<Step> = new EventEmitter<Step>();\n\n    stepTexts: { [index: number]: string } = {};\n    currentIndex = 0;\n\n    ngOnChanges(): void {\n        if (this.steps?.length > 0 && this.currentStep) {\n            this.currentIndex = this.steps.findIndex(step => step.id === this.currentStep?.id);\n        } else {\n            this.currentIndex = 0;\n        }\n    }\n\n    clickCurrentStep(step: Step): void {\n        this.stepClicked.emit(step);\n    }\n}\n","<div class=\"main\">\n    @for (step of steps; track step; let index = $index; let last = $last) {\n        <span class=\"item\">\n            <span\n                [ngClass]=\"{\n                    number: true,\n                    active: index === currentIndex,\n                    'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n                    'not-yet-active': currentIndex < index && !step.visited\n                }\">\n                {{ index + 1 }}\n            </span>\n            <span\n                class=\"text\"\n                [ngClass]=\"{ clickable: step.clickable }\"\n                (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n                {{ step.name }}\n            </span>\n            @if (!last) {\n                <ap-symbol\n                    symbolId=\"chevron-right\"\n                    size=\"sm\" />\n            }\n        </span>\n    }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;MAaa,gBAAgB,CAAA;IAChB,WAAW,GAAqB,SAAS,CAAC;AAInD,IAAA,KAAK,GAAW,EAAE,CAAC;AACT,IAAA,WAAW,GAAuB,IAAI,YAAY,EAAQ,CAAC;IAErE,SAAS,GAAgC,EAAE,CAAC;IAC5C,YAAY,GAAG,CAAC,CAAC;IAEjB,WAAW,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE;YAC5C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;SACtF;aAAM;AACH,YAAA,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;SACzB;KACJ;AAED,IAAA,gBAAgB,CAAC,IAAU,EAAA;AACvB,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC/B;uGArBQ,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,ECb7B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,+7BA0BA,EDfc,MAAA,EAAA,CAAA,4uMAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,eAAe,sHAAE,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAEzB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;sCACW,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,YAAY,EAAA,UAAA,EAGV,IAAI,EAAA,OAAA,EACP,CAAC,eAAe,EAAE,OAAO,CAAC,EAAA,QAAA,EAAA,+7BAAA,EAAA,MAAA,EAAA,CAAA,4uMAAA,CAAA,EAAA,CAAA;8BAG1B,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBAIN,KAAK,EAAA,CAAA;sBAHJ,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA;AACH,wBAAA,QAAQ,EAAE,IAAI;AACjB,qBAAA,CAAA;gBAES,WAAW,EAAA,CAAA;sBAApB,MAAM;;;AEnBX;;AAEG;;;;"}

package/fesm2022/agorapulse-ui-components-tag.mjs

@@ -18,7 +18,7 @@ class TagComponent {
         this.clear.emit({ $event });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: TagComponent, isStandalone: true, selector: "ap-tag", inputs: { clearable: ["clearable", "clearable", booleanAttribute], color: "color", mini: "mini" }, outputs: { clear: "clear" }, ngImport: i0, template: "<div\n    [class.blue]=\"color === 'blue'\"\n    [class.menthol]=\"color === 'menthol'\"\n    [class.grey]=\"color === 'grey'\"\n    [class.tagOrange]=\"color === 'tagOrange'\"\n    [class.green]=\"color === 'green'\"\n    [class.red]=\"color === 'red'\"\n    [class.clearable]=\"clearable\"\n    [class.mini]=\"mini\">\n    <ng-content select=\"ap-symbol\"></ng-content>\n    <ng-content select=\"ap-avatar\"></ng-content>\n\n    <span>\n        <ng-content></ng-content>\n    </span>\n    @if (clearable) {\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"delete-button\"\n                (click)=\"onClear($event)\">\n                <ap-symbol\n                    symbolId=\"delete-no-circle\"\n                    size=\"xs\" />\n            </button>\n        }\n    }\n</div>", styles: ["ap-tag{--avatar-size: 16px;--button-size: 20px;display:inline-flex;vertical-align:middle}ap-tag>div{display:flex;align-items:center;justify-content:center;height:var(--comp-tag-height);max-height:var(--height);box-sizing:border-box;border-width:1px;border-style:solid;padding:0 var(--comp-tag-padding-right) 0 var(--comp-tag-padding-left);border-radius:var(--comp-tag-border-radius);gap:var(--ref-spacing-xxxs)}ap-tag>div.clearable{padding:0 calc(var(--comp-tag-closable-padding-right) - 1px) 0 var(--comp-tag-padding-left)}ap-tag>div.mini{height:var(--comp-tag-mini-height);padding:0 var(--comp-tag-mini-padding-right) 0 var(--comp-tag-mini-padding-left)}ap-tag>div span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--comp-tag-text-style-size);line-height:var(--comp-tag-text-style-line-height);font-weight:var(--comp-tag-text-style-font-weight);font-family:var(--comp-tag-text-style-font-family)}ap-tag>div ap-avatar{min-width:var(--avatar-size);width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);height:var(--avatar-size);max-height:var(--avatar-size)}ap-tag>div ap-avatar img{width:var(--avatar-size);height:var(--avatar-size)}ap-tag>div button{display:flex;align-items:center;justify-content:center;border:none;background:transparent;align-self:center;cursor:pointer;max-width:var(--button-size);width:var(--button-size);height:var(--button-size);border-radius:var(--ref-spacing-xxxs)}ap-tag>div button ap-symbol{color:var(--ref-color-grey-80)}ap-tag>div button:hover{background-color:#3445631a}ap-tag>div button:hover ap-symbol{color:var(--ref-color-grey-100)}ap-tag>div button:focus{-webkit-box-shadow:0px 0px 0px 1px var(--ref-color-white),0px 0px 0px 3px var(--ref-color-electric-blue-100);box-shadow:0 0 0 1px var(--ref-color-white),0 0 0 3px var(--ref-color-electric-blue-100)}ap-tag>div button:active{background-color:#34456333}ap-tag>div button:active ap-symbol{color:var(--ref-color-grey-100)}ap-tag>div.blue{background-color:var(--comp-tag-blue-background-color);border-color:var(--comp-tag-blue-border-color);color:var(--comp-tag-blue-text-color)}ap-tag>div.grey{background-color:var(--comp-tag-grey-background-color);border-color:var(--comp-tag-grey-border-color);color:var(--comp-tag-grey-text-color)}ap-tag>div.tagOrange{background-color:var(--comp-tag-tag-orange-background-color);border-color:var(--comp-tag-tag-orange-border-color);color:var(--comp-tag-tag-orange-text-color)}ap-tag>div.menthol{background-color:var(--comp-tag-menthol-background-color);border-color:var(--comp-tag-menthol-border-color);color:var(--comp-tag-menthol-text-color)}ap-tag>div.green{background-color:var(--comp-tag-green-background-color);border-color:var(--comp-tag-green-border-color);color:var(--comp-tag-green-text-color)}ap-tag>div.red{background-color:var(--comp-tag-red-background-color);border-color:var(--comp-tag-red-border-color);color:var(--comp-tag-red-text-color)}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: TagComponent, isStandalone: true, selector: "ap-tag", inputs: { clearable: ["clearable", "clearable", booleanAttribute], color: "color", mini: "mini" }, outputs: { clear: "clear" }, ngImport: i0, template: "<div\n    [class.blue]=\"color === 'blue'\"\n    [class.menthol]=\"color === 'menthol'\"\n    [class.grey]=\"color === 'grey'\"\n    [class.tagOrange]=\"color === 'tagOrange'\"\n    [class.green]=\"color === 'green'\"\n    [class.red]=\"color === 'red'\"\n    [class.clearable]=\"clearable\"\n    [class.mini]=\"mini\">\n    <ng-content select=\"ap-symbol\"></ng-content>\n    <ng-content select=\"ap-avatar\"></ng-content>\n\n    <span>\n        <ng-content></ng-content>\n    </span>\n    @if (clearable) {\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"delete-button\"\n                (click)=\"onClear($event)\">\n                <ap-symbol\n                    symbolId=\"delete-no-circle\"\n                    size=\"xs\" />\n            </button>\n        }\n    }\n</div>", styles: ["ap-tag{--avatar-size: 16px;--button-size: 20px;display:inline-flex;vertical-align:middle}ap-tag>div{display:flex;align-items:center;justify-content:center;height:var(--comp-tag-height);max-height:var(--height);box-sizing:border-box;border-width:1px;border-style:solid;padding:0 var(--comp-tag-padding-right) 0 var(--comp-tag-padding-left);border-radius:var(--comp-tag-border-radius);gap:var(--ref-spacing-xxxs)}ap-tag>div.clearable{padding:0 calc(var(--comp-tag-closable-padding-right) - 1px) 0 var(--comp-tag-padding-left)}ap-tag>div.mini{height:var(--comp-tag-mini-height);padding:0 var(--comp-tag-mini-padding-right) 0 var(--comp-tag-mini-padding-left)}ap-tag>div span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--comp-tag-text-style-size);line-height:var(--comp-tag-text-style-line-height);font-weight:var(--comp-tag-text-style-font-weight);font-family:var(--comp-tag-text-style-font-family)}ap-tag>div ap-avatar{min-width:var(--avatar-size);width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);height:var(--avatar-size);max-height:var(--avatar-size)}ap-tag>div ap-avatar img{width:var(--avatar-size);height:var(--avatar-size)}ap-tag>div button{display:flex;align-items:center;justify-content:center;border:none;background:transparent;align-self:center;cursor:pointer;max-width:var(--button-size);width:var(--button-size);height:var(--button-size);border-radius:var(--ref-spacing-xxxs)}ap-tag>div button ap-symbol{color:var(--ref-color-grey-80)}ap-tag>div button:hover{background-color:#3445631a}ap-tag>div button:hover ap-symbol{color:var(--ref-color-grey-100)}ap-tag>div button:focus{-webkit-box-shadow:0px 0px 0px 1px var(--ref-color-white),0px 0px 0px 3px var(--ref-color-electric-blue-100);box-shadow:0 0 0 1px var(--ref-color-white),0 0 0 3px var(--ref-color-electric-blue-100)}ap-tag>div button:active{background-color:#34456333}ap-tag>div button:active ap-symbol{color:var(--ref-color-grey-100)}ap-tag>div.blue{background-color:var(--comp-tag-blue-background-color);border-color:var(--comp-tag-blue-border-color);color:var(--comp-tag-blue-text-color)}ap-tag>div.grey{background-color:var(--comp-tag-grey-background-color);border-color:var(--comp-tag-grey-border-color);color:var(--comp-tag-grey-text-color)}ap-tag>div.tagOrange{background-color:var(--comp-tag-tag-orange-background-color);border-color:var(--comp-tag-tag-orange-border-color);color:var(--comp-tag-tag-orange-text-color)}ap-tag>div.menthol{background-color:var(--comp-tag-menthol-background-color);border-color:var(--comp-tag-menthol-border-color);color:var(--comp-tag-menthol-text-color)}ap-tag>div.green{background-color:var(--comp-tag-green-background-color);border-color:var(--comp-tag-green-border-color);color:var(--comp-tag-green-text-color)}ap-tag>div.red{background-color:var(--comp-tag-red-background-color);border-color:var(--comp-tag-red-border-color);color:var(--comp-tag-red-text-color)}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TagComponent, decorators: [{
             type: Component,

package/fesm2022/agorapulse-ui-components-tag.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"agorapulse-ui-components-tag.mjs","sources":["../../../libs/ui-components/tag/src/tag.component.ts","../../../libs/ui-components/tag/src/tag.component.html","../../../libs/ui-components/tag/src/agorapulse-ui-components-tag.ts"],"sourcesContent":["import { SymbolComponent, SymbolRegistry, apDeleteNoCircle } from '@agorapulse/ui-symbol';\n\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    ElementRef,\n    EventEmitter,\n    Input,\n    Output,\n    ViewEncapsulation,\n    booleanAttribute,\n    inject,\n} from '@angular/core';\n\nexport type TagColor = 'blue' | 'grey' | 'menthol' | 'tagOrange' | 'red' | 'green';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-tag',\n    standalone: true,\n    templateUrl: './tag.component.html',\n    imports: [SymbolComponent],\n    styleUrls: ['./tag.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class TagComponent {\n    private readonly elementRef: ElementRef = inject(ElementRef);\n    private readonly symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n\n    constructor() {\n        this.symbolRegistry.registerSymbols([apDeleteNoCircle]);\n    }\n\n    @Input({ transform: booleanAttribute }) clearable: boolean = false;\n    @Input() color: TagColor = 'blue';\n    @Input() mini = false;\n\n    @Output() clear = new EventEmitter<{ $event: MouseEvent | PointerEvent }>();\n\n    onClear($event: MouseEvent | PointerEvent): void {\n        $event.stopImmediatePropagation();\n        this.elementRef.nativeElement.remove();\n        this.clear.emit({ $event });\n    }\n}\n","<div\n    [class.blue]=\"color === 'blue'\"\n    [class.menthol]=\"color === 'menthol'\"\n    [class.grey]=\"color === 'grey'\"\n    [class.tagOrange]=\"color === 'tagOrange'\"\n    [class.green]=\"color === 'green'\"\n    [class.red]=\"color === 'red'\"\n    [class.clearable]=\"clearable\"\n    [class.mini]=\"mini\">\n    <ng-content select=\"ap-symbol\"></ng-content>\n    <ng-content select=\"ap-avatar\"></ng-content>\n\n    <span>\n        <ng-content></ng-content>\n    </span>\n    @if (clearable) {\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"delete-button\"\n                (click)=\"onClear($event)\">\n                <ap-symbol\n                    symbolId=\"delete-no-circle\"\n                    size=\"xs\" />\n            </button>\n        }\n    }\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;MAyBa,YAAY,CAAA;AACJ,IAAA,UAAU,GAAe,MAAM,CAAC,UAAU,CAAC,CAAC;AAC5C,IAAA,cAAc,GAAmB,MAAM,CAAC,cAAc,CAAC,CAAC;AAEzE,IAAA,WAAA,GAAA;QACI,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;KAC3D;IAEuC,SAAS,GAAY,KAAK,CAAC;IAC1D,KAAK,GAAa,MAAM,CAAC;IACzB,IAAI,GAAG,KAAK,CAAC;AAEZ,IAAA,KAAK,GAAG,IAAI,YAAY,EAAyC,CAAC;AAE5E,IAAA,OAAO,CAAC,MAAiC,EAAA;QACrC,MAAM,CAAC,wBAAwB,EAAE,CAAC;AAClC,QAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;QACvC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;KAC/B;uGAlBQ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,EAQD,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAAA,gBAAgB,CCjCxC,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,00BA2BM,s8FDNQ,eAAe,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,MAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAIhB,YAAY,EAAA,UAAA,EAAA,CAAA;kBATxB,SAAS;AACW,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACrC,QAAA,EAAA,QAAQ,EACN,UAAA,EAAA,IAAI,EAEP,OAAA,EAAA,CAAC,eAAe,CAAC,EAEX,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,00BAAA,EAAA,MAAA,EAAA,CAAA,84FAAA,CAAA,EAAA,CAAA;wDAUG,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBAC7B,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBAEI,KAAK,EAAA,CAAA;sBAAd,MAAM;;;AErCX;;AAEG;;;;"}
+{"version":3,"file":"agorapulse-ui-components-tag.mjs","sources":["../../../libs/ui-components/tag/src/tag.component.ts","../../../libs/ui-components/tag/src/tag.component.html","../../../libs/ui-components/tag/src/agorapulse-ui-components-tag.ts"],"sourcesContent":["import { SymbolComponent, SymbolRegistry, apDeleteNoCircle } from '@agorapulse/ui-symbol';\n\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    ElementRef,\n    EventEmitter,\n    Input,\n    Output,\n    ViewEncapsulation,\n    booleanAttribute,\n    inject,\n} from '@angular/core';\n\nexport type TagColor = 'blue' | 'grey' | 'menthol' | 'tagOrange' | 'red' | 'green';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-tag',\n    standalone: true,\n    templateUrl: './tag.component.html',\n    imports: [SymbolComponent],\n    styleUrls: ['./tag.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class TagComponent {\n    private readonly elementRef: ElementRef = inject(ElementRef);\n    private readonly symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n\n    constructor() {\n        this.symbolRegistry.registerSymbols([apDeleteNoCircle]);\n    }\n\n    @Input({ transform: booleanAttribute }) clearable: boolean = false;\n    @Input() color: TagColor = 'blue';\n    @Input() mini = false;\n\n    @Output() clear = new EventEmitter<{ $event: MouseEvent | PointerEvent }>();\n\n    onClear($event: MouseEvent | PointerEvent): void {\n        $event.stopImmediatePropagation();\n        this.elementRef.nativeElement.remove();\n        this.clear.emit({ $event });\n    }\n}\n","<div\n    [class.blue]=\"color === 'blue'\"\n    [class.menthol]=\"color === 'menthol'\"\n    [class.grey]=\"color === 'grey'\"\n    [class.tagOrange]=\"color === 'tagOrange'\"\n    [class.green]=\"color === 'green'\"\n    [class.red]=\"color === 'red'\"\n    [class.clearable]=\"clearable\"\n    [class.mini]=\"mini\">\n    <ng-content select=\"ap-symbol\"></ng-content>\n    <ng-content select=\"ap-avatar\"></ng-content>\n\n    <span>\n        <ng-content></ng-content>\n    </span>\n    @if (clearable) {\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"delete-button\"\n                (click)=\"onClear($event)\">\n                <ap-symbol\n                    symbolId=\"delete-no-circle\"\n                    size=\"xs\" />\n            </button>\n        }\n    }\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;MAyBa,YAAY,CAAA;AACJ,IAAA,UAAU,GAAe,MAAM,CAAC,UAAU,CAAC,CAAC;AAC5C,IAAA,cAAc,GAAmB,MAAM,CAAC,cAAc,CAAC,CAAC;AAEzE,IAAA,WAAA,GAAA;QACI,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;KAC3D;IAEuC,SAAS,GAAY,KAAK,CAAC;IAC1D,KAAK,GAAa,MAAM,CAAC;IACzB,IAAI,GAAG,KAAK,CAAC;AAEZ,IAAA,KAAK,GAAG,IAAI,YAAY,EAAyC,CAAC;AAE5E,IAAA,OAAO,CAAC,MAAiC,EAAA;QACrC,MAAM,CAAC,wBAAwB,EAAE,CAAC;AAClC,QAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;QACvC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;KAC/B;uGAlBQ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,EAQD,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAAA,gBAAgB,CCjCxC,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,00BA2BM,s8FDNQ,eAAe,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,OAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAIhB,YAAY,EAAA,UAAA,EAAA,CAAA;kBATxB,SAAS;AACW,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACrC,QAAA,EAAA,QAAQ,EACN,UAAA,EAAA,IAAI,EAEP,OAAA,EAAA,CAAC,eAAe,CAAC,EAEX,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,00BAAA,EAAA,MAAA,EAAA,CAAA,84FAAA,CAAA,EAAA,CAAA;wDAUG,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBAC7B,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBAEI,KAAK,EAAA,CAAA;sBAAd,MAAM;;;AErCX;;AAEG;;;;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@agorapulse/ui-components",
   "description": "Agorapulse UI Components Library",
-  "version": "17.5.0-beta.2",
+  "version": "17.5.1-beta.0",
   "author": "Benoit Hediard",
   "repository": {
     "type": "git",
@@ -49,11 +49,11 @@
       "esm": "./esm2022/autocomplete/agorapulse-ui-components-autocomplete.mjs",
       "default": "./fesm2022/agorapulse-ui-components-autocomplete.mjs"
     },
-    "./avatar": {
-      "types": "./avatar/index.d.ts",
-      "esm2022": "./esm2022/avatar/agorapulse-ui-components-avatar.mjs",
-      "esm": "./esm2022/avatar/agorapulse-ui-components-avatar.mjs",
-      "default": "./fesm2022/agorapulse-ui-components-avatar.mjs"
+    "./badge": {
+      "types": "./badge/index.d.ts",
+      "esm2022": "./esm2022/badge/agorapulse-ui-components-badge.mjs",
+      "esm": "./esm2022/badge/agorapulse-ui-components-badge.mjs",
+      "default": "./fesm2022/agorapulse-ui-components-badge.mjs"
     },
     "./button": {
       "types": "./button/index.d.ts",
@@ -61,11 +61,11 @@
       "esm": "./esm2022/button/agorapulse-ui-components-button.mjs",
       "default": "./fesm2022/agorapulse-ui-components-button.mjs"
     },
-    "./badge": {
-      "types": "./badge/index.d.ts",
-      "esm2022": "./esm2022/badge/agorapulse-ui-components-badge.mjs",
-      "esm": "./esm2022/badge/agorapulse-ui-components-badge.mjs",
-      "default": "./fesm2022/agorapulse-ui-components-badge.mjs"
+    "./avatar": {
+      "types": "./avatar/index.d.ts",
+      "esm2022": "./esm2022/avatar/agorapulse-ui-components-avatar.mjs",
+      "esm": "./esm2022/avatar/agorapulse-ui-components-avatar.mjs",
+      "default": "./fesm2022/agorapulse-ui-components-avatar.mjs"
     },
     "./checkbox": {
       "types": "./checkbox/index.d.ts",
@@ -73,18 +73,18 @@
       "esm": "./esm2022/checkbox/agorapulse-ui-components-checkbox.mjs",
       "default": "./fesm2022/agorapulse-ui-components-checkbox.mjs"
     },
-    "./counter": {
-      "types": "./counter/index.d.ts",
-      "esm2022": "./esm2022/counter/agorapulse-ui-components-counter.mjs",
-      "esm": "./esm2022/counter/agorapulse-ui-components-counter.mjs",
-      "default": "./fesm2022/agorapulse-ui-components-counter.mjs"
-    },
     "./confirm-modal": {
       "types": "./confirm-modal/index.d.ts",
       "esm2022": "./esm2022/confirm-modal/agorapulse-ui-components-confirm-modal.mjs",
       "esm": "./esm2022/confirm-modal/agorapulse-ui-components-confirm-modal.mjs",
       "default": "./fesm2022/agorapulse-ui-components-confirm-modal.mjs"
     },
+    "./counter": {
+      "types": "./counter/index.d.ts",
+      "esm2022": "./esm2022/counter/agorapulse-ui-components-counter.mjs",
+      "esm": "./esm2022/counter/agorapulse-ui-components-counter.mjs",
+      "default": "./fesm2022/agorapulse-ui-components-counter.mjs"
+    },
     "./datepicker": {
       "types": "./datepicker/index.d.ts",
       "esm2022": "./esm2022/datepicker/agorapulse-ui-components-datepicker.mjs",

package/select/select-label-multiple/select-label-multiple.component.d.ts

@@ -1,7 +1,7 @@
 import { AfterViewInit } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class SelectLabelMultipleComponent implements AfterViewInit {
-    displayType: import("@angular/core").InputSignal<"tag" | "label">;
+    displayType: import("@angular/core").InputSignal<"label" | "tag">;
     selectedItems: import("@angular/core").InputSignal<any[]>;
     bindLabel: import("@angular/core").InputSignal<string>;
     bindValue: import("@angular/core").InputSignal<string>;

package/split-button/split-button.component.d.ts

@@ -1,4 +1,4 @@
-import { AfterViewChecked, ElementRef, EventEmitter } from '@angular/core';
+import { AfterContentInit, ElementRef, EventEmitter } from '@angular/core';
 import { BaseButtonDirective } from '@agorapulse/ui-components/directives';
 import { SymbolComponent } from '@agorapulse/ui-symbol';
 import { MatMenu } from '@angular/material/menu';
@@ -8,7 +8,7 @@ type SplitButtonConfig = {
     style: 'primary';
     color: 'orange' | 'blue';
 };
-export declare class SplitButtonComponent implements AfterViewChecked {
+export declare class SplitButtonComponent implements AfterContentInit {
     private symbolRegistry;
     readonly baseButtonDirective: BaseButtonDirective;
     buttonElement: ElementRef<HTMLButtonElement>;
@@ -29,7 +29,7 @@ export declare class SplitButtonComponent implements AfterViewChecked {
     blur: EventEmitter<FocusEvent>;
     menuOpen: boolean;
     constructor();
-    ngAfterViewChecked(): void;
+    ngAfterContentInit(): void;
     onSplitButtonClickHandle($event: MouseEvent): void;
     handleMenuOpened(): void;
     handleMenuClosed(): void;