carbon-components-angular 5.47.1 → 5.48.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dialog/dialog.directive.d.ts +9 -1
- package/docs/documentation/classes/NumberChange.html +34 -0
- package/docs/documentation/components/NumberComponent.html +48 -14
- package/docs/documentation/components/PaginationNav.html +262 -33
- package/docs/documentation/components/ProgressIndicator.html +2 -2
- package/docs/documentation/components/Toggletip.html +104 -68
- package/docs/documentation/coverage.html +12 -12
- package/docs/documentation/directives/DialogDirective.html +134 -84
- package/docs/documentation/directives/OverflowMenuDirective.html +73 -30
- package/docs/documentation/interfaces/PaginationNavTranslations.html +20 -2
- package/docs/documentation/js/search/search_index.js +2 -2
- package/docs/documentation/modules/ComboBoxModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ComboBoxModule.html +4 -4
- package/docs/documentation/modules/DatePickerInputModule/dependencies.svg +34 -38
- package/docs/documentation/modules/DatePickerInputModule.html +34 -38
- package/docs/documentation/modules/DatePickerModule/dependencies.svg +52 -56
- package/docs/documentation/modules/DatePickerModule.html +52 -56
- package/docs/documentation/modules/FileUploaderModule/dependencies.svg +35 -35
- package/docs/documentation/modules/FileUploaderModule.html +35 -35
- package/docs/documentation/modules/InlineLoadingModule/dependencies.svg +4 -4
- package/docs/documentation/modules/InlineLoadingModule.html +4 -4
- package/docs/documentation/modules/ProgressBarModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ProgressBarModule.html +4 -4
- package/docs/documentation/modules/RadioModule/dependencies.svg +35 -35
- package/docs/documentation/modules/RadioModule.html +35 -35
- package/docs/documentation/modules/SearchModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SearchModule.html +4 -4
- package/docs/documentation/modules/SelectModule/dependencies.svg +60 -60
- package/docs/documentation/modules/SelectModule.html +60 -60
- package/docs/documentation/modules/SliderModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SliderModule.html +4 -4
- package/docs/documentation/modules/TableModule/dependencies.svg +4 -4
- package/docs/documentation/modules/TableModule.html +4 -4
- package/docs/documentation/modules/TabsModule/dependencies.svg +68 -68
- package/docs/documentation/modules/TabsModule.html +68 -68
- package/docs/documentation/modules/TagModule/dependencies.svg +4 -4
- package/docs/documentation/modules/TagModule.html +4 -4
- package/docs/documentation/modules/ThemeModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ThemeModule.html +4 -4
- package/docs/documentation/modules/TilesModule/dependencies.svg +86 -86
- package/docs/documentation/modules/TilesModule.html +86 -86
- package/docs/documentation/modules/TimePickerModule/dependencies.svg +41 -37
- package/docs/documentation/modules/TimePickerModule.html +41 -37
- package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +40 -44
- package/docs/documentation/modules/TimePickerSelectModule.html +40 -44
- package/docs/documentation/modules/ToggleModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ToggleModule.html +4 -4
- package/docs/documentation/modules/ToggletipModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ToggletipModule.html +4 -4
- package/docs/documentation/modules/TooltipModule/dependencies.svg +29 -29
- package/docs/documentation/modules/TooltipModule.html +29 -29
- package/docs/documentation/modules/TreeviewModule/dependencies.svg +36 -36
- package/docs/documentation/modules/TreeviewModule.html +36 -36
- package/docs/documentation/modules/UIShellModule/dependencies.svg +4 -4
- package/docs/documentation/modules/UIShellModule.html +4 -4
- package/docs/documentation.json +245 -172
- package/docs/storybook/7773.b5e74332.iframe.bundle.js +1 -0
- package/docs/storybook/{8341.2bf88948.iframe.bundle.js → 8341.d095fdee.iframe.bundle.js} +1 -1
- package/docs/storybook/{dialog-overflow-menu-overflow-menu-stories.a7b8273a.iframe.bundle.js → dialog-overflow-menu-overflow-menu-stories.cd56a223.iframe.bundle.js} +1 -1
- package/docs/storybook/iframe.html +2 -2
- package/docs/storybook/main.css +3007 -2790
- package/docs/storybook/main.e6ee5d76.iframe.bundle.js +1 -0
- package/docs/storybook/{number-input-number-stories.6aba5a3d.iframe.bundle.js → number-input-number-stories.8d02c22f.iframe.bundle.js} +1 -1
- package/docs/storybook/pagination-pagination-nav-stories.7b305bf2.iframe.bundle.js +1 -0
- package/docs/storybook/project.json +1 -1
- package/docs/storybook/{runtime~main.724b23c2.iframe.bundle.js → runtime~main.90978505.iframe.bundle.js} +1 -1
- package/docs/storybook/{toggletip-toggletip-stories.93f48d46.iframe.bundle.js → toggletip-toggletip-stories.c3354041.iframe.bundle.js} +1 -1
- package/esm2020/dialog/dialog.directive.mjs +19 -15
- package/esm2020/number-input/number.component.mjs +31 -1
- package/esm2020/pagination/pagination-nav/pagination-nav.component.mjs +32 -5
- package/esm2020/progress-indicator/progress-indicator.component.mjs +2 -2
- package/esm2020/toggletip/toggletip.component.mjs +5 -2
- package/fesm2015/carbon-components-angular-dialog.mjs +18 -15
- package/fesm2015/carbon-components-angular-dialog.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-number-input.mjs +30 -0
- package/fesm2015/carbon-components-angular-number-input.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-pagination.mjs +31 -4
- package/fesm2015/carbon-components-angular-pagination.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-progress-indicator.mjs +1 -1
- package/fesm2015/carbon-components-angular-progress-indicator.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-toggletip.mjs +4 -1
- package/fesm2015/carbon-components-angular-toggletip.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-dialog.mjs +18 -15
- package/fesm2020/carbon-components-angular-dialog.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-number-input.mjs +30 -0
- package/fesm2020/carbon-components-angular-number-input.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-pagination.mjs +31 -4
- package/fesm2020/carbon-components-angular-pagination.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-progress-indicator.mjs +1 -1
- package/fesm2020/carbon-components-angular-progress-indicator.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-toggletip.mjs +4 -1
- package/fesm2020/carbon-components-angular-toggletip.mjs.map +1 -1
- package/package.json +1 -1
- package/pagination/pagination-nav/pagination-nav.component.d.ts +8 -1
- package/progress-indicator/progress-indicator.component.d.ts +1 -1
- package/toggletip/toggletip.component.d.ts +4 -2
- package/docs/storybook/7773.cac12c93.iframe.bundle.js +0 -1
- package/docs/storybook/main.76a5a273.iframe.bundle.js +0 -1
- package/docs/storybook/pagination-pagination-nav-stories.ace8938b.iframe.bundle.js +0 -1
|
@@ -79,6 +79,13 @@ export declare class PaginationNav {
|
|
|
79
79
|
* ```
|
|
80
80
|
*/
|
|
81
81
|
set translations(value: PaginationNavTranslations);
|
|
82
|
+
/**
|
|
83
|
+
* Sets the pagination nav size
|
|
84
|
+
*/
|
|
85
|
+
size: "sm" | "md" | "lg";
|
|
86
|
+
get smallLayoutSize(): boolean;
|
|
87
|
+
get mediumLayoutSize(): boolean;
|
|
88
|
+
get largeLayoutSize(): boolean;
|
|
82
89
|
/**
|
|
83
90
|
* Emits the new page number.
|
|
84
91
|
*
|
|
@@ -104,5 +111,5 @@ export declare class PaginationNav {
|
|
|
104
111
|
getPages(): number[];
|
|
105
112
|
private getCuts;
|
|
106
113
|
static ɵfac: i0.ɵɵFactoryDeclaration<PaginationNav, never>;
|
|
107
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<PaginationNav, "cds-pagination-nav, ibm-pagination-navm", never, { "model": "model"; "disabled": "disabled"; "numOfItemsToShow": "numOfItemsToShow"; "translations": "translations"; }, { "selectPage": "selectPage"; }, never, never, false>;
|
|
114
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<PaginationNav, "cds-pagination-nav, ibm-pagination-navm", never, { "model": "model"; "disabled": "disabled"; "numOfItemsToShow": "numOfItemsToShow"; "translations": "translations"; "size": "size"; }, { "selectPage": "selectPage"; }, never, never, false>;
|
|
108
115
|
}
|
|
@@ -26,7 +26,7 @@ import * as i0 from "@angular/core";
|
|
|
26
26
|
* Get started with importing the module:
|
|
27
27
|
*
|
|
28
28
|
* ```typescript
|
|
29
|
-
* import {
|
|
29
|
+
* import { ProgressIndicatorModule } from 'carbon-components-angular';
|
|
30
30
|
* ```
|
|
31
31
|
*
|
|
32
32
|
* [See demo](../../?path=/story/components-progress-indicator--basic)
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
*/
|
|
19
19
|
|
|
20
20
|
|
|
21
|
-
import { AfterViewInit, ChangeDetectorRef, ElementRef, NgZone, Renderer2 } from "@angular/core";
|
|
21
|
+
import { AfterViewInit, ChangeDetectorRef, ElementRef, NgZone, OnDestroy, Renderer2 } from "@angular/core";
|
|
22
22
|
import { PopoverContainer } from "carbon-components-angular/popover";
|
|
23
23
|
import * as i0 from "@angular/core";
|
|
24
24
|
/**
|
|
@@ -30,7 +30,7 @@ import * as i0 from "@angular/core";
|
|
|
30
30
|
*
|
|
31
31
|
* [See demo](../../?path=/story/components-toggletip--basic)
|
|
32
32
|
*/
|
|
33
|
-
export declare class Toggletip extends PopoverContainer implements AfterViewInit {
|
|
33
|
+
export declare class Toggletip extends PopoverContainer implements AfterViewInit, OnDestroy {
|
|
34
34
|
protected hostElement: ElementRef;
|
|
35
35
|
protected ngZone: NgZone;
|
|
36
36
|
protected renderer: Renderer2;
|
|
@@ -41,10 +41,12 @@ export declare class Toggletip extends PopoverContainer implements AfterViewInit
|
|
|
41
41
|
isOpen: boolean;
|
|
42
42
|
btn: ElementRef;
|
|
43
43
|
documentClick: any;
|
|
44
|
+
private subscription;
|
|
44
45
|
constructor(hostElement: ElementRef, ngZone: NgZone, renderer: Renderer2, changeDetectorRef: ChangeDetectorRef);
|
|
45
46
|
ngAfterViewInit(): void;
|
|
46
47
|
hostkeys(event: KeyboardEvent): void;
|
|
47
48
|
handleFocusOut(event: any): void;
|
|
49
|
+
ngOnDestroy(): void;
|
|
48
50
|
private handleExpansion;
|
|
49
51
|
static ɵfac: i0.ɵɵFactoryDeclaration<Toggletip, never>;
|
|
50
52
|
static ɵcmp: i0.ɵɵComponentDeclaration<Toggletip, "cds-toggletip, ibm-toggletip", never, { "id": "id"; "isOpen": "isOpen"; }, {}, ["btn"], ["[cdsToggletipButton]", "[cdsToggletipContent]"], false>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[7773],{"./src/common/tab.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{X9:()=>tabbableSelectorIgnoreTabIndex,ZW:()=>getFocusElementList,jv:()=>isFocusInLastItem,nW:()=>cycleTabs,o$:()=>tabbableSelector,w3:()=>isFocusInFirstItem});let tabbableSelector="a[href], area[href], input:not([disabled]):not([tabindex='-1']), button:not([disabled]):not([tabindex='-1']),select:not([disabled]):not([tabindex='-1']), textarea:not([disabled]):not([tabindex='-1']), iframe, object, embed, *[tabindex]:not([tabindex='-1']), *[contenteditable=true]",tabbableSelectorIgnoreTabIndex="a[href], area[href], input:not([disabled]), button:not([disabled]),select:not([disabled]), textarea:not([disabled]), iframe, object, embed, *[tabindex], *[contenteditable=true]";function getFocusElementList(element,selector=tabbableSelector){let elements=element.querySelectorAll(selector);return elements?Array.prototype.filter.call(elements,(el=>function isVisible(element){return!!(element.offsetWidth||element.offsetHeight||element.getClientRects().length)}(el))):elements}function isFocusInFirstItem(event,list){return list.length>0&&(event.target||event.srcElement)===list[0]}function isFocusInLastItem(event,list){return list.length>0&&(event.target||event.srcElement)===list[list.length-1]}function cycleTabs(event,element){if("Tab"===event.key){let list=getFocusElementList(element),focusChanged=!1;event.shiftKey?(isFocusInFirstItem(event,list)||function isElementFocused(event,element){return(event.target||event.srcElement)===element}(event,element))&&(focusChanged=function focusLastFocusableElement(list){return list.length>0&&(list[list.length-1].focus(),!0)}(list)):isFocusInLastItem(event,list)&&(focusChanged=function focusFirstFocusableElement(list){return list.length>0&&(list[0].focus(),!0)}(list)),focusChanged&&(event.preventDefault(),event.stopPropagation())}}},"./src/dialog/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Su:()=>DialogModule,PQ:()=>OverflowMenu});var CloseReasons,tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");!function(CloseReasons){CloseReasons[CloseReasons.destroyed=0]="destroyed",CloseReasons[CloseReasons.programmatic=1]="programmatic",CloseReasons[CloseReasons.interaction=2]="interaction",CloseReasons[CloseReasons.hidden=3]="hidden"}(CloseReasons||(CloseReasons={}));var placeholder=__webpack_require__("./src/placeholder/index.ts"),tab_service=__webpack_require__("./src/common/tab.service.ts");let DialogService=class DialogService{constructor(injector,placeholderService){this.injector=injector,this.placeholderService=placeholderService}static closeAll(){DialogService.dialogRefs.forEach((ref=>ref.instance.doClose({reason:CloseReasons.programmatic}))),DialogService.dialogRefs.clear()}open(viewContainer,dialogConfig,component){if(!component)return;let dialogRef;return dialogConfig.appendInline?dialogRef=viewContainer.createComponent(component,{index:0,injector:this.injector}):this.placeholderService.hasPlaceholderRef()?dialogRef=this.placeholderService.createComponent(component,this.injector):(dialogRef=viewContainer.createComponent(component,{index:0,injector:this.injector}),dialogRef&&setTimeout((()=>{window.document.querySelector("body").appendChild(dialogRef.location.nativeElement)}))),DialogService.dialogRefs.add(dialogRef),dialogConfig.previouslyFocusedElement=document.activeElement,dialogRef.instance.dialogConfig=dialogConfig,dialogRef.instance.elementRef.nativeElement.focus(),dialogRef}close(dialogRef){if(!dialogRef)return;const elementToFocus=dialogRef.instance.dialogConfig.previouslyFocusedElement;dialogRef.destroy(),DialogService.dialogRefs.has(dialogRef)&&DialogService.dialogRefs.delete(dialogRef),dialogRef.location.nativeElement.querySelectorAll(tab_service.o$)||elementToFocus.focus()}singletonClickListen(){DialogService.listeningForBodyClicks||(document.body.firstElementChild.addEventListener("click",(()=>null),!0),DialogService.listeningForBodyClicks=!0)}};DialogService.listeningForBodyClicks=!1,DialogService.dialogRefs=new Set,DialogService.ctorParameters=()=>[{type:core.Injector},{type:placeholder.Q_}],DialogService=(0,tslib_es6.gn)([(0,core.Injectable)()],DialogService);var Subscription=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),utils_position=__webpack_require__("./node_modules/@carbon/utils-position/index.js"),utils=__webpack_require__("./src/utils/index.ts");let Dialog=class Dialog{constructor(elementRef,elementService,animationFrameService=null){this.elementRef=elementRef,this.elementService=elementService,this.animationFrameService=animationFrameService,this.close=new core.EventEmitter,this.data={},this.visibilitySubscription=new Subscription.w0,this.animationFrameSubscription=new Subscription.w0,this.addGap={left:pos=>utils_position.FK.addOffset(pos,0,-this.dialogConfig.gap),right:pos=>utils_position.FK.addOffset(pos,0,this.dialogConfig.gap),top:pos=>utils_position.FK.addOffset(pos,-this.dialogConfig.gap),bottom:pos=>utils_position.FK.addOffset(pos,this.dialogConfig.gap),"left-bottom":pos=>utils_position.FK.addOffset(pos,0,-this.dialogConfig.gap),"right-bottom":pos=>utils_position.FK.addOffset(pos,0,this.dialogConfig.gap)},this.placements={}}ngOnInit(){this.placement=this.dialogConfig.placement.split(",")[0],this.data=this.dialogConfig.data,this.onDialogInit()}ngAfterViewInit(){const dialogElement=this.dialog.nativeElement;if(this.dialogConfig.wrapperClass)for(const extraClass of this.dialogConfig.wrapperClass.split(" "))dialogElement.classList.add(extraClass);(0,tab_service.ZW)(this.dialog.nativeElement).length>0&&dialogElement.focus();const parentElement=this.dialogConfig.parentRef.nativeElement;this.animationFrameService&&(this.animationFrameSubscription=this.animationFrameService.tick.subscribe((()=>{this.placeDialog()}))),this.dialogConfig.closeWhenHidden&&(this.visibilitySubscription=this.elementService.visibility(parentElement,parentElement).subscribe((value=>{this.placeDialog(),value.visible||this.doClose({reason:CloseReasons.hidden})}))),this.placeDialog(),setTimeout((()=>this.afterDialogViewInit()))}onDialogInit(){}afterDialogViewInit(){}placeDialog(){const positionService=new utils_position.ZP(this.placements);let parentEl=this.dialogConfig.parentRef.nativeElement,el=this.dialog.nativeElement,dialogPlacement=this.placement;const placements=this.dialogConfig.placement.split(",");dialogPlacement=positionService.findBestPlacement(parentEl,el,placements);const pos=((reference,target,placement)=>{let pos;return pos=this.dialogConfig.appendInline?this.addGap[placement](positionService.findRelative(reference,target,placement)):this.addGap[placement](positionService.findAbsolute(reference,target,placement)),this.dialogConfig.offset&&(pos.top=pos.top+this.dialogConfig.offset.y,pos.left=pos.left+this.dialogConfig.offset.x),pos})(parentEl,el,dialogPlacement);positionService.setElement(el,pos),setTimeout((()=>{this.placement=dialogPlacement}))}escapeClose(event){switch(event.key){case"Escape":event.stopImmediatePropagation(),this.doClose({reason:CloseReasons.interaction,target:event.target});break;case"Tab":(0,tab_service.nW)(event,this.elementRef.nativeElement)}}clickClose(event){this.elementRef.nativeElement.contains(event.target)||this.dialogConfig.parentRef.nativeElement.contains(event.target)||this.doClose({reason:CloseReasons.interaction,target:event.target})}doClose(meta={reason:CloseReasons.interaction}){this.close.emit(meta)}ngOnDestroy(){this.visibilitySubscription.unsubscribe(),this.animationFrameSubscription&&this.animationFrameSubscription.unsubscribe()}};Dialog.ctorParameters=()=>[{type:core.ElementRef},{type:utils.d2},{type:utils.NV,decorators:[{type:core.Optional}]}],Dialog.propDecorators={close:[{type:core.Output}],dialogConfig:[{type:core.Input}],dialog:[{type:core.ViewChild,args:["dialog"]}],escapeClose:[{type:core.HostListener,args:["keydown",["$event"]]}],clickClose:[{type:core.HostListener,args:["document:click",["$event"]]}]},Dialog=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-dialog, ibm-dialog",template:""})],Dialog);let DialogDirective=class DialogDirective{constructor(elementRef,viewContainerRef,dialogService,eventService){this.elementRef=elementRef,this.viewContainerRef=viewContainerRef,this.dialogService=dialogService,this.eventService=eventService,this.title="",this.trigger="click",this.closeTrigger="mouseleave",this.placement="left",this.gap=0,this.appendInline=!1,this.data={},this.isOpen=!1,this.disabled=!1,this.onClose=new core.EventEmitter,this.onOpen=new core.EventEmitter,this.isOpenChange=new core.EventEmitter,this.role="button",this.hasPopup=!0}set ibmDialog(body){this.cdsDialog=body}get ariaOwns(){return this.isOpen?this.dialogConfig.compID:null}ngOnChanges(changes){this.dialogConfig={title:this.title,content:this.cdsDialog,placement:this.placement,parentRef:this.elementRef,gap:this.gap,trigger:this.trigger,closeTrigger:this.closeTrigger,shouldClose:this.shouldClose||(()=>!0),appendInline:this.appendInline,wrapperClass:this.wrapperClass,data:this.data,offset:this.offset,disabled:this.disabled},changes.isOpen&&(changes.isOpen.currentValue?this.open():changes.isOpen.firstChange||this.close({reason:CloseReasons.programmatic})),this.onDialogChanges(changes),this.updateConfig()}ngOnInit(){this.dialogService.singletonClickListen();const element=this.elementRef.nativeElement;this.eventService.on(element,"keydown",(event=>{(event.target===this.dialogConfig.parentRef.nativeElement&&("Tab"===event.key||"Tab"===event.key&&event.shiftKey)||"Escape"===event.key)&&this.close({reason:CloseReasons.interaction,target:event.target})})),"hover"===this.trigger||"mouseenter"===this.trigger?(this.eventService.on(element,"mouseenter",this.open.bind(this)),this.eventService.on(element,this.closeTrigger,(event=>{this.close({reason:CloseReasons.interaction,target:event.target})})),this.eventService.on(element,"focus",this.open.bind(this)),this.eventService.on(element,"blur",(event=>{this.close({reason:CloseReasons.interaction,target:event.target})}))):(this.eventService.on(element,"click",(event=>{this.toggle({reason:CloseReasons.interaction,target:event.target})})),this.eventService.on(element,"keydown",(event=>{"Enter"!==event.key&&" "!==event.key||setTimeout((()=>{this.open()}))}))),DialogDirective.dialogCounter++,this.dialogConfig.compID="dialog-"+DialogDirective.dialogCounter,this.onDialogInit(),this.updateConfig()}ngOnDestroy(){this.close({reason:CloseReasons.destroyed})}open(component){if(!this.dialogRef&&!this.disabled)return this.dialogRef=this.dialogService.open(this.viewContainerRef,this.dialogConfig,component),this.isOpen=!0,this.onOpen.emit(),this.isOpenChange.emit(!0),this.dialogRef.instance.close.subscribe((meta=>{this.dialogRef&&this.dialogConfig.shouldClose&&this.dialogConfig.shouldClose(meta)&&(this.dialogService.close(this.dialogRef),this.dialogRef=null,this.isOpen=!1,this.onClose.emit(),this.isOpenChange.emit(!1))})),this.dialogRef}toggle(meta={reason:CloseReasons.interaction}){this.isOpen?this.close(meta):this.open()}close(meta={reason:CloseReasons.interaction}){this.dialogRef&&this.dialogRef.instance.doClose(meta)}onDialogInit(){}onDialogChanges(_changes){}updateConfig(){}};DialogDirective.dialogCounter=0,DialogDirective.ctorParameters=()=>[{type:core.ElementRef},{type:core.ViewContainerRef},{type:DialogService},{type:utils.PO}],DialogDirective.propDecorators={title:[{type:core.Input}],ibmDialog:[{type:core.Input}],cdsDialog:[{type:core.Input}],trigger:[{type:core.Input}],closeTrigger:[{type:core.Input}],placement:[{type:core.Input}],offset:[{type:core.Input}],wrapperClass:[{type:core.Input}],gap:[{type:core.Input}],appendInline:[{type:core.Input}],data:[{type:core.Input}],isOpen:[{type:core.Input},{type:core.HostBinding,args:["attr.aria-expanded"]}],disabled:[{type:core.Input}],shouldClose:[{type:core.Input}],onClose:[{type:core.Output}],onOpen:[{type:core.Output}],isOpenChange:[{type:core.Output}],role:[{type:core.HostBinding,args:["attr.role"]}],hasPopup:[{type:core.HostBinding,args:["attr.aria-haspopup"]}],ariaOwns:[{type:core.HostBinding,args:["attr.aria-owns"]}]},DialogDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsDialog], [ibmDialog]",exportAs:"dialog",providers:[DialogService]})],DialogDirective);var i18n=__webpack_require__("./src/i18n/index.ts"),experimental=__webpack_require__("./src/experimental/index.ts");let OverflowMenuPane=class OverflowMenuPane extends Dialog{constructor(elementRef,i18n,experimental,animationFrameService=null,elementService=null){super(elementRef,elementService,animationFrameService),this.elementRef=elementRef,this.i18n=i18n,this.experimental=experimental,this.animationFrameService=animationFrameService,this.elementService=elementService}onDialogInit(){const positionOverflowMenu=pos=>{let offset;const closestRel=(0,utils._K)("position",["relative","fixed","absolute"],this.elementRef.nativeElement),topFix=closestRel?-1*closestRel.getBoundingClientRect().top:0,leftFix=closestRel?-1*closestRel.getBoundingClientRect().left:0;return offset=Math.round(this.dialog.nativeElement.offsetWidth/2)-20,this.dialogConfig.flip?utils_position.FK.addOffset(pos,topFix,-offset+leftFix):utils_position.FK.addOffset(pos,topFix,offset+leftFix)};this.addGap.bottom=positionOverflowMenu,this.addGap.top=positionOverflowMenu,this.dialogConfig.menuLabel||(this.dialogConfig.menuLabel=this.i18n.get().OVERFLOW_MENU.OVERFLOW)}hostkeys(event){const listItems=this.listItems();switch(event.key){case"ArrowDown":if(event.preventDefault(),(0,tab_service.jv)(event,listItems))listItems[0].focus();else{const index=listItems.findIndex((item=>item===event.target));listItems[index+1].focus()}break;case"ArrowUp":if(event.preventDefault(),(0,tab_service.w3)(event,listItems))listItems[listItems.length-1].focus();else{const index=listItems.findIndex((item=>item===event.target));listItems[index-1].focus()}break;case"Home":event.preventDefault(),listItems[0].focus();break;case"End":event.preventDefault(),listItems[listItems.length-1].focus();break;case"Escape":case"Tab":event.stopImmediatePropagation(),this.doClose({reason:CloseReasons.interaction,target:event.target})}}onClose(event){this.doClose({reason:CloseReasons.interaction,target:event.target})}afterDialogViewInit(){const focusElementList=this.listItems();focusElementList.forEach((button=>{null===button.getAttribute("tabindex")&&(button.tabIndex=-1)})),focusElementList[0]&&(focusElementList[0].tabIndex=0,focusElementList[0].focus())}listItems(){return Array.from(this.elementRef.nativeElement.querySelectorAll(".cds--overflow-menu-options__option:not([disabled]) .cds--overflow-menu-options__btn"))}};OverflowMenuPane.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc},{type:experimental.tM},{type:utils.NV,decorators:[{type:core.Optional}]},{type:utils.d2,decorators:[{type:core.Optional}]}],OverflowMenuPane.propDecorators={hostkeys:[{type:core.HostListener,args:["keydown",["$event"]]}]},OverflowMenuPane=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-overflow-menu-pane, ibm-overflow-menu-pane",template:'\n\t\t<ul\n\t\t\t[attr.id]="dialogConfig.compID"\n\t\t\t[attr.aria-label]="dialogConfig.menuLabel"\n\t\t\t[attr.data-floating-menu-direction]="placement ? placement : null"\n\t\t\t[ngClass]="{\'cds--overflow-menu--flip\': dialogConfig.flip}"\n\t\t\trole="menu"\n\t\t\t#dialog\n\t\t\tclass="cds--overflow-menu-options cds--overflow-menu-options--open"\n\t\t\t(click)="onClose($event)"\n\t\t\t[attr.aria-label]="dialogConfig.menuLabel">\n\t\t\t<ng-template\n\t\t\t\t[ngTemplateOutlet]="dialogConfig.content"\n\t\t\t\t[ngTemplateOutletContext]="{overflowMenu: this}">\n\t\t\t</ng-template>\n\t\t</ul>\n\t'})],OverflowMenuPane);let OverflowMenuCustomPane=class OverflowMenuCustomPane extends Dialog{constructor(elementRef,i18n,animationFrameService=null,elementService=null){super(elementRef,elementService,animationFrameService),this.elementRef=elementRef,this.i18n=i18n,this.animationFrameService=animationFrameService,this.elementService=elementService}onClick(event){this.doClose({reason:CloseReasons.interaction,target:event.target})}onDialogInit(){const positionOverflowMenu=pos=>{let offset;const closestRel=(0,utils._K)("position",["relative","fixed","absolute"],this.elementRef.nativeElement),topFix=closestRel?-1*closestRel.getBoundingClientRect().top:0,leftFix=closestRel?-1*closestRel.getBoundingClientRect().left:0;return offset=Math.round(this.dialog.nativeElement.offsetWidth/2)-20,this.dialogConfig.flip?utils_position.FK.addOffset(pos,topFix,-offset+leftFix):utils_position.FK.addOffset(pos,topFix,offset+leftFix)};this.addGap.bottom=positionOverflowMenu,this.addGap.top=positionOverflowMenu,this.dialogConfig.menuLabel||(this.dialogConfig.menuLabel=this.i18n.get().OVERFLOW_MENU.OVERFLOW)}};OverflowMenuCustomPane.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc},{type:utils.NV,decorators:[{type:core.Optional}]},{type:utils.d2,decorators:[{type:core.Optional}]}],OverflowMenuCustomPane=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-overflow-custom-menu-pane, ibm-overflow-custom-menu-pane",template:'\n\t\t<div\n\t\t\t[attr.id]="dialogConfig.compID"\n\t\t\t[attr.aria-label]="dialogConfig.menuLabel"\n\t\t\t[attr.data-floating-menu-direction]="placement ? placement : null"\n\t\t\t[ngClass]="{\'cds--overflow-menu--flip\': dialogConfig.flip}"\n\t\t\tclass="cds--overflow-menu-options cds--overflow-menu-options--open"\n\t\t\trole="menu"\n\t\t\t(click)="onClick($event)"\n\t\t\t#dialog\n\t\t\t[attr.aria-label]="dialogConfig.menuLabel">\n\t\t\t<ng-template\n\t\t\t\t[ngTemplateOutlet]="dialogConfig.content"\n\t\t\t\t[ngTemplateOutletContext]="{overflowMenu: this}">\n\t\t\t</ng-template>\n\t\t</div>\n\t'})],OverflowMenuCustomPane);let OverflowMenuDirective=class OverflowMenuDirective extends DialogDirective{constructor(elementRef,viewContainerRef,dialogService,eventService){super(elementRef,viewContainerRef,dialogService,eventService),this.elementRef=elementRef,this.viewContainerRef=viewContainerRef,this.dialogService=dialogService,this.eventService=eventService,this.flip=!1,this.wrapperClass="",this.customPane=!1}set ibmOverflowMenu(template){this.cdsOverflowMenu=template}updateConfig(){this.dialogConfig.content=this.cdsOverflowMenu,this.dialogConfig.flip=this.flip,this.dialogConfig.offset=this.offset,this.dialogConfig.wrapperClass=this.wrapperClass}hostkeys(event){switch(event.key){case"Enter":case" ":event.preventDefault()}}open(){return super.open(this.customPane?OverflowMenuCustomPane:OverflowMenuPane)}};OverflowMenuDirective.ctorParameters=()=>[{type:core.ElementRef},{type:core.ViewContainerRef},{type:DialogService},{type:utils.PO}],OverflowMenuDirective.propDecorators={ibmOverflowMenu:[{type:core.Input}],cdsOverflowMenu:[{type:core.Input}],flip:[{type:core.Input}],offset:[{type:core.Input}],wrapperClass:[{type:core.Input}],customPane:[{type:core.Input}],hostkeys:[{type:core.HostListener,args:["keydown",["$event"]]}]},OverflowMenuDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsOverflowMenu], [ibmOverflowMenu]",exportAs:"overflowMenu",providers:[DialogService]})],OverflowMenuDirective);var src_button=__webpack_require__("./src/button/index.ts");let OverflowMenu=class OverflowMenu extends src_button.HL{constructor(elementRef,i18n){super(),this.elementRef=elementRef,this.i18n=i18n,this.buttonLabel=this.i18n.get().OVERFLOW_MENU.OVERFLOW,this.description=this.i18n.get().OVERFLOW_MENU.ICON_DESCRIPTION,this.flip=!1,this.placement="bottom",this.open=!1,this.openChange=new core.EventEmitter,this.wrapperClass="",this.triggerClass=""}handleOpenChange(event){this.open=event,this.openChange.emit(event)}};var Target;OverflowMenu.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc}],OverflowMenu.propDecorators={buttonLabel:[{type:core.Input}],description:[{type:core.Input}],flip:[{type:core.Input}],placement:[{type:core.Input}],open:[{type:core.Input}],openChange:[{type:core.Output}],customTrigger:[{type:core.Input}],offset:[{type:core.Input}],wrapperClass:[{type:core.Input}],triggerClass:[{type:core.Input}],overflowMenuDirective:[{type:core.ContentChild,args:[OverflowMenuDirective]}]},OverflowMenu=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-overflow-menu, ibm-overflow-menu",template:'\n\t\t<cds-tooltip\n\t\t\tclass="cds--icon-tooltip"\n\t\t\t[description]="description"\n\t\t\t[caret]="caret"\n\t\t\t[dropShadow]="dropShadow"\n\t\t\t[highContrast]="highContrast"\n\t\t\t[isOpen]="isOpen"\n\t\t\t[align]="align"\n\t\t\t[autoAlign]="autoAlign"\n\t\t\t[enterDelayMs]="enterDelayMs"\n\t\t\t[leaveDelayMs]="leaveDelayMs">\n\t\t\t<button\n\t\t\t\tcdsButton="ghost"\n\t\t\t\t[cdsOverflowMenu]="options"\n\t\t\t\t[ngClass]="{\'cds--overflow-menu--open\': open}"\n\t\t\t\tclass="cds--overflow-menu {{triggerClass}}"\n\t\t\t\t[iconOnly]="true"\n\t\t\t\t[attr.aria-label]="buttonLabel"\n\t\t\t\t[flip]="flip"\n\t\t\t\t[isOpen]="open"\n\t\t\t\t(isOpenChange)="handleOpenChange($event)"\n\t\t\t\t[offset]="offset"\n\t\t\t\t[wrapperClass]="wrapperClass"\n\t\t\t\taria-haspopup="true"\n\t\t\t\ttype="button"\n\t\t\t\t[placement]="placement">\n\t\t\t\t<ng-template *ngIf="customTrigger; else defaultIcon" [ngTemplateOutlet]="customTrigger"></ng-template>\n\t\t\t</button>\n\t\t</cds-tooltip>\n\n\t\t<ng-template #options>\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t\t<ng-template #defaultIcon>\n\t\t\t<svg cdsIcon="overflow-menu--vertical" size="16" class="cds--overflow-menu__icon"></svg>\n\t\t</ng-template>\n\t',encapsulation:core.ViewEncapsulation.None,styles:["\n\t\t.cds--overflow-menu--open {\n\t\t\topacity: 1\n\t\t}\n\n\t\t/*\n\t\tRotate the overflow menu container as well as the icon, since\n\t\twe calculate our menu position based on the container, not the icon.\n\t\t*/\n\n\t\t.cds--data-table-v2 .cds--overflow-menu {\n\t\t\ttransform: rotate(90deg);\n\t\t}\n\n\t\t.cds--data-table-v2 .cds--overflow-menu__icon {\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t"]})],OverflowMenu),function(Target){Target.self="_self",Target.blank="_blank",Target.parent="_parent",Target.top="_top"}(Target||(Target={}));let OverflowMenuOption=class OverflowMenuOption{constructor(elementRef){this.elementRef=elementRef,this.optionClass=!0,this.role="presentation",this.divider=!1,this.type="normal",this.disabled=!1,this.innerClass="",this.selected=new core.EventEmitter,this.tabIndex=-1,this.title=null}get isDanger(){return"danger"===this.type}get isDisabled(){return this.disabled}set target(value){Object.values(Target).includes(value)?this._target=value:console.warn(`\`target\` must have one of the following values: ${Object.values(Target).join(", ")}.\nPlease use the \`Target\` enum exported by carbon-components-angular`)}get target(){return this._target}get rel(){return this._target?"noreferrer noopener":null}onClick(){this.selected.emit()}onFocus(){setTimeout((()=>this.tabIndex=0))}onBlur(){setTimeout((()=>this.tabIndex=-1))}ngAfterViewInit(){const button=this.elementRef.nativeElement.querySelector("button, a"),textContainer=button.querySelector(".cds--overflow-menu-options__option-content");textContainer.scrollWidth>textContainer.offsetWidth&&(this.title=button.textContent)}};OverflowMenuOption.ctorParameters=()=>[{type:core.ElementRef}],OverflowMenuOption.propDecorators={optionClass:[{type:core.HostBinding,args:["class.cds--overflow-menu-options__option"]}],role:[{type:core.HostBinding,args:["attr.role"]}],isDanger:[{type:core.HostBinding,args:["class.cds--overflow-menu-options__option--danger"]}],isDisabled:[{type:core.HostBinding,args:["class.cds--overflow-menu-options__option--disabled"]}],divider:[{type:core.HostBinding,args:["class.cds--overflow-menu--divider"]},{type:core.Input}],type:[{type:core.Input}],disabled:[{type:core.Input}],href:[{type:core.Input}],target:[{type:core.Input}],innerClass:[{type:core.Input}],selected:[{type:core.Output}]},OverflowMenuOption=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-overflow-menu-option, ibm-overflow-menu-option",template:'\n\t\t<button\n\t\t\t*ngIf="!href"\n\t\t\tclass="cds--overflow-menu-options__btn {{innerClass}}"\n\t\t\trole="menuitem"\n\t\t\t[tabindex]="tabIndex"\n\t\t\t(focus)="onFocus()"\n\t\t\t(blur)="onBlur()"\n\t\t\t(click)="onClick()"\n\t\t\t[disabled]="disabled"\n\t\t\t[attr.title]="title">\n\t\t\t<ng-container *ngTemplateOutlet="tempOutlet"></ng-container>\n\t\t</button>\n\n\t\t<a\n\t\t\t*ngIf="href"\n\t\t\tclass="cds--overflow-menu-options__btn {{innerClass}}"\n\t\t\trole="menuitem"\n\t\t\t[tabindex]="tabIndex"\n\t\t\t(focus)="onFocus()"\n\t\t\t(blur)="onBlur()"\n\t\t\t(click)="onClick()"\n\t\t\t[attr.disabled]="disabled"\n\t\t\t[href]="href"\n\t\t\t[attr.target]="target"\n\t\t\t[attr.rel]="rel"\n\t\t\t[attr.title]="title">\n\t\t\t<ng-container *ngTemplateOutlet="tempOutlet"></ng-container>\n\t\t</a>\n\n\t\t<ng-template #tempOutlet>\n\t\t\t<div class="cds--overflow-menu-options__option-content">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</div>\n\t\t</ng-template>\n\t'})],OverflowMenuOption);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts"),tooltip=__webpack_require__("./src/tooltip/index.ts");let DialogModule=class DialogModule{};DialogModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Dialog,OverflowMenu,OverflowMenuPane,OverflowMenuCustomPane,DialogDirective,OverflowMenuDirective,OverflowMenuOption],exports:[Dialog,OverflowMenu,OverflowMenuPane,OverflowMenuCustomPane,DialogDirective,OverflowMenuDirective,OverflowMenuOption],providers:[DialogService],imports:[common.CommonModule,i18n.LU,placeholder.Qq,experimental.OV,utils.As,icon.QX,src_button.hJ,tooltip.z8]})],DialogModule)},"./src/placeholder/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Qq:()=>PlaceholderModule,Q_:()=>PlaceholderService});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let PlaceholderService=class PlaceholderService{constructor(){this.viewContainerRef=null,this.viewContainerMap=new Map}registerViewContainerRef(vcRef,id){id?this.viewContainerMap.set(id,vcRef):this.viewContainerRef=vcRef}createComponent(component,injector,id){return id?this.viewContainerMap.has(id)?this.viewContainerMap.get(id).createComponent(component,{index:this.viewContainerMap.size,injector}):void console.error(`No view container with id ${id} found`):this.viewContainerRef?this.viewContainerRef.createComponent(component,{index:this.viewContainerRef.length,injector}):void console.error("No view container defined! Likely due to a missing `cds-placeholder`")}destroyComponent(component){component.destroy()}hasComponentRef(component,id){return id?!(this.viewContainerMap.get(id).indexOf(component.hostView)<0):!(this.viewContainerRef.indexOf(component.hostView)<0)}hasPlaceholderRef(id){return id?this.viewContainerMap.has(id):!!this.viewContainerRef}appendElement(element,id){return id?this.viewContainerMap.get(id).element.nativeElement.appendChild(element):this.viewContainerRef.element.nativeElement.appendChild(element)}removeElement(element,id){return id?this.viewContainerMap.get(id).element.nativeElement.removeChild(element):this.viewContainerRef.element.nativeElement.removeChild(element)}hasElement(element,id){return id?this.viewContainerMap.get(id).element.nativeElement.contains(element):this.viewContainerRef.element.nativeElement.contains(element)}};PlaceholderService=(0,tslib_es6.gn)([(0,core.Injectable)()],PlaceholderService);let Placeholder=class Placeholder{constructor(placeholderService){this.placeholderService=placeholderService}ngOnInit(){this.placeholderService.registerViewContainerRef(this.viewContainerRef)}};Placeholder.ctorParameters=()=>[{type:PlaceholderService}],Placeholder.propDecorators={id:[{type:core.Input}],viewContainerRef:[{type:core.ViewChild,args:["placeholder",{read:core.ViewContainerRef,static:!0}]}]},Placeholder=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-placeholder, ibm-placeholder",template:"<div #placeholder></div>"})],Placeholder);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");const PLACEHOLDER_SERVICE_PROVIDER={provide:PlaceholderService,deps:[[new core.Optional,new core.SkipSelf,PlaceholderService]],useFactory:function PLACEHOLDER_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new PlaceholderService}};let PlaceholderModule=class PlaceholderModule{};PlaceholderModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Placeholder],exports:[Placeholder],providers:[PLACEHOLDER_SERVICE_PROVIDER],imports:[common.CommonModule]})],PlaceholderModule)}}]);
|