ngblock 0.0.6 → 0.0.7

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.
Files changed (5) hide show
  1. package/README.md +30 -9
  2. package/fesm2022/ngblock.mjs +216 -49
  3. package/fesm2022/ngblock.mjs.map +1 -1
  4. package/package.json +1 -1
  5. package/types/ngblock.d.ts +27 -18
package/README.md CHANGED
@@ -6,8 +6,10 @@
6
6
  | --- | --- | --- | --- |
7
7
  | Control / Button | Button text | `control` | `ngb-button-text-control` |
8
8
  | Control / Button | Button icon | `control` | `ngb-button-icon-control` |
9
+ | Misc | Icon | `misc` | `ngb-icon` |
9
10
 
10
- The button components are in `src/lib/control/button/`. Component files use the
11
+ The button components are in `src/lib/control/button/`; the icon component is
12
+ in `src/lib/misc/icon/`. Component files use the
11
13
  `<component-name>.<type>.<extension>` naming convention, for example
12
14
  `button-text.control.ts` and `button-icon.control.ts`.
13
15
 
@@ -21,19 +23,24 @@ Import the standalone components you use:
21
23
 
22
24
  ```ts
23
25
  import { Component } from '@angular/core';
24
- import { ButtonIconComponent, ButtonTextComponent } from 'ngblock';
26
+ import {
27
+ ButtonIconComponent,
28
+ ButtonTextComponent,
29
+ IconComponent,
30
+ } from 'ngblock';
25
31
 
26
32
  @Component({
27
33
  selector: 'app-example',
28
- imports: [ButtonTextComponent, ButtonIconComponent],
34
+ imports: [ButtonTextComponent, ButtonIconComponent, IconComponent],
29
35
  template: `
30
- <ngb-button-text-control (buttonClick)="save($event)">Save</ngb-button-text-control>
36
+ <ngb-button-text-control (clicked)="save($event)">Save</ngb-button-text-control>
31
37
  <ngb-button-text-control type="submit" [disabled]="isSaving">Submit</ngb-button-text-control>
32
38
  <ngb-button-icon-control
33
39
  icon="favorite"
34
40
  ariaLabel="Add to favorites"
35
- (buttonClick)="addToFavorites($event)"
41
+ (clicked)="addToFavorites($event)"
36
42
  />
43
+ <ngb-icon glyph="★" />
37
44
  `,
38
45
  })
39
46
  export class ExampleComponent {
@@ -56,9 +63,9 @@ supports these inputs and output:
56
63
  | --- | --- | --- | --- |
57
64
  | `type` | Input | `'button' \| 'submit' \| 'reset'` | `'button'` |
58
65
  | `disabled` | Input | `boolean` | `false` |
59
- | `buttonClick` | Output | `MouseEvent` | — |
66
+ | `clicked` | Output | `MouseEvent` | — |
60
67
 
61
- `buttonClick` emits the native click event. The component intentionally uses
68
+ `clicked` emits the native click event. The component intentionally uses
62
69
  the browser's default button styling.
63
70
 
64
71
  ### Button icon
@@ -70,7 +77,7 @@ input. TypeScript exposes the `ButtonIcon` union for editor autocomplete:
70
77
  <ngb-button-icon-control
71
78
  icon="favorite"
72
79
  ariaLabel="Add to favorites"
73
- (buttonClick)="addToFavorites($event)"
80
+ (clicked)="addToFavorites($event)"
74
81
  />
75
82
  ```
76
83
 
@@ -83,10 +90,24 @@ Available values: `add`, `check`, `close`, `delete`, `edit`, `favorite`,
83
90
  | `ariaLabel` | Input | `string` | Required |
84
91
  | `type` | Input | `'button' \| 'submit' \| 'reset'` | `'button'` |
85
92
  | `disabled` | Input | `boolean` | `false` |
86
- | `buttonClick` | Output | `MouseEvent` | — |
93
+ | `clicked` | Output | `MouseEvent` | — |
87
94
 
88
95
  `ButtonIcon` is exported from `ngblock` and is a union of the available icon
89
96
  names, so editors can suggest valid values: `add`, `check`, `close`, `delete`,
90
97
  `edit`, `favorite`, `home`, `menu`, `remove`, and `search`. The icon is hidden
91
98
  from assistive technology; `ariaLabel` provides the button's accessible name.
92
99
  The component uses the browser's default button styling.
100
+
101
+ ### Icon
102
+
103
+ `IconComponent` is also exported from `ngblock` for displaying a glyph directly:
104
+
105
+ ```html
106
+ <ngb-icon glyph="★" />
107
+ ```
108
+
109
+ | Name | Kind | Type | Default |
110
+ | --- | --- | --- | --- |
111
+ | `glyph` | Input | `string` | Required |
112
+
113
+ The glyph is treated as decorative and hidden from assistive technology.
package/fesm2022/ngblock.mjs CHANGED
@@ -1,5 +1,151 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import { ChangeDetectionStrategy, Component, computed, input, output } from "@angular/core";
3
+ var IconComponent = class IconComponent {
4
+ glyph = input.required(...ngDevMode ? [{ debugName: "glyph" }] : /* istanbul ignore next */ []);
5
+ static ɵfac = i0.ɵɵngDeclareFactory({
6
+ minVersion: "12.0.0",
7
+ version: "22.2.4",
8
+ ngImport: i0,
9
+ type: IconComponent,
10
+ deps: [],
11
+ target: i0.ɵɵFactoryTarget.Component
12
+ });
13
+ static ɵcmp = i0.ɵɵngDeclareComponent({
14
+ minVersion: "17.1.0",
15
+ version: "22.2.4",
16
+ type: IconComponent,
17
+ isStandalone: true,
18
+ selector: "ngb-icon",
19
+ inputs: { glyph: {
20
+ classPropertyName: "glyph",
21
+ publicName: "glyph",
22
+ isSignal: true,
23
+ isRequired: true,
24
+ transformFunction: null
25
+ } },
26
+ ngImport: i0,
27
+ template: "<span aria-hidden=\"true\">{{ glyph() }}</span>\r\n",
28
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
29
+ });
30
+ };
31
+ i0.ɵɵngDeclareClassMetadata({
32
+ minVersion: "12.0.0",
33
+ version: "22.2.4",
34
+ ngImport: i0,
35
+ type: IconComponent,
36
+ decorators: [{
37
+ type: Component,
38
+ args: [{
39
+ selector: "ngb-icon",
40
+ changeDetection: ChangeDetectionStrategy.OnPush,
41
+ template: "<span aria-hidden=\"true\">{{ glyph() }}</span>\r\n"
42
+ }]
43
+ }],
44
+ propDecorators: { glyph: [{
45
+ type: i0.Input,
46
+ args: [{
47
+ isSignal: true,
48
+ alias: "glyph",
49
+ required: true
50
+ }]
51
+ }] }
52
+ });
53
+ var ButtonBaseComponent = class ButtonBaseComponent {
54
+ type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
55
+ disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
56
+ ariaLabel = input(null, ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
57
+ clicked = output();
58
+ onClick(event) {
59
+ this.clicked.emit(event);
60
+ }
61
+ static ɵfac = i0.ɵɵngDeclareFactory({
62
+ minVersion: "12.0.0",
63
+ version: "22.2.4",
64
+ ngImport: i0,
65
+ type: ButtonBaseComponent,
66
+ deps: [],
67
+ target: i0.ɵɵFactoryTarget.Component
68
+ });
69
+ static ɵcmp = i0.ɵɵngDeclareComponent({
70
+ minVersion: "17.1.0",
71
+ version: "22.2.4",
72
+ type: ButtonBaseComponent,
73
+ isStandalone: true,
74
+ selector: "ngb-button-base-control",
75
+ inputs: {
76
+ type: {
77
+ classPropertyName: "type",
78
+ publicName: "type",
79
+ isSignal: true,
80
+ isRequired: false,
81
+ transformFunction: null
82
+ },
83
+ disabled: {
84
+ classPropertyName: "disabled",
85
+ publicName: "disabled",
86
+ isSignal: true,
87
+ isRequired: false,
88
+ transformFunction: null
89
+ },
90
+ ariaLabel: {
91
+ classPropertyName: "ariaLabel",
92
+ publicName: "ariaLabel",
93
+ isSignal: true,
94
+ isRequired: false,
95
+ transformFunction: null
96
+ }
97
+ },
98
+ outputs: { clicked: "clicked" },
99
+ ngImport: i0,
100
+ template: "<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content />\r\n</button>\r\n",
101
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
102
+ });
103
+ };
104
+ i0.ɵɵngDeclareClassMetadata({
105
+ minVersion: "12.0.0",
106
+ version: "22.2.4",
107
+ ngImport: i0,
108
+ type: ButtonBaseComponent,
109
+ decorators: [{
110
+ type: Component,
111
+ args: [{
112
+ selector: "ngb-button-base-control",
113
+ imports: [],
114
+ changeDetection: ChangeDetectionStrategy.OnPush,
115
+ template: "<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content />\r\n</button>\r\n"
116
+ }]
117
+ }],
118
+ propDecorators: {
119
+ type: [{
120
+ type: i0.Input,
121
+ args: [{
122
+ isSignal: true,
123
+ alias: "type",
124
+ required: false
125
+ }]
126
+ }],
127
+ disabled: [{
128
+ type: i0.Input,
129
+ args: [{
130
+ isSignal: true,
131
+ alias: "disabled",
132
+ required: false
133
+ }]
134
+ }],
135
+ ariaLabel: [{
136
+ type: i0.Input,
137
+ args: [{
138
+ isSignal: true,
139
+ alias: "ariaLabel",
140
+ required: false
141
+ }]
142
+ }],
143
+ clicked: [{
144
+ type: i0.Output,
145
+ args: ["clicked"]
146
+ }]
147
+ }
148
+ });
3
149
  const BUTTON_ICONS = {
4
150
  add: "+",
5
151
  check: "✓",
@@ -13,15 +159,12 @@ const BUTTON_ICONS = {
13
159
  search: "⌕"
14
160
  };
15
161
  var ButtonIconComponent = class ButtonIconComponent {
162
+ type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
163
+ disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
16
164
  icon = input.required(...ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []);
17
165
  iconGlyph = computed(() => BUTTON_ICONS[this.icon()], ...ngDevMode ? [{ debugName: "iconGlyph" }] : /* istanbul ignore next */ []);
18
166
  ariaLabel = input.required(...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
19
- type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
20
- disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
21
- buttonClick = output();
22
- onClick(event) {
23
- this.buttonClick.emit(event);
24
- }
167
+ clicked = output();
25
168
  static ɵfac = i0.ɵɵngDeclareFactory({
26
169
  minVersion: "12.0.0",
27
170
  version: "22.2.4",
@@ -37,20 +180,6 @@ var ButtonIconComponent = class ButtonIconComponent {
37
180
  isStandalone: true,
38
181
  selector: "ngb-button-icon-control",
39
182
  inputs: {
40
- icon: {
41
- classPropertyName: "icon",
42
- publicName: "icon",
43
- isSignal: true,
44
- isRequired: true,
45
- transformFunction: null
46
- },
47
- ariaLabel: {
48
- classPropertyName: "ariaLabel",
49
- publicName: "ariaLabel",
50
- isSignal: true,
51
- isRequired: true,
52
- transformFunction: null
53
- },
54
183
  type: {
55
184
  classPropertyName: "type",
56
185
  publicName: "type",
@@ -64,11 +193,41 @@ var ButtonIconComponent = class ButtonIconComponent {
64
193
  isSignal: true,
65
194
  isRequired: false,
66
195
  transformFunction: null
196
+ },
197
+ icon: {
198
+ classPropertyName: "icon",
199
+ publicName: "icon",
200
+ isSignal: true,
201
+ isRequired: true,
202
+ transformFunction: null
203
+ },
204
+ ariaLabel: {
205
+ classPropertyName: "ariaLabel",
206
+ publicName: "ariaLabel",
207
+ isSignal: true,
208
+ isRequired: true,
209
+ transformFunction: null
67
210
  }
68
211
  },
69
- outputs: { buttonClick: "buttonClick" },
212
+ outputs: { clicked: "clicked" },
70
213
  ngImport: i0,
71
- template: "<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <span aria-hidden=\"true\">{{ iconGlyph() }}</span>\r\n</button>\r\n",
214
+ template: "<ngb-button-base-control\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [ariaLabel]=\"ariaLabel()\"\r\n (clicked)=\"clicked.emit($event)\"\r\n>\r\n <ngb-icon [glyph]=\"iconGlyph()\" />\r\n</ngb-button-base-control>\r\n",
215
+ dependencies: [{
216
+ kind: "component",
217
+ type: ButtonBaseComponent,
218
+ selector: "ngb-button-base-control",
219
+ inputs: [
220
+ "type",
221
+ "disabled",
222
+ "ariaLabel"
223
+ ],
224
+ outputs: ["clicked"]
225
+ }, {
226
+ kind: "component",
227
+ type: IconComponent,
228
+ selector: "ngb-icon",
229
+ inputs: ["glyph"]
230
+ }],
72
231
  changeDetection: i0.ChangeDetectionStrategy.OnPush
73
232
  });
74
233
  };
@@ -81,57 +240,54 @@ i0.ɵɵngDeclareClassMetadata({
81
240
  type: Component,
82
241
  args: [{
83
242
  selector: "ngb-button-icon-control",
84
- imports: [],
243
+ imports: [ButtonBaseComponent, IconComponent],
85
244
  changeDetection: ChangeDetectionStrategy.OnPush,
86
- template: "<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <span aria-hidden=\"true\">{{ iconGlyph() }}</span>\r\n</button>\r\n"
245
+ template: "<ngb-button-base-control\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [ariaLabel]=\"ariaLabel()\"\r\n (clicked)=\"clicked.emit($event)\"\r\n>\r\n <ngb-icon [glyph]=\"iconGlyph()\" />\r\n</ngb-button-base-control>\r\n"
87
246
  }]
88
247
  }],
89
248
  propDecorators: {
90
- icon: [{
249
+ type: [{
91
250
  type: i0.Input,
92
251
  args: [{
93
252
  isSignal: true,
94
- alias: "icon",
95
- required: true
253
+ alias: "type",
254
+ required: false
96
255
  }]
97
256
  }],
98
- ariaLabel: [{
257
+ disabled: [{
99
258
  type: i0.Input,
100
259
  args: [{
101
260
  isSignal: true,
102
- alias: "ariaLabel",
103
- required: true
261
+ alias: "disabled",
262
+ required: false
104
263
  }]
105
264
  }],
106
- type: [{
265
+ icon: [{
107
266
  type: i0.Input,
108
267
  args: [{
109
268
  isSignal: true,
110
- alias: "type",
111
- required: false
269
+ alias: "icon",
270
+ required: true
112
271
  }]
113
272
  }],
114
- disabled: [{
273
+ ariaLabel: [{
115
274
  type: i0.Input,
116
275
  args: [{
117
276
  isSignal: true,
118
- alias: "disabled",
119
- required: false
277
+ alias: "ariaLabel",
278
+ required: true
120
279
  }]
121
280
  }],
122
- buttonClick: [{
281
+ clicked: [{
123
282
  type: i0.Output,
124
- args: ["buttonClick"]
283
+ args: ["clicked"]
125
284
  }]
126
285
  }
127
286
  });
128
287
  var ButtonTextComponent = class ButtonTextComponent {
129
288
  type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
130
289
  disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
131
- buttonClick = output();
132
- onClick(event) {
133
- this.buttonClick.emit(event);
134
- }
290
+ clicked = output();
135
291
  static ɵfac = i0.ɵɵngDeclareFactory({
136
292
  minVersion: "12.0.0",
137
293
  version: "22.2.4",
@@ -162,9 +318,20 @@ var ButtonTextComponent = class ButtonTextComponent {
162
318
  transformFunction: null
163
319
  }
164
320
  },
165
- outputs: { buttonClick: "buttonClick" },
321
+ outputs: { clicked: "clicked" },
166
322
  ngImport: i0,
167
- template: "<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content />\r\n</button>\r\n",
323
+ template: "<ngb-button-base-control\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n (clicked)=\"clicked.emit($event)\"\r\n>\r\n <ng-content />\r\n</ngb-button-base-control>\r\n",
324
+ dependencies: [{
325
+ kind: "component",
326
+ type: ButtonBaseComponent,
327
+ selector: "ngb-button-base-control",
328
+ inputs: [
329
+ "type",
330
+ "disabled",
331
+ "ariaLabel"
332
+ ],
333
+ outputs: ["clicked"]
334
+ }],
168
335
  changeDetection: i0.ChangeDetectionStrategy.OnPush
169
336
  });
170
337
  };
@@ -177,9 +344,9 @@ i0.ɵɵngDeclareClassMetadata({
177
344
  type: Component,
178
345
  args: [{
179
346
  selector: "ngb-button-text-control",
180
- imports: [],
347
+ imports: [ButtonBaseComponent],
181
348
  changeDetection: ChangeDetectionStrategy.OnPush,
182
- template: "<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content />\r\n</button>\r\n"
349
+ template: "<ngb-button-base-control\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n (clicked)=\"clicked.emit($event)\"\r\n>\r\n <ng-content />\r\n</ngb-button-base-control>\r\n"
183
350
  }]
184
351
  }],
185
352
  propDecorators: {
@@ -199,12 +366,12 @@ i0.ɵɵngDeclareClassMetadata({
199
366
  required: false
200
367
  }]
201
368
  }],
202
- buttonClick: [{
369
+ clicked: [{
203
370
  type: i0.Output,
204
- args: ["buttonClick"]
371
+ args: ["clicked"]
205
372
  }]
206
373
  }
207
374
  });
208
- export { BUTTON_ICONS, ButtonIconComponent, ButtonTextComponent };
375
+ export { BUTTON_ICONS, ButtonIconComponent, ButtonTextComponent, IconComponent };
209
376
 
210
377
  //# sourceMappingURL=ngblock.mjs.map
package/fesm2022/ngblock.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ngblock.mjs","names":[],"sources":["../../../../packages/ngblock/src/lib/control/button/button-icon/button-icon.control.ts","../../../../packages/ngblock/src/lib/control/button/button-icon/button-icon.control.html","../../../../packages/ngblock/src/lib/control/button/button-text/button-text.control.ts","../../../../packages/ngblock/src/lib/control/button/button-text/button-text.control.html"],"sourcesContent":["import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n computed,\r\n input,\r\n output,\r\n} from '@angular/core';\r\n\r\nexport const BUTTON_ICONS = {\r\n add: '+',\r\n check: '✓',\r\n close: '×',\r\n delete: '⌫',\r\n edit: '✎',\r\n favorite: '★',\r\n home: '⌂',\r\n menu: '☰',\r\n remove: '−',\r\n search: '⌕',\r\n} as const;\r\n\r\nexport type ButtonIcon = keyof typeof BUTTON_ICONS;\r\n\r\n@Component({\r\n selector: 'ngb-button-icon-control',\r\n imports: [],\r\n templateUrl: './button-icon.control.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class ButtonIconComponent {\r\n readonly icon = input.required<ButtonIcon>();\r\n readonly iconGlyph = computed(() => BUTTON_ICONS[this.icon()]);\r\n readonly ariaLabel = input.required<string>();\r\n readonly type = input<HTMLButtonElement['type']>('button');\r\n readonly disabled = input(false);\r\n readonly buttonClick = output<MouseEvent>();\r\n\r\n onClick(event: MouseEvent): void {\r\n this.buttonClick.emit(event);\r\n }\r\n}\r\n","<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <span aria-hidden=\"true\">{{ iconGlyph() }}</span>\r\n</button>\r\n","import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n input,\r\n output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'ngb-button-text-control',\r\n imports: [],\r\n templateUrl: './button-text.control.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class ButtonTextComponent {\r\n readonly type = input<HTMLButtonElement['type']>('button');\r\n readonly disabled = input(false);\r\n readonly buttonClick = output<MouseEvent>();\r\n\r\n onClick(event: MouseEvent): void {\r\n this.buttonClick.emit(event);\r\n }\r\n}\r\n","<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content />\r\n</button>\r\n"],"mappings":"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"}
1
+ {"version":3,"file":"ngblock.mjs","names":[],"sources":["../../../../packages/ngblock/src/lib/misc/icon/icon.component.ts","../../../../packages/ngblock/src/lib/misc/icon/icon.component.html","../../../../packages/ngblock/src/lib/control/button/button-base/button-base.control.ts","../../../../packages/ngblock/src/lib/control/button/button-base/button-base.control.html","../../../../packages/ngblock/src/lib/control/button/button-icon/button-icon.control.ts","../../../../packages/ngblock/src/lib/control/button/button-icon/button-icon.control.html","../../../../packages/ngblock/src/lib/control/button/button-text/button-text.control.ts","../../../../packages/ngblock/src/lib/control/button/button-text/button-text.control.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'ngb-icon',\r\n templateUrl: './icon.component.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class IconComponent {\r\n readonly glyph = input.required<string>();\r\n}\r\n","<span aria-hidden=\"true\">{{ glyph() }}</span>\r\n","import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n input,\r\n output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'ngb-button-base-control',\r\n imports: [],\r\n templateUrl: './button-base.control.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class ButtonBaseComponent {\r\n readonly type = input<HTMLButtonElement['type']>('button');\r\n readonly disabled = input(false);\r\n readonly ariaLabel = input<string | null>(null);\r\n readonly clicked = output<MouseEvent>();\r\n\r\n onClick(event: MouseEvent): void {\r\n this.clicked.emit(event);\r\n }\r\n}\r\n","<button\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content />\r\n</button>\r\n","import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n computed,\r\n input,\r\n output,\r\n} from '@angular/core';\r\nimport { IconComponent } from '../../../misc/icon/icon.component';\r\nimport { ButtonBaseComponent } from '../button-base/button-base.control';\r\n\r\nexport const BUTTON_ICONS = {\r\n add: '+',\r\n check: '✓',\r\n close: '×',\r\n delete: '⌫',\r\n edit: '✎',\r\n favorite: '★',\r\n home: '⌂',\r\n menu: '☰',\r\n remove: '−',\r\n search: '⌕',\r\n} as const;\r\n\r\nexport type ButtonIcon = keyof typeof BUTTON_ICONS;\r\n\r\n@Component({\r\n selector: 'ngb-button-icon-control',\r\n imports: [ButtonBaseComponent, IconComponent],\r\n templateUrl: './button-icon.control.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class ButtonIconComponent {\r\n readonly type = input<HTMLButtonElement['type']>('button');\r\n readonly disabled = input(false);\r\n readonly icon = input.required<ButtonIcon>();\r\n readonly iconGlyph = computed(() => BUTTON_ICONS[this.icon()]);\r\n readonly ariaLabel = input.required<string>();\r\n readonly clicked = output<MouseEvent>();\r\n}\r\n","<ngb-button-base-control\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n [ariaLabel]=\"ariaLabel()\"\r\n (clicked)=\"clicked.emit($event)\"\r\n>\r\n <ngb-icon [glyph]=\"iconGlyph()\" />\r\n</ngb-button-base-control>\r\n","import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n input,\r\n output,\r\n} from '@angular/core';\r\nimport { ButtonBaseComponent } from '../button-base/button-base.control';\r\n\r\n@Component({\r\n selector: 'ngb-button-text-control',\r\n imports: [ButtonBaseComponent],\r\n templateUrl: './button-text.control.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class ButtonTextComponent {\r\n readonly type = input<HTMLButtonElement['type']>('button');\r\n readonly disabled = input(false);\r\n readonly clicked = output<MouseEvent>();\r\n}\r\n","<ngb-button-base-control\r\n [type]=\"type()\"\r\n [disabled]=\"disabled()\"\r\n (clicked)=\"clicked.emit($event)\"\r\n>\r\n <ng-content />\r\n</ngb-button-base-control>\r\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ngblock",
3
- "version": "0.0.6",
3
+ "version": "0.0.7",
4
4
  "description": "An Angular library for ngblock.",
5
5
  "license": "MIT",
6
6
  "peerDependencies": {
package/types/ngblock.d.ts CHANGED
@@ -13,25 +13,14 @@ export declare const BUTTON_ICONS: {
13
13
  };
14
14
  export type ButtonIcon = keyof typeof BUTTON_ICONS;
15
15
  export declare class ButtonIconComponent {
16
+ readonly type: import("@angular/core").InputSignal<"submit" | "reset" | "button">;
17
+ readonly disabled: import("@angular/core").InputSignal<boolean>;
16
18
  readonly icon: import("@angular/core").InputSignal<"add" | "check" | "close" | "delete" | "edit" | "favorite" | "home" | "menu" | "remove" | "search">;
17
19
  readonly iconGlyph: import("@angular/core").Signal<"+" | "✓" | "×" | "⌫" | "✎" | "★" | "⌂" | "☰" | "−" | "⌕">;
18
20
  readonly ariaLabel: import("@angular/core").InputSignal<string>;
19
- readonly type: import("@angular/core").InputSignal<"submit" | "reset" | "button">;
20
- readonly disabled: import("@angular/core").InputSignal<boolean>;
21
- readonly buttonClick: import("@angular/core").OutputEmitterRef<MouseEvent>;
22
- onClick(event: MouseEvent): void;
21
+ readonly clicked: import("@angular/core").OutputEmitterRef<MouseEvent>;
23
22
  static ɵfac: i0.ɵɵFactoryDeclaration<ButtonIconComponent, never>;
24
23
  static ɵcmp: i0.ɵɵComponentDeclaration<ButtonIconComponent, "ngb-button-icon-control", never, {
25
- "icon": {
26
- "alias": "icon";
27
- "required": true;
28
- "isSignal": true;
29
- };
30
- "ariaLabel": {
31
- "alias": "ariaLabel";
32
- "required": true;
33
- "isSignal": true;
34
- };
35
24
  "type": {
36
25
  "alias": "type";
37
26
  "required": false;
@@ -42,15 +31,24 @@ export declare class ButtonIconComponent {
42
31
  "required": false;
43
32
  "isSignal": true;
44
33
  };
34
+ "icon": {
35
+ "alias": "icon";
36
+ "required": true;
37
+ "isSignal": true;
38
+ };
39
+ "ariaLabel": {
40
+ "alias": "ariaLabel";
41
+ "required": true;
42
+ "isSignal": true;
43
+ };
45
44
  }, {
46
- "buttonClick": "buttonClick";
45
+ "clicked": "clicked";
47
46
  }, never, never, true, never>;
48
47
  }
49
48
  export declare class ButtonTextComponent {
50
49
  readonly type: import("@angular/core").InputSignal<"submit" | "reset" | "button">;
51
50
  readonly disabled: import("@angular/core").InputSignal<boolean>;
52
- readonly buttonClick: import("@angular/core").OutputEmitterRef<MouseEvent>;
53
- onClick(event: MouseEvent): void;
51
+ readonly clicked: import("@angular/core").OutputEmitterRef<MouseEvent>;
54
52
  static ɵfac: i0.ɵɵFactoryDeclaration<ButtonTextComponent, never>;
55
53
  static ɵcmp: i0.ɵɵComponentDeclaration<ButtonTextComponent, "ngb-button-text-control", never, {
56
54
  "type": {
@@ -64,6 +62,17 @@ export declare class ButtonTextComponent {
64
62
  "isSignal": true;
65
63
  };
66
64
  }, {
67
- "buttonClick": "buttonClick";
65
+ "clicked": "clicked";
68
66
  }, never, ["*"], true, never>;
67
+ }
68
+ export declare class IconComponent {
69
+ readonly glyph: import("@angular/core").InputSignal<string>;
70
+ static ɵfac: i0.ɵɵFactoryDeclaration<IconComponent, never>;
71
+ static ɵcmp: i0.ɵɵComponentDeclaration<IconComponent, "ngb-icon", never, {
72
+ "glyph": {
73
+ "alias": "glyph";
74
+ "required": true;
75
+ "isSignal": true;
76
+ };
77
+ }, {}, never, never, true, never>;
69
78
  }