| 1 | import { NbBooleanInput } from '../helpers';
|
| 2 | import { NbComponentSize } from '../component-size';
|
| 3 | import { NbComponentOrCustomStatus } from '../component-status';
|
| 4 | import { NbBadgePosition } from '../badge/badge.component';
|
| 5 | import { NbIconConfig } from '../icon/icon.component';
|
| 6 | import * as i0 from "@angular/core";
|
| 7 | /**
|
| 8 | * Action item, display a link with an icon, or any other content provided instead.
|
| 9 | */
|
| 10 | export declare class NbActionComponent {
|
| 11 | /**
|
| 12 | * Router link to use
|
| 13 | * @type string
|
| 14 | */
|
| 15 | link: string;
|
| 16 | /**
|
| 17 | * Regular HREF link
|
| 18 | * @type: string
|
| 19 | */
|
| 20 | href: string;
|
| 21 | /**
|
| 22 | * Optional title for mouseover
|
| 23 | * @type string
|
| 24 | */
|
| 25 | title: string;
|
| 26 | /**
|
| 27 | * Icon name or config object
|
| 28 | * @type {string | NbIconConfig}
|
| 29 | */
|
| 30 | icon: string | NbIconConfig;
|
| 31 | /**
|
| 32 | * Visually disables the item
|
| 33 | * @type boolean
|
| 34 | */
|
| 35 | get disabled(): boolean;
|
| 36 | set disabled(value: boolean);
|
| 37 | protected _disabled: boolean;
|
| 38 | static ngAcceptInputType_disabled: NbBooleanInput;
|
| 39 | /**
|
| 40 | * Use badge dot mode
|
| 41 | * @type boolean
|
| 42 | */
|
| 43 | get badgeDot(): boolean;
|
| 44 | set badgeDot(value: boolean);
|
| 45 | protected _badgeDot: boolean;
|
| 46 | static ngAcceptInputType_badgeDot: NbBooleanInput;
|
| 47 | /**
|
| 48 | * Badge text to display
|
| 49 | * @type string
|
| 50 | */
|
| 51 | badgeText: string;
|
| 52 | /**
|
| 53 | * Badge status (adds specific styles):
|
| 54 | * 'basic', 'primary', 'info', 'success', 'warning', 'danger', 'control'
|
| 55 | * @param {string} val
|
| 56 | */
|
| 57 | badgeStatus: NbComponentOrCustomStatus;
|
| 58 | /**
|
| 59 | * Badge position.
|
| 60 | * Can be set to any class or to one of predefined positions:
|
| 61 | * 'top left', 'top right', 'bottom left', 'bottom right',
|
| 62 | * 'top start', 'top end', 'bottom start', 'bottom end'
|
| 63 | * @type string
|
| 64 | */
|
| 65 | badgePosition: NbBadgePosition;
|
| 66 | static ɵfac: i0.ɵɵFactoryDeclaration<NbActionComponent, never>;
|
| 67 | static ɵcmp: i0.ɵɵComponentDeclaration<NbActionComponent, "nb-action", never, { "link": "link"; "href": "href"; "title": "title"; "icon": "icon"; "disabled": "disabled"; "badgeDot": "badgeDot"; "badgeText": "badgeText"; "badgeStatus": "badgeStatus"; "badgePosition": "badgePosition"; }, {}, never, ["*"]>;
|
| 68 | }
|
| 69 | /**
|
| 70 | * Shows a horizontal list of actions, available in multiple sizes.
|
| 71 | * Aligns items vertically.
|
| 72 | *
|
| 73 | * @stacked-example(Showcase, action/action-showcase.component)
|
| 74 | *
|
| 75 | * Basic actions setup:
|
| 76 | * ```html
|
| 77 | * <nb-actions size="small">
|
| 78 | * <nb-action icon="nb-search"></nb-action>
|
| 79 | * <nb-action icon="nb-power-circled"></nb-action>
|
| 80 | * <nb-action icon="nb-person"></nb-action>
|
| 81 | * </nb-actions>
|
| 82 | * ```
|
| 83 | * ### Installation
|
| 84 | *
|
| 85 | * Import `NbActionsModule` to your feature module.
|
| 86 | * ```ts
|
| 87 | * @NgModule({
|
| 88 | * imports: [
|
| 89 | * // ...
|
| 90 | * NbActionsModule,
|
| 91 | * ],
|
| 92 | * })
|
| 93 | * export class PageModule { }
|
| 94 | * ```
|
| 95 | * ### Usage
|
| 96 | *
|
| 97 | * Multiple sizes example:
|
| 98 | * @stacked-example(Multiple Sizes, action/action-sizes.component)
|
| 99 | *
|
| 100 | * It is also possible to specify a `badge` value:
|
| 101 | *
|
| 102 | * @stacked-example(Action Badge, action/action-badge.component)
|
| 103 | *
|
| 104 | * and we can set it to full a width of a parent component
|
| 105 | * @stacked-example(Full Width, action/action-width.component)
|
| 106 | *
|
| 107 | * Action dot mode
|
| 108 | * @stacked-example(Action badge in dot mode, action/action-dot-mode.component)
|
| 109 | *
|
| 110 | * @styles
|
| 111 | *
|
| 112 | * actions-background-color:
|
| 113 | * actions-divider-color:
|
| 114 | * actions-divider-style:
|
| 115 | * actions-divider-width:
|
| 116 | * actions-icon-color:
|
| 117 | * actions-text-color:
|
| 118 | * actions-text-font-family:
|
| 119 | * actions-text-font-weight:
|
| 120 | * actions-text-line-height:
|
| 121 | * actions-disabled-icon-color:
|
| 122 | * actions-disabled-text-color:
|
| 123 | * actions-tiny-height:
|
| 124 | * actions-tiny-icon-height:
|
| 125 | * actions-tiny-padding:
|
| 126 | * actions-tiny-text-font-size:
|
| 127 | * actions-small-height:
|
| 128 | * actions-small-icon-height:
|
| 129 | * actions-small-padding:
|
| 130 | * actions-small-text-font-size:
|
| 131 | * actions-medium-height:
|
| 132 | * actions-medium-icon-height:
|
| 133 | * actions-medium-padding:
|
| 134 | * actions-medium-text-font-size:
|
| 135 | * actions-large-height:
|
| 136 | * actions-large-icon-height:
|
| 137 | * actions-large-padding:
|
| 138 | * actions-large-text-font-size:
|
| 139 | * actions-giant-height:
|
| 140 | * actions-giant-icon-height:
|
| 141 | * actions-giant-padding:
|
| 142 | * actions-giant-text-font-size:
|
| 143 | */
|
| 144 | export declare class NbActionsComponent {
|
| 145 | /**
|
| 146 | * Size of the component: 'tiny', 'small' (default), 'medium', 'large', 'giant'
|
| 147 | */
|
| 148 | get size(): NbComponentSize;
|
| 149 | set size(value: NbComponentSize);
|
| 150 | protected _size: NbComponentSize;
|
| 151 | /**
|
| 152 | * Component will fill full width of the container
|
| 153 | */
|
| 154 | get fullWidth(): boolean;
|
| 155 | set fullWidth(value: boolean);
|
| 156 | protected _fullWidth: boolean;
|
| 157 | static ngAcceptInputType_fullWidth: NbBooleanInput;
|
| 158 | get tiny(): boolean;
|
| 159 | get small(): boolean;
|
| 160 | get medium(): boolean;
|
| 161 | get large(): boolean;
|
| 162 | get giant(): boolean;
|
| 163 | static ɵfac: i0.ɵɵFactoryDeclaration<NbActionsComponent, never>;
|
| 164 | static ɵcmp: i0.ɵɵComponentDeclaration<NbActionsComponent, "nb-actions", never, { "size": "size"; "fullWidth": "fullWidth"; }, {}, never, ["nb-action"]>;
|
| 165 | }
|