ngblock 0.0.3 → 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 +16 -33
  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,32 +1,33 @@
1
1
  # ngblock
2
2
 
3
- `ngblock` is an Angular UI library. The current release includes a standalone
4
- button control.
3
+ ## Components
5
4
 
6
- ## Requirements
5
+ | Group | Component | Type | Selector |
6
+ | --- | --- | --- | --- |
7
+ | Control / Button | Button text | `control` | `ngb-button-text-control` |
7
8
 
8
- - Angular `^22.2.0`
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`.
9
12
 
10
- ## Install
13
+ ## Use
11
14
 
12
15
  ```bash
13
16
  npm install ngblock
14
17
  ```
15
18
 
16
- ## Button control
17
-
18
- Import `ButtonComponent` into the standalone component that uses it:
19
+ Import `ButtonTextComponent` into the standalone component that uses it:
19
20
 
20
21
  ```ts
21
22
  import { Component } from '@angular/core';
22
- import { ButtonComponent } from 'ngblock';
23
+ import { ButtonTextComponent } from 'ngblock';
23
24
 
24
25
  @Component({
25
26
  selector: 'app-example',
26
- imports: [ButtonComponent],
27
+ imports: [ButtonTextComponent],
27
28
  template: `
28
- <ngb-button (click)="save()">Save</ngb-button>
29
- <ngb-button type="submit" [disabled]="isSaving">Submit</ngb-button>
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>
30
31
  `,
31
32
  })
32
33
  export class ExampleComponent {
@@ -38,24 +39,6 @@ export class ExampleComponent {
38
39
  }
39
40
  ```
40
41
 
41
- `ButtonComponent` renders a native `<button>` and projects its content as the
42
- button label. Its selector is `ngb-button`.
43
-
44
- | Input | Type | Default | Description |
45
- | --- | --- | --- | --- |
46
- | `type` | `'button' \| 'submit' \| 'reset'` | `'button'` | Native button type. |
47
- | `disabled` | `boolean` | `false` | Disables the native button. |
48
-
49
- The control inherits its font and text color from its context, with basic
50
- padding, border, focus-visible, and disabled styles. Use the native `click`
51
- event to handle activation.
52
-
53
- ## Develop
54
-
55
- From the Nx workspace root:
56
-
57
- ```bash
58
- npx nx build ngblock
59
- npx nx test ngblock
60
- npx nx lint ngblock
61
- ```
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.3",
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;