@open-rlb/ng-bootstrap 3.3.19 → 3.3.21

package/README.md

@@ -1,24 +1,74 @@
-# NgBootstrap
+# @open-rlb/ng-bootstrap
 
-This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 16.1.0.
+Angular 21 component library built on Bootstrap 5.3 (signals, OnPush), with timezone-aware
+date handling via [`@open-rlb/date-tz`](https://www.npmjs.com/package/@open-rlb/date-tz).
 
-## Code scaffolding
+## Installation
 
-Run `ng generate component component-name --project ng-bootstrap` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ng-bootstrap`.
-> Note: Don't forget to add `--project ng-bootstrap` or else it will be added to the default project in your `angular.json` file. 
+### Recommended — `ng add`
 
-## Build
+```bash
+ng add @open-rlb/ng-bootstrap
+```
 
-Run `ng build ng-bootstrap` to build the project. The build artifacts will be stored in the `dist/` directory.
+The schematic will:
 
-## Publishing
+- install the required dependencies (`bootstrap`, `bootstrap-icons`, `@open-rlb/date-tz`,
+  `@ngx-translate/core`, `@angular/cdk`, and `@types/bootstrap`) at compatible versions;
+- register the Bootstrap and Bootstrap Icons stylesheets in `angular.json`;
+- add `provideRlbBootstrap()` to your application providers;
+- scaffold a `RlbStarterComponent` (`src/app/rlb-starter/`) you can render to verify the setup
+  (pass `--skip-starter` to opt out).
+
+### Manual
+
+```bash
+npm install @open-rlb/ng-bootstrap
+```
+
+When installed this way, npm pulls the declared peer dependencies automatically (npm 7+).
+Then register the providers and styles yourself:
+
+```typescript
+// app.config.ts
+import { provideRlbBootstrap } from '@open-rlb/ng-bootstrap';
 
-After building your library with `ng build ng-bootstrap`, go to the dist folder `cd dist/ng-bootstrap` and run `npm publish`.
+export const appConfig: ApplicationConfig = {
+  providers: [provideRlbBootstrap()],
+};
+```
 
-## Running unit tests
+```jsonc
+// angular.json → projects.<app>.architect.build.options.styles
+"styles": [
+  "node_modules/bootstrap/dist/css/bootstrap.min.css",
+  "node_modules/bootstrap-icons/font/bootstrap-icons.css",
+  "src/styles.scss"
+]
+```
 
-Run `ng test ng-bootstrap` to execute the unit tests via [Karma](https://karma-runner.github.io).
+## Usage
 
-## Further help
+```html
+<rlb-card>
+  <rlb-card-header>Hello</rlb-card-header>
+  <rlb-card-body>
+    <button rlb-button color="primary">Click me</button>
+  </rlb-card-body>
+</rlb-card>
+```
+
+## Development
+
+- `npm run lib:build` — builds the library **and** its `ng-add` schematics into `dist/rlb/ng-bootstrap`.
+- `npm run lib:test:ng-add` — runs an isolated, in-memory check of the `ng-add` schematic
+  (requires a prior `lib:build`).
+- `npm run lib:pack` — builds and packs a publishable tarball.
+
+## Publishing
 
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+```bash
+npm run lib:build
+cd dist/rlb/ng-bootstrap
+npm publish
+```

package/fesm2022/open-rlb-ng-bootstrap.mjs

@@ -5173,6 +5173,24 @@ class PaginationItemComponent {
         this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'disabled', transform: booleanAttribute });
         this.active = input(false, { ...(ngDevMode ? { debugName: "active" } : /* istanbul ignore next */ {}), alias: 'active', transform: booleanAttribute });
         this.cssClass = input('', { ...(ngDevMode ? { debugName: "cssClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+        this.itemClick = output();
+    }
+    onActivate(event) {
+        if (this.disabled()) {
+            event.preventDefault();
+            return;
+        }
+        this.itemClick.emit();
+    }
+    onKeydown(event) {
+        if (event.key !== 'Enter' && event.key !== ' ' && event.key !== 'Spacebar') {
+            return;
+        }
+        event.preventDefault();
+        if (this.disabled()) {
+            return;
+        }
+        this.itemClick.emit();
     }
     ngOnInit() {
         const templateView = this.viewContainerRef.createEmbeddedView(this.template());
@@ -5180,7 +5198,7 @@ class PaginationItemComponent {
         this.viewContainerRef.element.nativeElement.remove();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: PaginationItemComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.16", type: PaginationItemComponent, isStandalone: true, selector: "rlb-pagination-item", inputs: { isIcon: { classPropertyName: "isIcon", publicName: "isIcon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, cssClass: { classPropertyName: "cssClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.16", type: PaginationItemComponent, isStandalone: true, selector: "rlb-pagination-item", inputs: { isIcon: { classPropertyName: "isIcon", publicName: "isIcon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, cssClass: { classPropertyName: "cssClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template #template>
       <li
         class="page-item {{ cssClass() }}"
@@ -5189,7 +5207,13 @@ class PaginationItemComponent {
       >
         <a
           class="page-link d-block"
+          role="button"
+          [attr.tabindex]="disabled() ? -1 : 0"
+          [attr.aria-disabled]="disabled() ? true : null"
+          [attr.aria-current]="active() ? 'page' : null"
           [style.cursor]="disabled() ? 'default' : 'pointer'"
+          (click)="onActivate($event)"
+          (keydown)="onKeydown($event)"
         >
           <ng-container *ngTemplateOutlet="content"></ng-container>
         </a>
@@ -5211,7 +5235,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
       >
         <a
           class="page-link d-block"
+          role="button"
+          [attr.tabindex]="disabled() ? -1 : 0"
+          [attr.aria-disabled]="disabled() ? true : null"
+          [attr.aria-current]="active() ? 'page' : null"
           [style.cursor]="disabled() ? 'default' : 'pointer'"
+          (click)="onActivate($event)"
+          (keydown)="onKeydown($event)"
         >
           <ng-container *ngTemplateOutlet="content"></ng-container>
         </a>
@@ -5222,7 +5252,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [NgTemplateOutlet],
                 }]
-        }], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { template: [{ type: i0.ViewChild, args: ['template', { isSignal: true }] }], isIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "isIcon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], cssClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+        }], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { template: [{ type: i0.ViewChild, args: ['template', { isSignal: true }] }], isIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "isIcon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], cssClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
 
 class PaginationComponent {
     constructor(viewContainerRef) {