@covalent/core 0.0.0-COVALENT
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/README.md +42 -0
- package/breadcrumbs/README.md +93 -0
- package/breadcrumbs/_breadcrumbs-theme.scss +10 -0
- package/breadcrumbs/breadcrumb/breadcrumb.component.d.ts +37 -0
- package/breadcrumbs/breadcrumbs.component.d.ts +37 -0
- package/breadcrumbs/breadcrumbs.module.d.ts +10 -0
- package/breadcrumbs/covalent-core-breadcrumbs.d.ts +5 -0
- package/breadcrumbs/package.json +10 -0
- package/breadcrumbs/public_api.d.ts +3 -0
- package/common/README.md +3 -0
- package/common/_common-theme.scss +35 -0
- package/common/animations/bounce/bounce.animation.d.ts +14 -0
- package/common/animations/collapse/collapse.animation.d.ts +20 -0
- package/common/animations/common/interfaces.d.ts +5 -0
- package/common/animations/fade/fadeInOut.animation.d.ts +20 -0
- package/common/animations/flash/flash.animation.d.ts +14 -0
- package/common/animations/headshake/headshake.animation.d.ts +14 -0
- package/common/animations/jello/jello.animation.d.ts +14 -0
- package/common/animations/pulse/pulse.animation.d.ts +14 -0
- package/common/animations/rotate/rotate.animation.d.ts +21 -0
- package/common/behaviors/control-value-accesor.mixin.d.ts +16 -0
- package/common/behaviors/disable-ripple.mixin.d.ts +9 -0
- package/common/behaviors/disabled.mixin.d.ts +9 -0
- package/common/common.module.d.ts +17 -0
- package/common/covalent-core-common.d.ts +5 -0
- package/common/directives/fullscreen/fullscreen.directive.d.ts +25 -0
- package/common/forms/auto-trim/auto-trim.directive.d.ts +12 -0
- package/common/forms/validators/validators.d.ts +8 -0
- package/common/functions/clipboard.d.ts +9 -0
- package/common/functions/convert.d.ts +31 -0
- package/common/functions/download.d.ts +48 -0
- package/common/functions/file.d.ts +7 -0
- package/common/package.json +10 -0
- package/common/pipes/bytes/bytes.pipe.d.ts +7 -0
- package/common/pipes/decimal-bytes/decimal-bytes.pipe.d.ts +7 -0
- package/common/pipes/digits/digits.pipe.d.ts +10 -0
- package/common/pipes/time-ago/time-ago.pipe.d.ts +7 -0
- package/common/pipes/time-difference/time-difference.pipe.d.ts +7 -0
- package/common/pipes/time-until/time-until.pipe.d.ts +7 -0
- package/common/pipes/truncate/truncate.pipe.d.ts +7 -0
- package/common/public_api.d.ts +35 -0
- package/common/services/icon.service.d.ts +8 -0
- package/common/services/router-path.service.d.ts +10 -0
- package/common/styles/_elevation.scss +285 -0
- package/common/styles/_layout.scss +605 -0
- package/common/styles/_palette-dark.scss +326 -0
- package/common/styles/_palette-light.scss +637 -0
- package/common/styles/_rtl.scss +31 -0
- package/common/styles/_styles.scss +10 -0
- package/common/styles/_theme-functions.scss +25 -0
- package/common/styles/_typography-functions.scss +43 -0
- package/common/styles/_variables.scss +99 -0
- package/common/styles/colors/_colors-dark.scss +1399 -0
- package/common/styles/colors/_colors-light.scss +3235 -0
- package/common/styles/colors/_colors.scss +7 -0
- package/common/styles/core/_button.scss +90 -0
- package/common/styles/core/_card.scss +189 -0
- package/common/styles/core/_content.scss +43 -0
- package/common/styles/core/_core.scss +23 -0
- package/common/styles/core/_divider.scss +16 -0
- package/common/styles/core/_icons.scss +22 -0
- package/common/styles/core/_list.scss +8 -0
- package/common/styles/core/_sidenav.scss +22 -0
- package/common/styles/core/_structure.scss +127 -0
- package/common/styles/core/_toolbar.scss +53 -0
- package/common/styles/core/_whiteframe.scss +138 -0
- package/common/styles/font/MaterialIcons-Regular-v48.woff2 +0 -0
- package/common/styles/font/README.md +11 -0
- package/common/styles/font/_font.scss +99 -0
- package/common/styles/utilities/_general.scss +65 -0
- package/common/styles/utilities/_pad.scss +36 -0
- package/common/styles/utilities/_pull.scss +36 -0
- package/common/styles/utilities/_push.scss +36 -0
- package/common/styles/utilities/_size.scss +24 -0
- package/common/styles/utilities/_text.scss +105 -0
- package/common/styles/utilities/_utilities.scss +15 -0
- package/covalent-core.d.ts +5 -0
- package/dialogs/README.md +223 -0
- package/dialogs/_dialog-theme.scss +39 -0
- package/dialogs/alert-dialog/alert-dialog.component.d.ts +12 -0
- package/dialogs/confirm-dialog/confirm-dialog.component.d.ts +15 -0
- package/dialogs/covalent-core-dialogs.d.ts +5 -0
- package/dialogs/dialog.component.d.ts +22 -0
- package/dialogs/dialogs.module.d.ts +19 -0
- package/dialogs/package.json +10 -0
- package/dialogs/prompt-dialog/prompt-dialog.component.d.ts +23 -0
- package/dialogs/public_api.d.ts +8 -0
- package/dialogs/resizable-draggable-dialog/resizable-draggable-dialog.d.ts +21 -0
- package/dialogs/services/dialog.service.d.ts +105 -0
- package/dialogs/src/README.md +223 -0
- package/dialogs/window-dialog/window-dialog.component.d.ts +16 -0
- package/dynamic-menu/README.md +152 -0
- package/dynamic-menu/_dynamic-menu-theme.scss +0 -0
- package/dynamic-menu/covalent-core-dynamic-menu.d.ts +5 -0
- package/dynamic-menu/dynamic-menu-item/dynamic-menu-item.component.d.ts +12 -0
- package/dynamic-menu/dynamic-menu-item/dynamic-menu-link/dynamic-menu-link.component.d.ts +10 -0
- package/dynamic-menu/dynamic-menu.component.d.ts +11 -0
- package/dynamic-menu/dynamic-menu.menu.d.ts +22 -0
- package/dynamic-menu/dynamic-menu.module.d.ts +15 -0
- package/dynamic-menu/package.json +10 -0
- package/dynamic-menu/public_api.d.ts +5 -0
- package/esm2020/breadcrumbs/breadcrumb/breadcrumb.component.mjs +92 -0
- package/esm2020/breadcrumbs/breadcrumbs.component.mjs +134 -0
- package/esm2020/breadcrumbs/breadcrumbs.module.mjs +20 -0
- package/esm2020/breadcrumbs/covalent-core-breadcrumbs.mjs +5 -0
- package/esm2020/breadcrumbs/public_api.mjs +4 -0
- package/esm2020/common/animations/bounce/bounce.animation.mjs +70 -0
- package/esm2020/common/animations/collapse/collapse.animation.mjs +51 -0
- package/esm2020/common/animations/common/interfaces.mjs +2 -0
- package/esm2020/common/animations/fade/fadeInOut.animation.mjs +37 -0
- package/esm2020/common/animations/flash/flash.animation.mjs +34 -0
- package/esm2020/common/animations/headshake/headshake.animation.mjs +47 -0
- package/esm2020/common/animations/jello/jello.animation.mjs +59 -0
- package/esm2020/common/animations/pulse/pulse.animation.mjs +32 -0
- package/esm2020/common/animations/rotate/rotate.animation.mjs +30 -0
- package/esm2020/common/behaviors/control-value-accesor.mixin.mjs +41 -0
- package/esm2020/common/behaviors/disable-ripple.mixin.mjs +24 -0
- package/esm2020/common/behaviors/disabled.mixin.mjs +24 -0
- package/esm2020/common/common.module.mjs +63 -0
- package/esm2020/common/covalent-core-common.mjs +5 -0
- package/esm2020/common/directives/fullscreen/fullscreen.directive.mjs +85 -0
- package/esm2020/common/forms/auto-trim/auto-trim.directive.mjs +36 -0
- package/esm2020/common/forms/validators/validators.mjs +29 -0
- package/esm2020/common/functions/clipboard.mjs +23 -0
- package/esm2020/common/functions/convert.mjs +84 -0
- package/esm2020/common/functions/download.mjs +75 -0
- package/esm2020/common/functions/file.mjs +16 -0
- package/esm2020/common/pipes/bytes/bytes.pipe.mjs +42 -0
- package/esm2020/common/pipes/decimal-bytes/decimal-bytes.pipe.mjs +42 -0
- package/esm2020/common/pipes/digits/digits.pipe.mjs +39 -0
- package/esm2020/common/pipes/time-ago/time-ago.pipe.mjs +72 -0
- package/esm2020/common/pipes/time-difference/time-difference.pipe.mjs +51 -0
- package/esm2020/common/pipes/time-until/time-until.pipe.mjs +72 -0
- package/esm2020/common/pipes/truncate/truncate.pipe.mjs +27 -0
- package/esm2020/common/public_api.mjs +39 -0
- package/esm2020/common/services/icon.service.mjs +1089 -0
- package/esm2020/common/services/router-path.service.mjs +29 -0
- package/esm2020/covalent-core.mjs +5 -0
- package/esm2020/dialogs/alert-dialog/alert-dialog.component.mjs +23 -0
- package/esm2020/dialogs/confirm-dialog/confirm-dialog.component.mjs +28 -0
- package/esm2020/dialogs/covalent-core-dialogs.mjs +5 -0
- package/esm2020/dialogs/dialog.component.mjs +56 -0
- package/esm2020/dialogs/dialogs.module.mjs +89 -0
- package/esm2020/dialogs/prompt-dialog/prompt-dialog.component.mjs +46 -0
- package/esm2020/dialogs/public_api.mjs +9 -0
- package/esm2020/dialogs/resizable-draggable-dialog/resizable-draggable-dialog.mjs +216 -0
- package/esm2020/dialogs/services/dialog.service.mjs +171 -0
- package/esm2020/dialogs/window-dialog/window-dialog.component.mjs +38 -0
- package/esm2020/dynamic-menu/covalent-core-dynamic-menu.mjs +5 -0
- package/esm2020/dynamic-menu/dynamic-menu-item/dynamic-menu-item.component.mjs +30 -0
- package/esm2020/dynamic-menu/dynamic-menu-item/dynamic-menu-link/dynamic-menu-link.component.mjs +24 -0
- package/esm2020/dynamic-menu/dynamic-menu.component.mjs +28 -0
- package/esm2020/dynamic-menu/dynamic-menu.menu.mjs +2 -0
- package/esm2020/dynamic-menu/dynamic-menu.module.mjs +57 -0
- package/esm2020/dynamic-menu/public_api.mjs +6 -0
- package/esm2020/file/covalent-core-file.mjs +5 -0
- package/esm2020/file/directives/file-drop.directive.mjs +147 -0
- package/esm2020/file/directives/file-select.directive.mjs +77 -0
- package/esm2020/file/file-input/file-input.component.mjs +110 -0
- package/esm2020/file/file-upload/file-upload.component.mjs +174 -0
- package/esm2020/file/file.module.mjs +58 -0
- package/esm2020/file/public_api.mjs +7 -0
- package/esm2020/file/services/file.service.mjs +64 -0
- package/esm2020/json-formatter/collapse.animation.mjs +51 -0
- package/esm2020/json-formatter/covalent-core-json-formatter.mjs +5 -0
- package/esm2020/json-formatter/json-formatter.component.mjs +217 -0
- package/esm2020/json-formatter/json-formatter.module.mjs +20 -0
- package/esm2020/json-formatter/public_api.mjs +3 -0
- package/esm2020/layout/covalent-core-layout.mjs +5 -0
- package/esm2020/layout/layout-card-over/layout-card-over.component.mjs +40 -0
- package/esm2020/layout/layout-footer/layout-footer.component.mjs +33 -0
- package/esm2020/layout/layout-manage-list/layout-manage-list.component.mjs +93 -0
- package/esm2020/layout/layout-manage-list/layout-manage-list.directives.mjs +84 -0
- package/esm2020/layout/layout-nav/layout-nav.component.mjs +50 -0
- package/esm2020/layout/layout-nav-list/layout-nav-list.component.mjs +128 -0
- package/esm2020/layout/layout-nav-list/layout-nav-list.directives.mjs +84 -0
- package/esm2020/layout/layout-toggle.class.mjs +92 -0
- package/esm2020/layout/layout.component.mjs +92 -0
- package/esm2020/layout/layout.directives.mjs +85 -0
- package/esm2020/layout/layout.module.mjs +117 -0
- package/esm2020/layout/navigation-drawer/navigation-drawer.component.mjs +161 -0
- package/esm2020/layout/public_api.mjs +13 -0
- package/esm2020/menu/covalent-core-menu.mjs +5 -0
- package/esm2020/menu/menu.component.mjs +12 -0
- package/esm2020/menu/menu.module.mjs +21 -0
- package/esm2020/menu/public_api.mjs +3 -0
- package/esm2020/message/collapse.animation.mjs +51 -0
- package/esm2020/message/covalent-core-message.mjs +5 -0
- package/esm2020/message/message.component.mjs +203 -0
- package/esm2020/message/message.module.mjs +25 -0
- package/esm2020/message/public_api.mjs +3 -0
- package/esm2020/public_api.mjs +2 -0
- package/esm2020/search/covalent-core-search.mjs +5 -0
- package/esm2020/search/public_api.mjs +4 -0
- package/esm2020/search/search-box/search-box.component.mjs +194 -0
- package/esm2020/search/search-input/search-input.component.mjs +203 -0
- package/esm2020/search/search.module.mjs +39 -0
- package/esm2020/side-sheet/covalent-core-side-sheet.mjs +5 -0
- package/esm2020/side-sheet/public_api.mjs +6 -0
- package/esm2020/side-sheet/side-sheet-container.mjs +274 -0
- package/esm2020/side-sheet/side-sheet-ref.mjs +21 -0
- package/esm2020/side-sheet/side-sheet.animation.mjs +12 -0
- package/esm2020/side-sheet/side-sheet.config.mjs +4 -0
- package/esm2020/side-sheet/side-sheet.content-directives.mjs +201 -0
- package/esm2020/side-sheet/side-sheet.mjs +221 -0
- package/esm2020/side-sheet/side-sheet.module.mjs +45 -0
- package/esm2020/user-profile/covalent-core-user-profile.mjs +5 -0
- package/esm2020/user-profile/public_api.mjs +4 -0
- package/esm2020/user-profile/user-profile-menu/user-profile-menu.component.mjs +24 -0
- package/esm2020/user-profile/user-profile.component.mjs +19 -0
- package/esm2020/user-profile/user-profile.module.mjs +44 -0
- package/fesm2015/covalent-core-breadcrumbs.mjs +246 -0
- package/fesm2015/covalent-core-breadcrumbs.mjs.map +1 -0
- package/fesm2015/covalent-core-common.mjs +2281 -0
- package/fesm2015/covalent-core-common.mjs.map +1 -0
- package/fesm2015/covalent-core-dialogs.mjs +639 -0
- package/fesm2015/covalent-core-dialogs.mjs.map +1 -0
- package/fesm2015/covalent-core-dynamic-menu.mjs +128 -0
- package/fesm2015/covalent-core-dynamic-menu.mjs.map +1 -0
- package/fesm2015/covalent-core-file.mjs +613 -0
- package/fesm2015/covalent-core-file.mjs.map +1 -0
- package/fesm2015/covalent-core-json-formatter.mjs +298 -0
- package/fesm2015/covalent-core-json-formatter.mjs.map +1 -0
- package/fesm2015/covalent-core-layout.mjs +1024 -0
- package/fesm2015/covalent-core-layout.mjs.map +1 -0
- package/fesm2015/covalent-core-menu.mjs +37 -0
- package/fesm2015/covalent-core-menu.mjs.map +1 -0
- package/fesm2015/covalent-core-message.mjs +284 -0
- package/fesm2015/covalent-core-message.mjs.map +1 -0
- package/fesm2015/covalent-core-search.mjs +428 -0
- package/fesm2015/covalent-core-search.mjs.map +1 -0
- package/fesm2015/covalent-core-side-sheet.mjs +762 -0
- package/fesm2015/covalent-core-side-sheet.mjs.map +1 -0
- package/fesm2015/covalent-core-user-profile.mjs +86 -0
- package/fesm2015/covalent-core-user-profile.mjs.map +1 -0
- package/fesm2015/covalent-core.mjs +4 -0
- package/fesm2015/covalent-core.mjs.map +1 -0
- package/fesm2020/covalent-core-breadcrumbs.mjs +246 -0
- package/fesm2020/covalent-core-breadcrumbs.mjs.map +1 -0
- package/fesm2020/covalent-core-common.mjs +2274 -0
- package/fesm2020/covalent-core-common.mjs.map +1 -0
- package/fesm2020/covalent-core-dialogs.mjs +634 -0
- package/fesm2020/covalent-core-dialogs.mjs.map +1 -0
- package/fesm2020/covalent-core-dynamic-menu.mjs +128 -0
- package/fesm2020/covalent-core-dynamic-menu.mjs.map +1 -0
- package/fesm2020/covalent-core-file.mjs +607 -0
- package/fesm2020/covalent-core-file.mjs.map +1 -0
- package/fesm2020/covalent-core-json-formatter.mjs +290 -0
- package/fesm2020/covalent-core-json-formatter.mjs.map +1 -0
- package/fesm2020/covalent-core-layout.mjs +1000 -0
- package/fesm2020/covalent-core-layout.mjs.map +1 -0
- package/fesm2020/covalent-core-menu.mjs +37 -0
- package/fesm2020/covalent-core-menu.mjs.map +1 -0
- package/fesm2020/covalent-core-message.mjs +282 -0
- package/fesm2020/covalent-core-message.mjs.map +1 -0
- package/fesm2020/covalent-core-search.mjs +425 -0
- package/fesm2020/covalent-core-search.mjs.map +1 -0
- package/fesm2020/covalent-core-side-sheet.mjs +757 -0
- package/fesm2020/covalent-core-side-sheet.mjs.map +1 -0
- package/fesm2020/covalent-core-user-profile.mjs +86 -0
- package/fesm2020/covalent-core-user-profile.mjs.map +1 -0
- package/fesm2020/covalent-core.mjs +4 -0
- package/fesm2020/covalent-core.mjs.map +1 -0
- package/file/_file-theme.scss +27 -0
- package/file/covalent-core-file.d.ts +5 -0
- package/file/directives/file-drop.directive.d.ts +61 -0
- package/file/directives/file-select.directive.d.ts +33 -0
- package/file/file-input/file-input.component.d.ts +61 -0
- package/file/file-upload/file-upload.component.d.ts +91 -0
- package/file/file.module.d.ts +15 -0
- package/file/package.json +10 -0
- package/file/public_api.d.ts +6 -0
- package/file/services/file.service.d.ts +34 -0
- package/file/src/file-input/README.md +147 -0
- package/file/src/file-upload/README.md +136 -0
- package/json-formatter/README.md +50 -0
- package/json-formatter/_json-formatter-theme.scss +72 -0
- package/json-formatter/collapse.animation.d.ts +24 -0
- package/json-formatter/covalent-core-json-formatter.d.ts +5 -0
- package/json-formatter/json-formatter.component.d.ts +78 -0
- package/json-formatter/json-formatter.module.d.ts +10 -0
- package/json-formatter/package.json +10 -0
- package/json-formatter/public_api.d.ts +2 -0
- package/layout/README.md +138 -0
- package/layout/_layout-theme.scss +128 -0
- package/layout/covalent-core-layout.d.ts +5 -0
- package/layout/layout-card-over/layout-card-over.component.d.ts +31 -0
- package/layout/layout-footer/layout-footer.component.d.ts +17 -0
- package/layout/layout-manage-list/layout-manage-list.component.d.ts +66 -0
- package/layout/layout-manage-list/layout-manage-list.directives.d.ts +25 -0
- package/layout/layout-nav/layout-nav.component.d.ts +45 -0
- package/layout/layout-nav-list/layout-nav-list.component.d.ts +104 -0
- package/layout/layout-nav-list/layout-nav-list.directives.d.ts +25 -0
- package/layout/layout-toggle.class.d.ts +40 -0
- package/layout/layout.component.d.ts +66 -0
- package/layout/layout.directives.d.ts +25 -0
- package/layout/layout.module.d.ts +25 -0
- package/layout/navigation-drawer/navigation-drawer.component.d.ts +120 -0
- package/layout/package.json +10 -0
- package/layout/public_api.d.ts +12 -0
- package/layout/src/layout-card-over/README.md +43 -0
- package/layout/src/layout-manage-list/README.md +80 -0
- package/layout/src/layout-nav/README.md +50 -0
- package/layout/src/layout-nav-list/README.md +105 -0
- package/menu/covalent-core-menu.d.ts +5 -0
- package/menu/menu.component.d.ts +5 -0
- package/menu/menu.module.d.ts +10 -0
- package/menu/package.json +10 -0
- package/menu/public_api.d.ts +2 -0
- package/message/README.md +67 -0
- package/message/_message-theme.scss +44 -0
- package/message/collapse.animation.d.ts +24 -0
- package/message/covalent-core-message.d.ts +5 -0
- package/message/message.component.d.ts +101 -0
- package/message/message.module.d.ts +9 -0
- package/message/package.json +10 -0
- package/message/public_api.d.ts +2 -0
- package/package.json +146 -0
- package/public_api.d.ts +1 -0
- package/search/README.md +132 -0
- package/search/covalent-core-search.d.ts +5 -0
- package/search/package.json +10 -0
- package/search/public_api.d.ts +3 -0
- package/search/search-box/search-box.component.d.ts +88 -0
- package/search/search-input/search-input.component.d.ts +82 -0
- package/search/search.module.d.ts +13 -0
- package/search/src/search-box/README.md +73 -0
- package/search/src/search-input/README.md +74 -0
- package/side-sheet/README.md +64 -0
- package/side-sheet/_side-sheet.theme.scss +8 -0
- package/side-sheet/covalent-core-side-sheet.d.ts +5 -0
- package/side-sheet/package.json +10 -0
- package/side-sheet/public_api.d.ts +5 -0
- package/side-sheet/side-sheet-container.d.ts +110 -0
- package/side-sheet/side-sheet-ref.d.ts +10 -0
- package/side-sheet/side-sheet.animation.d.ts +4 -0
- package/side-sheet/side-sheet.config.d.ts +3 -0
- package/side-sheet/side-sheet.content-directives.d.ts +67 -0
- package/side-sheet/side-sheet.d.ts +66 -0
- package/side-sheet/side-sheet.module.d.ts +11 -0
- package/theming/_all-theme.scss +24 -0
- package/typography/_all-typography.scss +39 -0
- package/user-profile/README.md +60 -0
- package/user-profile/_user-profile-theme.scss +27 -0
- package/user-profile/covalent-core-user-profile.d.ts +5 -0
- package/user-profile/package.json +10 -0
- package/user-profile/public_api.d.ts +3 -0
- package/user-profile/user-profile-menu/user-profile-menu.component.d.ts +8 -0
- package/user-profile/user-profile.component.d.ts +7 -0
- package/user-profile/user-profile.module.d.ts +14 -0
@@ -0,0 +1,223 @@
|
|
1
|
+
# TdDialogService
|
2
|
+
|
3
|
+
Service provided with methods that wrap the @angular/material [MatDialog] service and provide an easier experience for simple dialogs.
|
4
|
+
|
5
|
+
Note: if no [ViewContainerRef] is provided, [TdDialogService] will throw an error.
|
6
|
+
|
7
|
+
<br/>
|
8
|
+
|
9
|
+
## API Summary
|
10
|
+
|
11
|
+
#### Methods
|
12
|
+
|
13
|
+
- openAlert: function(IAlertConfig): MatDialogRef<TdAlertDialogComponent>
|
14
|
+
- Opens an alert dialog with the provided config.
|
15
|
+
- openConfirm: function(IConfirmConfig): MatDialogRef<TdConfirmDialogComponent>
|
16
|
+
- Opens a confirm dialog with the provided config.
|
17
|
+
- openPrompt: function(IPromptConfig): MatDialogRef<TdPromptDialogComponent>
|
18
|
+
- Opens a prompt dialog with the provided config.
|
19
|
+
- open: function<T>(component: ComponentType<T>, config: MatDialogConfig): MatDialogRef<T>
|
20
|
+
- Wrapper function over the open() method in MatDialog. Opens a modal dialog containing the given component.
|
21
|
+
- openDraggable: function<T>(IDraggableConfig<T>): MatDialogRef<T>
|
22
|
+
- Opens a draggable dialog containing the given component
|
23
|
+
- closeAll: function()
|
24
|
+
- Wrapper function over the closeAll() method in MatDialog. Closes all of the currently-open dialogs.
|
25
|
+
|
26
|
+
## Usage
|
27
|
+
|
28
|
+
TypeScript
|
29
|
+
|
30
|
+
```typescript
|
31
|
+
import { ViewContainerRef } from '@angular/core';
|
32
|
+
import { TdDialogService } from '@covalent/core/dialogs';
|
33
|
+
...
|
34
|
+
})
|
35
|
+
export class Demo {
|
36
|
+
constructor(private _dialogService: TdDialogService,
|
37
|
+
private _viewContainerRef: ViewContainerRef) {
|
38
|
+
...
|
39
|
+
}
|
40
|
+
|
41
|
+
openAlert(): void {
|
42
|
+
this._dialogService.openAlert({
|
43
|
+
message: 'This is how simple it is to create an alert with this wrapper service.',
|
44
|
+
disableClose: true | false, // defaults to false
|
45
|
+
viewContainerRef: this._viewContainerRef, //OPTIONAL
|
46
|
+
title: 'Alert', //OPTIONAL, hides if not provided
|
47
|
+
closeButton: 'Close', //OPTIONAL, defaults to 'CLOSE'
|
48
|
+
width: '400px', //OPTIONAL, defaults to 400px
|
49
|
+
});
|
50
|
+
}
|
51
|
+
|
52
|
+
openConfirm(): void {
|
53
|
+
this._dialogService.openConfirm({
|
54
|
+
message: 'This is how simple it is to create a confirm with this wrapper service. Do you agree?',
|
55
|
+
disableClose: true | false, // defaults to false
|
56
|
+
viewContainerRef: this._viewContainerRef, //OPTIONAL
|
57
|
+
title: 'Confirm', //OPTIONAL, hides if not provided
|
58
|
+
cancelButton: 'Disagree', //OPTIONAL, defaults to 'CANCEL'
|
59
|
+
acceptButton: 'Agree', //OPTIONAL, defaults to 'ACCEPT'
|
60
|
+
isDestructive: false, //OPTIONAL, defaults to false
|
61
|
+
width: '500px', //OPTIONAL, defaults to 400px
|
62
|
+
}).afterClosed().subscribe((accept: boolean) => {
|
63
|
+
if (accept) {
|
64
|
+
// DO SOMETHING
|
65
|
+
} else {
|
66
|
+
// DO SOMETHING ELSE
|
67
|
+
}
|
68
|
+
});
|
69
|
+
}
|
70
|
+
|
71
|
+
openPrompt(): void {
|
72
|
+
this._dialogService.openPrompt({
|
73
|
+
message: 'This is how simple it is to create a prompt with this wrapper service. Prompt something.',
|
74
|
+
disableClose: true | false, // defaults to false
|
75
|
+
viewContainerRef: this._viewContainerRef, //OPTIONAL
|
76
|
+
title: 'Prompt', //OPTIONAL, hides if not provided
|
77
|
+
value: 'Prepopulated value', //OPTIONAL
|
78
|
+
cancelButton: 'Cancel', //OPTIONAL, defaults to 'CANCEL'
|
79
|
+
acceptButton: 'Ok', //OPTIONAL, defaults to 'ACCEPT'
|
80
|
+
width: '400px', //OPTIONAL, defaults to 400px
|
81
|
+
}).afterClosed().subscribe((newValue: string) => {
|
82
|
+
if (newValue) {
|
83
|
+
// DO SOMETHING
|
84
|
+
} else {
|
85
|
+
// DO SOMETHING ELSE
|
86
|
+
}
|
87
|
+
});
|
88
|
+
}
|
89
|
+
|
90
|
+
openDraggable(): void {
|
91
|
+
this._dialogService.openDraggable({
|
92
|
+
component: DraggableDemoComponent,
|
93
|
+
config: { height: '300px' },
|
94
|
+
// CSS selectors of element(s) inside the component meant to be drag handle(s)
|
95
|
+
dragHandleSelectors: ['.drag-handle'],
|
96
|
+
// Class that will be added to the component signifying drag-ability
|
97
|
+
draggableClass: 'custom-class',
|
98
|
+
});
|
99
|
+
}
|
100
|
+
}
|
101
|
+
```
|
102
|
+
|
103
|
+
```typescript
|
104
|
+
import { Component } from '@angular/core';
|
105
|
+
|
106
|
+
@Component({
|
107
|
+
selector: 'app-draggable-demo',
|
108
|
+
template: `
|
109
|
+
<h2>Draggable dialog</h2>
|
110
|
+
<p>Draggable via the drag handle</p>
|
111
|
+
<button mat-icon-button class="drag-handle">
|
112
|
+
<mat-icon>drag_handle</mat-icon>
|
113
|
+
</button>
|
114
|
+
`,
|
115
|
+
})
|
116
|
+
export class DraggableDemoComponent {}
|
117
|
+
```
|
118
|
+
|
119
|
+
## Setup
|
120
|
+
|
121
|
+
Import the [CovalentDialogsModule] in your NgModule:
|
122
|
+
|
123
|
+
```typescript
|
124
|
+
import { CovalentDialogsModule } from '@covalent/core/dialogs';
|
125
|
+
|
126
|
+
@NgModule({
|
127
|
+
imports: [
|
128
|
+
CovalentDialogsModule,
|
129
|
+
...
|
130
|
+
],
|
131
|
+
...
|
132
|
+
})
|
133
|
+
export class MyModule {}
|
134
|
+
```
|
135
|
+
|
136
|
+
After that, just inject [TdDialogService] and use it for your dialogs.
|
137
|
+
|
138
|
+
# ResizableDraggableDialog
|
139
|
+
|
140
|
+
A utility to make a draggable dialog resizable.
|
141
|
+
|
142
|
+
## Usage
|
143
|
+
|
144
|
+
```ts
|
145
|
+
constructor(
|
146
|
+
private _dialogService: TdDialogService,
|
147
|
+
@Inject(DOCUMENT) private _document: any,
|
148
|
+
private _renderer2: Renderer2,
|
149
|
+
) {}
|
150
|
+
```
|
151
|
+
|
152
|
+
```ts
|
153
|
+
const {
|
154
|
+
matDialogRef,
|
155
|
+
dragRefSubject,
|
156
|
+
}: IDraggableRefs<DraggableResizableDialogComponent> = this._dialogService.openDraggable(
|
157
|
+
{
|
158
|
+
component: DraggableResizableDialogComponent,
|
159
|
+
// CSS selectors of element(s) inside the component meant to be drag handle(s)
|
160
|
+
dragHandleSelectors: ['.drag-handle'],
|
161
|
+
}
|
162
|
+
);
|
163
|
+
|
164
|
+
let resizableDraggableDialog: ResizableDraggableDialog;
|
165
|
+
dragRefSubject.subscribe((dragRf: DragRef) => {
|
166
|
+
resizableDraggableDialog = new ResizableDraggableDialog(
|
167
|
+
this._document,
|
168
|
+
this._renderer2,
|
169
|
+
matDialogRef,
|
170
|
+
dragRf
|
171
|
+
);
|
172
|
+
});
|
173
|
+
|
174
|
+
// Detach resize-ability event listeners after dialog closes
|
175
|
+
matDialogRef.afterClosed().subscribe(() => resizableDraggableDialog.detach());
|
176
|
+
```
|
177
|
+
|
178
|
+
# TdWindowDialogComponent
|
179
|
+
|
180
|
+
A component that can be utilized to create a dialog with a toolbar
|
181
|
+
|
182
|
+
## API Summary
|
183
|
+
|
184
|
+
#### Inputs
|
185
|
+
|
186
|
+
- title: string
|
187
|
+
- Title that appears in toolbar
|
188
|
+
- closeLabel: string
|
189
|
+
- Label to be used on close button
|
190
|
+
- toolbarColor: ThemePalette
|
191
|
+
- Toolbar color
|
192
|
+
|
193
|
+
#### Outputs
|
194
|
+
|
195
|
+
- closed: string
|
196
|
+
- Emitted when close button is clicked
|
197
|
+
|
198
|
+
## Usage
|
199
|
+
|
200
|
+
```ts
|
201
|
+
@Component({
|
202
|
+
template: `
|
203
|
+
<td-window-dialog
|
204
|
+
[title]="'Title'"
|
205
|
+
[toolbarColor]="'accent'"
|
206
|
+
[closeLabel]="'Close'"
|
207
|
+
(closed)="closed.emit()"
|
208
|
+
>
|
209
|
+
<p>Comes with a handy toolbar</p>
|
210
|
+
</td-window-dialog>
|
211
|
+
`,
|
212
|
+
})
|
213
|
+
export class DraggableResizableWindowDialogComponent {
|
214
|
+
@Output() closed: EventEmitter<void> = new EventEmitter();
|
215
|
+
}
|
216
|
+
```
|
217
|
+
|
218
|
+
```ts
|
219
|
+
const matDialogRef: MatDialogRef<DraggableResizableWindowDialogComponent> =
|
220
|
+
this._dialogService.open(DraggableResizableWindowDialogComponent);
|
221
|
+
// listen to close event
|
222
|
+
matDialogRef.componentInstance.closed.subscribe(() => matDialogRef.close());
|
223
|
+
```
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
2
|
+
import { ThemePalette } from '@angular/material/core';
|
3
|
+
import * as i0 from "@angular/core";
|
4
|
+
export declare class TdWindowDialogComponent {
|
5
|
+
toolbarColor?: ThemePalette;
|
6
|
+
docked?: boolean | undefined;
|
7
|
+
title?: string;
|
8
|
+
toggleDockedStateLabel?: string;
|
9
|
+
closeLabel?: string;
|
10
|
+
dockToggled: EventEmitter<boolean>;
|
11
|
+
closed: EventEmitter<void>;
|
12
|
+
toolbarHeight: number;
|
13
|
+
toggleDockedState(): void;
|
14
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TdWindowDialogComponent, never>;
|
15
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TdWindowDialogComponent, "td-window-dialog", never, { "toolbarColor": "toolbarColor"; "docked": "docked"; "title": "title"; "toggleDockedStateLabel": "toggleDockedStateLabel"; "closeLabel": "closeLabel"; }, { "dockToggled": "dockToggled"; "closed": "closed"; }, never, ["*"]>;
|
16
|
+
}
|
@@ -0,0 +1,152 @@
|
|
1
|
+
# td-dynamic-menu
|
2
|
+
|
3
|
+
`td-dynamic-menu` element supports the creation of n-level deep cascading menus with
|
4
|
+
group labels and URL/action links and actions using a JSON object.
|
5
|
+
|
6
|
+
## API Summary
|
7
|
+
|
8
|
+
#### Model
|
9
|
+
|
10
|
+
```typescript
|
11
|
+
// Trigger button launches top level menu. Must specify text and/or icon.
|
12
|
+
export interface IMenuTrigger {
|
13
|
+
id?: string; // Optional identifier
|
14
|
+
text?: string; // Text to display on button
|
15
|
+
icon?: string; // Optional icon
|
16
|
+
svgIcon?: string; // Optional svgIcon
|
17
|
+
iconClasses?: string[]; // Optional styling classes
|
18
|
+
}
|
19
|
+
|
20
|
+
// Menu items can serve one of four roles:
|
21
|
+
// - Submenu trigger (has children property)
|
22
|
+
// - URL link (has link property)
|
23
|
+
// - Action link (has action property)
|
24
|
+
// - Grouping label (has neither children, link or action properties)
|
25
|
+
export interface IMenuItem {
|
26
|
+
id?: string; // Optional identifier
|
27
|
+
text: string; // Display text
|
28
|
+
icon?: string; // Optional icon
|
29
|
+
svgIcon?: string; // Optional svgIcon
|
30
|
+
iconClasses?: string[]; // Optional styling classes
|
31
|
+
// If children provided, item is a submenu trigger
|
32
|
+
// Represents the contents of the submenu
|
33
|
+
children?: IMenuItem[];
|
34
|
+
// If link provided, item is a URL link
|
35
|
+
link?: string; // href (relative or fully qualified).
|
36
|
+
newTab?: boolean; // Indicates where URL should be displayed, current or new browser tab
|
37
|
+
// If action provided, item is an action link
|
38
|
+
// A click on this item will emit itemClicked event
|
39
|
+
action?: string;
|
40
|
+
}
|
41
|
+
|
42
|
+
// Click action event payload derived from IMenuItem
|
43
|
+
export interface ITdDynamicMenuLinkClickEvent {
|
44
|
+
text: string;
|
45
|
+
action: string;
|
46
|
+
}
|
47
|
+
```
|
48
|
+
|
49
|
+
#### Inputs
|
50
|
+
|
51
|
+
- trigger: IMenuTrigger
|
52
|
+
- Definition for trigger button.
|
53
|
+
- items: IMenuItem[]
|
54
|
+
- One or more items to be displayed in menu.
|
55
|
+
|
56
|
+
#### Output
|
57
|
+
|
58
|
+
- itemClicked: ITdDynamicMenuLinkClickEvent
|
59
|
+
- Emitted when an action link is pressed.
|
60
|
+
|
61
|
+
## Setup
|
62
|
+
|
63
|
+
Import the **[CovalentDynamicMenuModule]** in your NgModule:
|
64
|
+
|
65
|
+
```typescript
|
66
|
+
import { CovalentDynamicMenuModule } from '@covalent/core/dynamic-menu';
|
67
|
+
@NgModule({
|
68
|
+
imports: [
|
69
|
+
CovalentDynamicMenuModule,
|
70
|
+
...
|
71
|
+
],
|
72
|
+
...
|
73
|
+
})
|
74
|
+
export class MyModule {}
|
75
|
+
```
|
76
|
+
|
77
|
+
## Usage
|
78
|
+
|
79
|
+
Basic Example:
|
80
|
+
|
81
|
+
```typescript
|
82
|
+
trigger: IMenuTrigger = {
|
83
|
+
id: 'triggerbutton',
|
84
|
+
icon: 'list',
|
85
|
+
text: 'Trigger With Text And Icon',
|
86
|
+
};
|
87
|
+
|
88
|
+
items: IMenuItem[] = [
|
89
|
+
{ // Grouping label
|
90
|
+
id: 'platform',
|
91
|
+
text: 'Platform',
|
92
|
+
},
|
93
|
+
{ // Submenu trigger
|
94
|
+
id: 'covalentlinkstrigger',
|
95
|
+
text: 'Covalent Links',
|
96
|
+
svgIcon: 'assets:covalent',
|
97
|
+
children: [
|
98
|
+
{ // URL link
|
99
|
+
id: 'quickstartlink',
|
100
|
+
text: 'Quickstart',
|
101
|
+
icon: 'flash_on',
|
102
|
+
link: 'https://github.com/Teradata/covalent-quickstart',
|
103
|
+
newTab: true,
|
104
|
+
},
|
105
|
+
{ // URL link
|
106
|
+
id: 'electronlink',
|
107
|
+
text: 'Electron App',
|
108
|
+
icon: 'laptop_mac',
|
109
|
+
link: 'https://github.com/Teradata/covalent-electron',
|
110
|
+
newTab: true,
|
111
|
+
},
|
112
|
+
{ // URL link
|
113
|
+
id: 'datalink',
|
114
|
+
text: 'Covalent Data',
|
115
|
+
icon: 'aspect_ratio',
|
116
|
+
link: 'https://github.com/Teradata/covalent-data',
|
117
|
+
newTab: true,
|
118
|
+
},
|
119
|
+
],
|
120
|
+
},
|
121
|
+
{ // Grouping label
|
122
|
+
id: 'framework',
|
123
|
+
text: 'Framework',
|
124
|
+
},
|
125
|
+
{ // Submenu trigger
|
126
|
+
id: 'angularlink',
|
127
|
+
text: 'Angular Link',
|
128
|
+
svgIcon: 'assets:angular',
|
129
|
+
children: [
|
130
|
+
{ // URL link
|
131
|
+
text: 'Angular Homepage',
|
132
|
+
link: 'https://angular.io/',
|
133
|
+
newTab: true,
|
134
|
+
},
|
135
|
+
],
|
136
|
+
},
|
137
|
+
{ // Grouping label
|
138
|
+
id: 'actions',
|
139
|
+
text: 'Actions',
|
140
|
+
},
|
141
|
+
{ // Action link
|
142
|
+
id: 'actionlink',
|
143
|
+
text: 'Do Action',
|
144
|
+
icon: 'directions_run',
|
145
|
+
action: 'Go Run',
|
146
|
+
},
|
147
|
+
];
|
148
|
+
```
|
149
|
+
|
150
|
+
```html
|
151
|
+
<td-dynamic-menu [trigger]="trigger" [items]="items"></td-dynamic-menu>
|
152
|
+
```
|
File without changes
|
@@ -0,0 +1,12 @@
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
2
|
+
import { MatMenu } from '@angular/material/menu';
|
3
|
+
import { IMenuItem, ITdDynamicMenuLinkClickEvent } from '../dynamic-menu.menu';
|
4
|
+
import * as i0 from "@angular/core";
|
5
|
+
export declare class TdDynamicMenuItemComponent {
|
6
|
+
items: IMenuItem[];
|
7
|
+
itemClicked: EventEmitter<ITdDynamicMenuLinkClickEvent>;
|
8
|
+
childMenu: MatMenu;
|
9
|
+
emitClicked(event: ITdDynamicMenuLinkClickEvent): void;
|
10
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TdDynamicMenuItemComponent, never>;
|
11
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TdDynamicMenuItemComponent, "td-dynamic-menu-item", never, { "items": "items"; }, { "itemClicked": "itemClicked"; }, never, never>;
|
12
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
2
|
+
import { IMenuItem, ITdDynamicMenuLinkClickEvent } from '../../dynamic-menu.menu';
|
3
|
+
import * as i0 from "@angular/core";
|
4
|
+
export declare class TdDynamicMenuLinkComponent {
|
5
|
+
item: IMenuItem;
|
6
|
+
itemClicked: EventEmitter<ITdDynamicMenuLinkClickEvent>;
|
7
|
+
emitClicked(): void;
|
8
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TdDynamicMenuLinkComponent, never>;
|
9
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TdDynamicMenuLinkComponent, "td-dynamic-menu-link", never, { "item": "item"; }, { "itemClicked": "itemClicked"; }, never, never>;
|
10
|
+
}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
2
|
+
import { IMenuItem, IMenuTrigger, ITdDynamicMenuLinkClickEvent } from './dynamic-menu.menu';
|
3
|
+
import * as i0 from "@angular/core";
|
4
|
+
export declare class TdDynamicMenuComponent {
|
5
|
+
trigger: IMenuTrigger;
|
6
|
+
items: IMenuItem[];
|
7
|
+
itemClicked: EventEmitter<ITdDynamicMenuLinkClickEvent>;
|
8
|
+
emitClicked(event: ITdDynamicMenuLinkClickEvent): void;
|
9
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TdDynamicMenuComponent, never>;
|
10
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TdDynamicMenuComponent, "td-dynamic-menu", never, { "trigger": "trigger"; "items": "items"; }, { "itemClicked": "itemClicked"; }, never, never>;
|
11
|
+
}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
export interface IMenuTrigger {
|
2
|
+
id?: string;
|
3
|
+
text?: string;
|
4
|
+
icon?: string;
|
5
|
+
svgIcon?: string;
|
6
|
+
iconClasses?: string[];
|
7
|
+
}
|
8
|
+
export interface IMenuItem {
|
9
|
+
id?: string;
|
10
|
+
text: string;
|
11
|
+
icon?: string;
|
12
|
+
svgIcon?: string;
|
13
|
+
iconClasses?: string[];
|
14
|
+
children?: IMenuItem[];
|
15
|
+
link?: string;
|
16
|
+
newTab?: boolean;
|
17
|
+
action?: string;
|
18
|
+
}
|
19
|
+
export interface ITdDynamicMenuLinkClickEvent {
|
20
|
+
text: string;
|
21
|
+
action?: string;
|
22
|
+
}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
import * as i1 from "./dynamic-menu.component";
|
3
|
+
import * as i2 from "./dynamic-menu-item/dynamic-menu-item.component";
|
4
|
+
import * as i3 from "./dynamic-menu-item/dynamic-menu-link/dynamic-menu-link.component";
|
5
|
+
import * as i4 from "@angular/common";
|
6
|
+
import * as i5 from "@angular/material/button";
|
7
|
+
import * as i6 from "@angular/material/icon";
|
8
|
+
import * as i7 from "@angular/material/list";
|
9
|
+
import * as i8 from "@angular/material/menu";
|
10
|
+
import * as i9 from "@angular/material/tooltip";
|
11
|
+
export declare class CovalentDynamicMenuModule {
|
12
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CovalentDynamicMenuModule, never>;
|
13
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<CovalentDynamicMenuModule, [typeof i1.TdDynamicMenuComponent, typeof i2.TdDynamicMenuItemComponent, typeof i3.TdDynamicMenuLinkComponent], [typeof i4.CommonModule, typeof i5.MatButtonModule, typeof i6.MatIconModule, typeof i7.MatListModule, typeof i8.MatMenuModule, typeof i9.MatTooltipModule], [typeof i1.TdDynamicMenuComponent, typeof i2.TdDynamicMenuItemComponent, typeof i3.TdDynamicMenuLinkComponent]>;
|
14
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<CovalentDynamicMenuModule>;
|
15
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
{
|
2
|
+
"module": "../fesm2015/covalent-core-dynamic-menu.mjs",
|
3
|
+
"es2020": "../fesm2020/covalent-core-dynamic-menu.mjs",
|
4
|
+
"esm2020": "../esm2020/dynamic-menu/covalent-core-dynamic-menu.mjs",
|
5
|
+
"fesm2020": "../fesm2020/covalent-core-dynamic-menu.mjs",
|
6
|
+
"fesm2015": "../fesm2015/covalent-core-dynamic-menu.mjs",
|
7
|
+
"typings": "covalent-core-dynamic-menu.d.ts",
|
8
|
+
"sideEffects": false,
|
9
|
+
"name": "@covalent/core/dynamic-menu"
|
10
|
+
}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
export * from './dynamic-menu.module';
|
2
|
+
export * from './dynamic-menu.menu';
|
3
|
+
export * from './dynamic-menu.component';
|
4
|
+
export * from './dynamic-menu-item/dynamic-menu-item.component';
|
5
|
+
export * from './dynamic-menu-item/dynamic-menu-link/dynamic-menu-link.component';
|
@@ -0,0 +1,92 @@
|
|
1
|
+
import { Component, ElementRef, HostBinding, ChangeDetectionStrategy, ChangeDetectorRef, } from '@angular/core';
|
2
|
+
import * as i0 from "@angular/core";
|
3
|
+
import * as i1 from "@angular/material/icon";
|
4
|
+
import * as i2 from "@angular/common";
|
5
|
+
export class TdBreadcrumbComponent {
|
6
|
+
constructor(_elementRef, _changeDetectorRef) {
|
7
|
+
this._elementRef = _elementRef;
|
8
|
+
this._changeDetectorRef = _changeDetectorRef;
|
9
|
+
this._displayCrumb = true;
|
10
|
+
this._width = 0;
|
11
|
+
this._displayIcon = true;
|
12
|
+
this._separatorIcon = 'chevron_right';
|
13
|
+
this.matButtonClass = true;
|
14
|
+
this.tdBreadCrumbClass = true;
|
15
|
+
}
|
16
|
+
// Sets the icon url shown between breadcrumbs. Defaults to 'chevron_right'
|
17
|
+
get separatorIcon() {
|
18
|
+
return this._separatorIcon;
|
19
|
+
}
|
20
|
+
set separatorIcon(separatorIcon) {
|
21
|
+
this._separatorIcon = separatorIcon;
|
22
|
+
setTimeout(() => {
|
23
|
+
this._changeDetectorRef.markForCheck();
|
24
|
+
});
|
25
|
+
}
|
26
|
+
// Should show the right chevron or not before the label
|
27
|
+
get displayIcon() {
|
28
|
+
return this._displayIcon;
|
29
|
+
}
|
30
|
+
set displayIcon(displayIcon) {
|
31
|
+
this._displayIcon = displayIcon;
|
32
|
+
setTimeout(() => {
|
33
|
+
this._changeDetectorRef.markForCheck();
|
34
|
+
});
|
35
|
+
}
|
36
|
+
get displayCrumb() {
|
37
|
+
return this._displayCrumb;
|
38
|
+
}
|
39
|
+
/**
|
40
|
+
* Whether to display the crumb or not
|
41
|
+
*/
|
42
|
+
set displayCrumb(shouldDisplay) {
|
43
|
+
this._displayCrumb = shouldDisplay;
|
44
|
+
setTimeout(() => {
|
45
|
+
this._changeDetectorRef.markForCheck();
|
46
|
+
});
|
47
|
+
}
|
48
|
+
/**
|
49
|
+
* Width of the DOM element of the crumb
|
50
|
+
*/
|
51
|
+
get width() {
|
52
|
+
return this._width;
|
53
|
+
}
|
54
|
+
/**
|
55
|
+
* Gets the display style of the crumb
|
56
|
+
*/
|
57
|
+
get displayBinding() {
|
58
|
+
// Set the display to none on the component, just in case the end user is hiding
|
59
|
+
// and showing them instead of the component doing itself for reasons like responsive
|
60
|
+
return this._displayCrumb ? undefined : 'none';
|
61
|
+
}
|
62
|
+
ngAfterViewInit() {
|
63
|
+
// set the width from the actual rendered DOM element
|
64
|
+
setTimeout(() => {
|
65
|
+
this._width = (this._elementRef.nativeElement).getBoundingClientRect().width;
|
66
|
+
this._changeDetectorRef.markForCheck();
|
67
|
+
});
|
68
|
+
}
|
69
|
+
/**
|
70
|
+
* Stop click propagation when clicking on icon
|
71
|
+
*/
|
72
|
+
_handleIconClick(event) {
|
73
|
+
event.stopPropagation();
|
74
|
+
event.preventDefault();
|
75
|
+
}
|
76
|
+
}
|
77
|
+
TdBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TdBreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
78
|
+
TdBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: TdBreadcrumbComponent, selector: "td-breadcrumb, a[td-breadcrumb]", host: { properties: { "class.mat-button": "this.matButtonClass", "class.td-breadcrumb": "this.tdBreadCrumbClass", "style.display": "this.displayBinding" } }, ngImport: i0, template: "<ng-content></ng-content>\n<mat-icon\n *ngIf=\"displayIcon\"\n class=\"td-breadcrumb-separator-icon\"\n [style.cursor]=\"'default'\"\n (click)=\"_handleIconClick($event)\"\n>\n {{ separatorIcon }}\n</mat-icon>\n", styles: [":host.td-breadcrumb{display:inline-block;box-sizing:border-box;flex-direction:row;align-items:center;align-content:center;max-width:100%;justify-content:flex-end}:host.td-breadcrumb ::ng-deep>*{margin:0 10px}:host .td-breadcrumb-separator-icon{display:inline-flex;vertical-align:middle}:host.mat-button{min-width:0;padding:0}\n"], components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TdBreadcrumbComponent, decorators: [{
|
80
|
+
type: Component,
|
81
|
+
args: [{ selector: 'td-breadcrumb, a[td-breadcrumb]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n<mat-icon\n *ngIf=\"displayIcon\"\n class=\"td-breadcrumb-separator-icon\"\n [style.cursor]=\"'default'\"\n (click)=\"_handleIconClick($event)\"\n>\n {{ separatorIcon }}\n</mat-icon>\n", styles: [":host.td-breadcrumb{display:inline-block;box-sizing:border-box;flex-direction:row;align-items:center;align-content:center;max-width:100%;justify-content:flex-end}:host.td-breadcrumb ::ng-deep>*{margin:0 10px}:host .td-breadcrumb-separator-icon{display:inline-flex;vertical-align:middle}:host.mat-button{min-width:0;padding:0}\n"] }]
|
82
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { matButtonClass: [{
|
83
|
+
type: HostBinding,
|
84
|
+
args: ['class.mat-button']
|
85
|
+
}], tdBreadCrumbClass: [{
|
86
|
+
type: HostBinding,
|
87
|
+
args: ['class.td-breadcrumb']
|
88
|
+
}], displayBinding: [{
|
89
|
+
type: HostBinding,
|
90
|
+
args: ['style.display']
|
91
|
+
}] } });
|
92
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnJlYWRjcnVtYi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FuZ3VsYXIvYnJlYWRjcnVtYnMvc3JjL2JyZWFkY3J1bWIvYnJlYWRjcnVtYi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FuZ3VsYXIvYnJlYWRjcnVtYnMvc3JjL2JyZWFkY3J1bWIvYnJlYWRjcnVtYi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULFVBQVUsRUFDVixXQUFXLEVBRVgsdUJBQXVCLEVBQ3ZCLGlCQUFpQixHQUNsQixNQUFNLGVBQWUsQ0FBQzs7OztBQVF2QixNQUFNLE9BQU8scUJBQXFCO0lBOERoQyxZQUNVLFdBQXVCLEVBQ3ZCLGtCQUFxQztRQURyQyxnQkFBVyxHQUFYLFdBQVcsQ0FBWTtRQUN2Qix1QkFBa0IsR0FBbEIsa0JBQWtCLENBQW1CO1FBL0R2QyxrQkFBYSxHQUFHLElBQUksQ0FBQztRQUNyQixXQUFNLEdBQUcsQ0FBQyxDQUFDO1FBQ1gsaUJBQVksR0FBRyxJQUFJLENBQUM7UUFDcEIsbUJBQWMsR0FBRyxlQUFlLENBQUM7UUFFUixtQkFBYyxHQUFHLElBQUksQ0FBQztRQUNuQixzQkFBaUIsR0FBRyxJQUFJLENBQUM7SUEwRDFELENBQUM7SUF4REosMkVBQTJFO0lBQzNFLElBQVcsYUFBYTtRQUN0QixPQUFPLElBQUksQ0FBQyxjQUFjLENBQUM7SUFDN0IsQ0FBQztJQUNELElBQVcsYUFBYSxDQUFDLGFBQXFCO1FBQzVDLElBQUksQ0FBQyxjQUFjLEdBQUcsYUFBYSxDQUFDO1FBQ3BDLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLENBQUMsa0JBQWtCLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDekMsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsd0RBQXdEO0lBQ3hELElBQVcsV0FBVztRQUNwQixPQUFPLElBQUksQ0FBQyxZQUFZLENBQUM7SUFDM0IsQ0FBQztJQUNELElBQVcsV0FBVyxDQUFDLFdBQW9CO1FBQ3pDLElBQUksQ0FBQyxZQUFZLEdBQUcsV0FBVyxDQUFDO1FBQ2hDLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLENBQUMsa0JBQWtCLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDekMsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsSUFBSSxZQUFZO1FBQ2QsT0FBTyxJQUFJLENBQUMsYUFBYSxDQUFDO0lBQzVCLENBQUM7SUFFRDs7T0FFRztJQUNILElBQUksWUFBWSxDQUFDLGFBQXNCO1FBQ3JDLElBQUksQ0FBQyxhQUFhLEdBQUcsYUFBYSxDQUFDO1FBQ25DLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLENBQUMsa0JBQWtCLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDekMsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQ7O09BRUc7SUFDSCxJQUFJLEtBQUs7UUFDUCxPQUFPLElBQUksQ0FBQyxNQUFNLENBQUM7SUFDckIsQ0FBQztJQUVEOztPQUVHO0lBQ0gsSUFDSSxjQUFjO1FBQ2hCLGdGQUFnRjtRQUNoRixxRkFBcUY7UUFDckYsT0FBTyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQztJQUNqRCxDQUFDO0lBT0QsZUFBZTtRQUNiLHFEQUFxRDtRQUNyRCxVQUFVLENBQUMsR0FBRyxFQUFFO1lBQ2QsSUFBSSxDQUFDLE1BQU0sR0FBaUIsQ0FDMUIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxhQUFhLENBQzlCLENBQUMscUJBQXFCLEVBQUUsQ0FBQyxLQUFLLENBQUM7WUFDakMsSUFBSSxDQUFDLGtCQUFrQixDQUFDLFlBQVksRUFBRSxDQUFDO1FBQ3pDLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVEOztPQUVHO0lBQ0gsZ0JBQWdCLENBQUMsS0FBWTtRQUMzQixLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDeEIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ3pCLENBQUM7O2tIQW5GVSxxQkFBcUI7c0dBQXJCLHFCQUFxQixxT0NmbEMsME5BU0E7MkZETWEscUJBQXFCO2tCQU5qQyxTQUFTOytCQUNFLGlDQUFpQyxtQkFHMUIsdUJBQXVCLENBQUMsTUFBTTtpSUFRZCxjQUFjO3NCQUE5QyxXQUFXO3VCQUFDLGtCQUFrQjtnQkFDSyxpQkFBaUI7c0JBQXBELFdBQVc7dUJBQUMscUJBQXFCO2dCQWlEOUIsY0FBYztzQkFEakIsV0FBVzt1QkFBQyxlQUFlIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBFbGVtZW50UmVmLFxuICBIb3N0QmluZGluZyxcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAndGQtYnJlYWRjcnVtYiwgYVt0ZC1icmVhZGNydW1iXScsXG4gIHN0eWxlVXJsczogWycuL2JyZWFkY3J1bWIuY29tcG9uZW50LnNjc3MnXSxcbiAgdGVtcGxhdGVVcmw6ICcuL2JyZWFkY3J1bWIuY29tcG9uZW50Lmh0bWwnLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgVGRCcmVhZGNydW1iQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XG4gIHByaXZhdGUgX2Rpc3BsYXlDcnVtYiA9IHRydWU7XG4gIHByaXZhdGUgX3dpZHRoID0gMDtcbiAgcHJpdmF0ZSBfZGlzcGxheUljb24gPSB0cnVlO1xuICBwcml2YXRlIF9zZXBhcmF0b3JJY29uID0gJ2NoZXZyb25fcmlnaHQnO1xuXG4gIEBIb3N0QmluZGluZygnY2xhc3MubWF0LWJ1dHRvbicpIG1hdEJ1dHRvbkNsYXNzID0gdHJ1ZTtcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy50ZC1icmVhZGNydW1iJykgdGRCcmVhZENydW1iQ2xhc3MgPSB0cnVlO1xuXG4gIC8vIFNldHMgdGhlIGljb24gdXJsIHNob3duIGJldHdlZW4gYnJlYWRjcnVtYnMuIERlZmF1bHRzIHRvICdjaGV2cm9uX3JpZ2h0J1xuICBwdWJsaWMgZ2V0IHNlcGFyYXRvckljb24oKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5fc2VwYXJhdG9ySWNvbjtcbiAgfVxuICBwdWJsaWMgc2V0IHNlcGFyYXRvckljb24oc2VwYXJhdG9ySWNvbjogc3RyaW5nKSB7XG4gICAgdGhpcy5fc2VwYXJhdG9ySWNvbiA9IHNlcGFyYXRvckljb247XG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICB0aGlzLl9jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICB9KTtcbiAgfVxuXG4gIC8vIFNob3VsZCBzaG93IHRoZSByaWdodCBjaGV2cm9uIG9yIG5vdCBiZWZvcmUgdGhlIGxhYmVsXG4gIHB1YmxpYyBnZXQgZGlzcGxheUljb24oKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuX2Rpc3BsYXlJY29uO1xuICB9XG4gIHB1YmxpYyBzZXQgZGlzcGxheUljb24oZGlzcGxheUljb246IGJvb2xlYW4pIHtcbiAgICB0aGlzLl9kaXNwbGF5SWNvbiA9IGRpc3BsYXlJY29uO1xuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgdGhpcy5fY2hhbmdlRGV0ZWN0b3JSZWYubWFya0ZvckNoZWNrKCk7XG4gICAgfSk7XG4gIH1cblxuICBnZXQgZGlzcGxheUNydW1iKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLl9kaXNwbGF5Q3J1bWI7XG4gIH1cblxuICAvKipcbiAgICogV2hldGhlciB0byBkaXNwbGF5IHRoZSBjcnVtYiBvciBub3RcbiAgICovXG4gIHNldCBkaXNwbGF5Q3J1bWIoc2hvdWxkRGlzcGxheTogYm9vbGVhbikge1xuICAgIHRoaXMuX2Rpc3BsYXlDcnVtYiA9IHNob3VsZERpc3BsYXk7XG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICB0aGlzLl9jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICB9KTtcbiAgfVxuXG4gIC8qKlxuICAgKiBXaWR0aCBvZiB0aGUgRE9NIGVsZW1lbnQgb2YgdGhlIGNydW1iXG4gICAqL1xuICBnZXQgd2lkdGgoKTogbnVtYmVyIHtcbiAgICByZXR1cm4gdGhpcy5fd2lkdGg7XG4gIH1cblxuICAvKipcbiAgICogR2V0cyB0aGUgZGlzcGxheSBzdHlsZSBvZiB0aGUgY3J1bWJcbiAgICovXG4gIEBIb3N0QmluZGluZygnc3R5bGUuZGlzcGxheScpXG4gIGdldCBkaXNwbGF5QmluZGluZygpOiBzdHJpbmcgfCB1bmRlZmluZWQge1xuICAgIC8vIFNldCB0aGUgZGlzcGxheSB0byBub25lIG9uIHRoZSBjb21wb25lbnQsIGp1c3QgaW4gY2FzZSB0aGUgZW5kIHVzZXIgaXMgaGlkaW5nXG4gICAgLy8gYW5kIHNob3dpbmcgdGhlbSBpbnN0ZWFkIG9mIHRoZSBjb21wb25lbnQgZG9pbmcgaXRzZWxmIGZvciByZWFzb25zIGxpa2UgcmVzcG9uc2l2ZVxuICAgIHJldHVybiB0aGlzLl9kaXNwbGF5Q3J1bWIgPyB1bmRlZmluZWQgOiAnbm9uZSc7XG4gIH1cblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIF9lbGVtZW50UmVmOiBFbGVtZW50UmVmLFxuICAgIHByaXZhdGUgX2NoYW5nZURldGVjdG9yUmVmOiBDaGFuZ2VEZXRlY3RvclJlZlxuICApIHt9XG5cbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgIC8vIHNldCB0aGUgd2lkdGggZnJvbSB0aGUgYWN0dWFsIHJlbmRlcmVkIERPTSBlbGVtZW50XG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICB0aGlzLl93aWR0aCA9ICg8SFRNTEVsZW1lbnQ+KFxuICAgICAgICB0aGlzLl9lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnRcbiAgICAgICkpLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLndpZHRoO1xuICAgICAgdGhpcy5fY2hhbmdlRGV0ZWN0b3JSZWYubWFya0ZvckNoZWNrKCk7XG4gICAgfSk7XG4gIH1cblxuICAvKipcbiAgICogU3RvcCBjbGljayBwcm9wYWdhdGlvbiB3aGVuIGNsaWNraW5nIG9uIGljb25cbiAgICovXG4gIF9oYW5kbGVJY29uQ2xpY2soZXZlbnQ6IEV2ZW50KTogdm9pZCB7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgfVxufVxuIiwiPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuPG1hdC1pY29uXG4gICpuZ0lmPVwiZGlzcGxheUljb25cIlxuICBjbGFzcz1cInRkLWJyZWFkY3J1bWItc2VwYXJhdG9yLWljb25cIlxuICBbc3R5bGUuY3Vyc29yXT1cIidkZWZhdWx0J1wiXG4gIChjbGljayk9XCJfaGFuZGxlSWNvbkNsaWNrKCRldmVudClcIlxuPlxuICB7eyBzZXBhcmF0b3JJY29uIH19XG48L21hdC1pY29uPlxuIl19
|