ngblock 0.0.2 → 0.0.4

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 +44 -46
  2. package/fesm2022/ngblock.mjs +9 -11
  3. package/fesm2022/ngblock.mjs.map +1 -1
  4. package/package.json +1 -1
  5. package/types/ngblock.d.ts +3 -3
package/README.md CHANGED
@@ -1,46 +1,44 @@
1
- # ngblock
2
-
3
- An Angular library packaged in Angular Package Format for use in Angular applications.
4
-
5
- ## Install
6
-
7
- ```bash
8
- npm install ngblock
9
- ```
10
-
11
- ## Use
12
-
13
- Import the standalone button component where you need it:
14
-
15
- ```ts
16
- import { Component } from '@angular/core';
17
- import { ButtonComponent } from 'ngblock';
18
-
19
- @Component({
20
- imports: [ButtonComponent],
21
- template: `
22
- <ngb-button (click)="save()">Save</ngb-button>
23
- <ngb-button type="submit" [disabled]="isSaving">Submit</ngb-button>
24
- `,
25
- })
26
- export class ExampleComponent {
27
- isSaving = false;
28
-
29
- save(): void {
30
- // Handle the action.
31
- }
32
- }
33
- ```
34
-
35
- `ngb-button` projects its content into a native button. It supports the native
36
- button types through `type` (`button`, `submit`, or `reset`) and a `disabled`
37
- input. The default type is `button`.
38
-
39
- ## Develop
40
-
41
- From the Nx workspace root:
42
-
43
- ```bash
44
- npx nx build ngblock
45
- npx nx test ngblock
46
- ```
1
+ # ngblock
2
+
3
+ ## Components
4
+
5
+ | Group | Component | Type | Selector |
6
+ | --- | --- | --- | --- |
7
+ | Control / Button | Button text | `control` | `ngb-button-text-control` |
8
+
9
+ The component is in `src/lib/control/button/button-text/`. Component files use
10
+ the `<component-name>.<type>.<extension>` naming convention, for example
11
+ `button-text.control.ts` and `button-text.control.html`.
12
+
13
+ ## Use
14
+
15
+ ```bash
16
+ npm install ngblock
17
+ ```
18
+
19
+ Import `ButtonTextComponent` into the standalone component that uses it:
20
+
21
+ ```ts
22
+ import { Component } from '@angular/core';
23
+ import { ButtonTextComponent } from 'ngblock';
24
+
25
+ @Component({
26
+ selector: 'app-example',
27
+ imports: [ButtonTextComponent],
28
+ template: `
29
+ <ngb-button-text-control (click)="save()">Save</ngb-button-text-control>
30
+ <ngb-button-text-control type="submit" [disabled]="isSaving">Submit</ngb-button-text-control>
31
+ `,
32
+ })
33
+ export class ExampleComponent {
34
+ isSaving = false;
35
+
36
+ save(): void {
37
+ // Perform the save action.
38
+ }
39
+ }
40
+ ```
41
+
42
+ `ButtonTextComponent` wraps a native button and projects its text content. It
43
+ supports native `type` and `disabled` inputs and intentionally uses the
44
+ browser's default styling.
package/fesm2022/ngblock.mjs CHANGED
@@ -1,22 +1,22 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import { ChangeDetectionStrategy, Component, input } from "@angular/core";
3
- var ButtonComponent = class ButtonComponent {
3
+ var ButtonTextComponent = class ButtonTextComponent {
4
4
  type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
5
5
  disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
6
6
  static ɵfac = i0.ɵɵngDeclareFactory({
7
7
  minVersion: "12.0.0",
8
8
  version: "22.2.4",
9
9
  ngImport: i0,
10
- type: ButtonComponent,
10
+ type: ButtonTextComponent,
11
11
  deps: [],
12
12
  target: i0.ɵɵFactoryTarget.Component
13
13
  });
14
14
  static ɵcmp = i0.ɵɵngDeclareComponent({
15
15
  minVersion: "17.1.0",
16
16
  version: "22.2.4",
17
- type: ButtonComponent,
17
+ type: ButtonTextComponent,
18
18
  isStandalone: true,
19
- selector: "ngb-button",
19
+ selector: "ngb-button-text-control",
20
20
  inputs: {
21
21
  type: {
22
22
  classPropertyName: "type",
@@ -34,8 +34,7 @@ var ButtonComponent = class ButtonComponent {
34
34
  }
35
35
  },
36
36
  ngImport: i0,
37
- template: "<button class=\"ngblock-button\" [type]=\"type()\" [disabled]=\"disabled()\">\n <ng-content />\n</button>\n",
38
- styles: [":host{display:inline-block}.ngblock-button{padding:.5rem .875rem;border:1px solid currentColor;border-radius:.25rem;background:transparent;color:inherit;cursor:pointer;font:inherit}.ngblock-button:focus-visible{outline:2px solid currentColor;outline-offset:2px}.ngblock-button:disabled{cursor:not-allowed;opacity:.6}\n"],
37
+ template: "<button [type]=\"type()\" [disabled]=\"disabled()\">\r\n <ng-content />\r\n</button>\r\n",
39
38
  changeDetection: i0.ChangeDetectionStrategy.OnPush
40
39
  });
41
40
  };
@@ -43,15 +42,14 @@ i0.ɵɵngDeclareClassMetadata({
43
42
  minVersion: "12.0.0",
44
43
  version: "22.2.4",
45
44
  ngImport: i0,
46
- type: ButtonComponent,
45
+ type: ButtonTextComponent,
47
46
  decorators: [{
48
47
  type: Component,
49
48
  args: [{
50
- selector: "ngb-button",
49
+ selector: "ngb-button-text-control",
51
50
  imports: [],
52
51
  changeDetection: ChangeDetectionStrategy.OnPush,
53
- template: "<button class=\"ngblock-button\" [type]=\"type()\" [disabled]=\"disabled()\">\n <ng-content />\n</button>\n",
54
- styles: [":host{display:inline-block}.ngblock-button{padding:.5rem .875rem;border:1px solid currentColor;border-radius:.25rem;background:transparent;color:inherit;cursor:pointer;font:inherit}.ngblock-button:focus-visible{outline:2px solid currentColor;outline-offset:2px}.ngblock-button:disabled{cursor:not-allowed;opacity:.6}\n"]
52
+ template: "<button [type]=\"type()\" [disabled]=\"disabled()\">\r\n <ng-content />\r\n</button>\r\n"
55
53
  }]
56
54
  }],
57
55
  propDecorators: {
@@ -73,6 +71,6 @@ i0.ɵɵngDeclareClassMetadata({
73
71
  }]
74
72
  }
75
73
  });
76
- export { ButtonComponent };
74
+ export { ButtonTextComponent };
77
75
 
78
76
  //# 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.ts","../../../../packages/ngblock/src/lib/control/button.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngb-button',\n imports: [],\n templateUrl: './button.html',\n styleUrl: './button.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonComponent {\n readonly type = input<HTMLButtonElement['type']>('button');\n readonly disabled = input(false);\n}\n","<button class=\"ngblock-button\" [type]=\"type()\" [disabled]=\"disabled()\">\n <ng-content />\n</button>\n"],"mappings":";;AASA,IAAa,kBAAb,MAAa,gBAAe;CACjB,OAAO,MAAiC,UAAS,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CACjD,WAAW,MAAM,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAFrB,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAe,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAf,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAe,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,UAAA;EAAA,UCT5B;EAGA,QAAA,CAAA,gUAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;ADMa,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAe,YAAA,CAAA;EAP3B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAY,SACb,CAAA;GAAE,iBAGM,wBAAwB;GAAM,UAAA;GAAA,QAAA,CAAA,gUAAA;EAAA,CAAA"}
1
+ {"version":3,"file":"ngblock.mjs","names":[],"sources":["../../../../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-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}\r\n","<button [type]=\"type()\" [disabled]=\"disabled()\">\r\n <ng-content />\r\n</button>\r\n"],"mappings":";;AAQA,IAAa,sBAAb,MAAa,oBAAmB;CACrB,OAAO,MAAiC,UAAS,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CACjD,WAAW,MAAM,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAFrB,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAmB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAnB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAmB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,UAAA;EAAA,UCRhC;EAGA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;ADKa,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAmB,YAAA,CAAA;EAN/B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAyB,SAC1B,CAAA;GAAE,iBAEM,wBAAwB;GAAM,UAAA;EAAA,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ngblock",
3
- "version": "0.0.2",
3
+ "version": "0.0.4",
4
4
  "description": "An Angular library for ngblock.",
5
5
  "license": "MIT",
6
6
  "peerDependencies": {
package/types/ngblock.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import * as i0 from "@angular/core";
2
- export declare class ButtonComponent {
2
+ export declare class ButtonTextComponent {
3
3
  readonly type: import("@angular/core").InputSignal<"submit" | "reset" | "button">;
4
4
  readonly disabled: import("@angular/core").InputSignal<boolean>;
5
- static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
6
- static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "ngb-button", never, {
5
+ static ɵfac: i0.ɵɵFactoryDeclaration<ButtonTextComponent, never>;
6
+ static ɵcmp: i0.ɵɵComponentDeclaration<ButtonTextComponent, "ngb-button-text-control", never, {
7
7
  "type": {
8
8
  "alias": "type";
9
9
  "required": false;