ux4g-components-angular 1.0.0 → 1.1.0

package/README.md

@@ -0,0 +1,87 @@
+# ux4g-components-angular
+
+Angular wrapper components for the UX4G Design System.
+
+## Installation
+
+```bash
+npm install ux4g-components-angular ux4g-components-web
+```
+
+## Setup
+
+Add the CSS bundle to your `angular.json` styles array:
+
+```json
+{
+  "styles": [
+    "node_modules/ux4g-components-web/styles/ux4g.css",
+    "src/styles.css"
+  ]
+}
+```
+
+## Usage
+
+```ts
+// app.module.ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+
+@NgModule({
+  imports: [UX4GButtonModule, UX4GSpinnerModule],
+})
+export class AppModule {}
+```
+
+```html
+<!-- app.component.html -->
+<ux4g-button variant="primary" size="md" (buttonClick)="onSave()">
+  Save
+</ux4g-button>
+
+<ux4g-spinner variant="primary" size="md" type="full"></ux4g-spinner>
+```
+
+## Available Components (50)
+
+Each component is available as a sub-path import:
+
+```ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+import { UX4GBadgeModule } from 'ux4g-components-angular/badge';
+import { UX4GCardModule } from 'ux4g-components-angular/card';
+// ... and 46 more
+```
+
+Full list: `accessibility-bar`, `accordion`, `alert`, `avatar`, `badge`, `breadcrumb`, `button`, `card`, `carousel`, `checkbox`, `chip`, `chip-group`, `combobox`, `date-time-picker`, `divider`, `draft-status-banner`, `drawer`, `dropdown`, `empty-state`, `feedback`, `file-upload`, `footer`, `form-field-group`, `icon-button`, `image`, `input`, `journey-timeline`, `link`, `list`, `modal`, `navbar`, `otp-input`, `pagination`, `popover`, `progress-indicator`, `radio`, `result-list-row`, `search`, `sla-progress-indicator`, `slider`, `slot-grid`, `social-links`, `spinner`, `status-pipeline`, `stepper`, `switch`, `tab`, `table`, `tag`, `tooltip`
+
+## Architecture
+
+This package follows a CSS-first architecture:
+
+- **CSS is the source of truth** — all visual decisions live in CSS
+- **Wrappers are thin** — they map typed inputs to CSS class strings via `buildXxxClasses()` functions
+- **No inline styles, no CSS-in-JS** — only `[class]` bindings
+- **No local `types.ts` copies** — all Class_Builder functions are imported from `ux4g-components-web/types`
+
+## Compatibility
+
+- Angular >= 15.0.0
+- Built with Ivy partial compilation (compatible with Angular 15–19+)
+- `typesVersions` included for `moduleResolution: node` compatibility
+
+## Peer Dependencies
+
+- `@angular/core >= 15.0.0`
+- `@angular/common >= 15.0.0`
+
+## Related Packages
+
+- [`ux4g-components-web`](https://www.npmjs.com/package/ux4g-components-web) — CSS bundle and shared types (required)
+- [`ux4g-components-react`](https://www.npmjs.com/package/ux4g-components-react) — React wrapper components
+
+## License
+
+MIT

package/dist/accessibility-bar/README.md

@@ -0,0 +1,87 @@
+# ux4g-components-angular
+
+Angular wrapper components for the UX4G Design System.
+
+## Installation
+
+```bash
+npm install ux4g-components-angular ux4g-components-web
+```
+
+## Setup
+
+Add the CSS bundle to your `angular.json` styles array:
+
+```json
+{
+  "styles": [
+    "node_modules/ux4g-components-web/styles/ux4g.css",
+    "src/styles.css"
+  ]
+}
+```
+
+## Usage
+
+```ts
+// app.module.ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+
+@NgModule({
+  imports: [UX4GButtonModule, UX4GSpinnerModule],
+})
+export class AppModule {}
+```
+
+```html
+<!-- app.component.html -->
+<ux4g-button variant="primary" size="md" (buttonClick)="onSave()">
+  Save
+</ux4g-button>
+
+<ux4g-spinner variant="primary" size="md" type="full"></ux4g-spinner>
+```
+
+## Available Components (50)
+
+Each component is available as a sub-path import:
+
+```ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+import { UX4GBadgeModule } from 'ux4g-components-angular/badge';
+import { UX4GCardModule } from 'ux4g-components-angular/card';
+// ... and 46 more
+```
+
+Full list: `accessibility-bar`, `accordion`, `alert`, `avatar`, `badge`, `breadcrumb`, `button`, `card`, `carousel`, `checkbox`, `chip`, `chip-group`, `combobox`, `date-time-picker`, `divider`, `draft-status-banner`, `drawer`, `dropdown`, `empty-state`, `feedback`, `file-upload`, `footer`, `form-field-group`, `icon-button`, `image`, `input`, `journey-timeline`, `link`, `list`, `modal`, `navbar`, `otp-input`, `pagination`, `popover`, `progress-indicator`, `radio`, `result-list-row`, `search`, `sla-progress-indicator`, `slider`, `slot-grid`, `social-links`, `spinner`, `status-pipeline`, `stepper`, `switch`, `tab`, `table`, `tag`, `tooltip`
+
+## Architecture
+
+This package follows a CSS-first architecture:
+
+- **CSS is the source of truth** — all visual decisions live in CSS
+- **Wrappers are thin** — they map typed inputs to CSS class strings via `buildXxxClasses()` functions
+- **No inline styles, no CSS-in-JS** — only `[class]` bindings
+- **No local `types.ts` copies** — all Class_Builder functions are imported from `ux4g-components-web/types`
+
+## Compatibility
+
+- Angular >= 15.0.0
+- Built with Ivy partial compilation (compatible with Angular 15–19+)
+- `typesVersions` included for `moduleResolution: node` compatibility
+
+## Peer Dependencies
+
+- `@angular/core >= 15.0.0`
+- `@angular/common >= 15.0.0`
+
+## Related Packages
+
+- [`ux4g-components-web`](https://www.npmjs.com/package/ux4g-components-web) — CSS bundle and shared types (required)
+- [`ux4g-components-react`](https://www.npmjs.com/package/ux4g-components-react) — React wrapper components
+
+## License
+
+MIT

package/dist/accessibility-bar/fesm2022/ux4g-components-angular-accessibility-bar.mjs

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 import * as i0 from '@angular/core';
 import { ViewEncapsulation, Component, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';

package/dist/accessibility-bar/fesm2022/ux4g-components-angular-accessibility-bar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ux4g-components-angular-accessibility-bar.mjs","sources":["../../../src/accessibility-bar/ux4g-accessibility-bar.component.ts","../../../src/accessibility-bar/ux4g-accessibility-bar.module.ts","../../../src/accessibility-bar/ux4g-components-angular-accessibility-bar.ts"],"sourcesContent":["import { Component, ViewEncapsulation } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'ux4g-accessibility-bar',\r\n  standalone: false,\r\n  template: `<div [className]=\"accessibilityBarClasses\"><ng-content></ng-content></div>`,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAccessibilityBarComponent {\r\n  get accessibilityBarClasses(): string {\r\n    return 'ux4g-topbar';\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAccessibilityBarComponent } from './ux4g-accessibility-bar.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAccessibilityBarComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAccessibilityBarComponent],\r\n})\r\nexport class UX4GAccessibilityBarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAQa,6BAA6B,CAAA;AACxC,IAAA,IAAI,uBAAuB,GAAA;AACzB,QAAA,OAAO,aAAa;IACtB;+GAHW,6BAA6B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA7B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,6BAA6B,mFAH9B,CAAA,0EAAA,CAA4E,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAG3E,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBANzC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,wBAAwB;AAClC,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA,0EAAA,CAA4E;oBACtF,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;;;MCEY,0BAA0B,CAAA;+GAA1B,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAA1B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,0BAA0B,EAAA,YAAA,EAAA,CAJtB,6BAA6B,CAAA,EAAA,OAAA,EAAA,CAClC,YAAY,aACZ,6BAA6B,CAAA,EAAA,CAAA,CAAA;AAE5B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,0BAA0B,YAH3B,YAAY,CAAA,EAAA,CAAA,CAAA;;4FAGX,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBALtC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,6BAA6B,CAAC;oBAC7C,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,6BAA6B,CAAC;AACzC,iBAAA;;;ACRD;;AAEG;;;;"}
+{"version":3,"file":"ux4g-components-angular-accessibility-bar.mjs","sources":["../../../src/accessibility-bar/ux4g-accessibility-bar.component.ts","../../../src/accessibility-bar/ux4g-accessibility-bar.module.ts","../../../src/accessibility-bar/ux4g-components-angular-accessibility-bar.ts"],"sourcesContent":["import { Component, ViewEncapsulation } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'ux4g-accessibility-bar',\r\n  standalone: false,\r\n  template: `<div [className]=\"accessibilityBarClasses\"><ng-content></ng-content></div>`,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAccessibilityBarComponent {\r\n  get accessibilityBarClasses(): string {\r\n    return 'ux4g-topbar';\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAccessibilityBarComponent } from './ux4g-accessibility-bar.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAccessibilityBarComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAccessibilityBarComponent],\r\n})\r\nexport class UX4GAccessibilityBarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAQa,6BAA6B,CAAA;AACxC,IAAA,IAAI,uBAAuB,GAAA;AACzB,QAAA,OAAO,aAAa;IACtB;+GAHW,6BAA6B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA7B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,6BAA6B,mFAH9B,CAAA,0EAAA,CAA4E,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAG3E,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBANzC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,wBAAwB;AAClC,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA,0EAAA,CAA4E;oBACtF,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;;;MCEY,0BAA0B,CAAA;+GAA1B,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAA1B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,0BAA0B,EAAA,YAAA,EAAA,CAJtB,6BAA6B,CAAA,EAAA,OAAA,EAAA,CAClC,YAAY,aACZ,6BAA6B,CAAA,EAAA,CAAA,CAAA;AAE5B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,0BAA0B,YAH3B,YAAY,CAAA,EAAA,CAAA,CAAA;;4FAGX,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBALtC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,6BAA6B,CAAC;oBAC7C,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,6BAA6B,CAAC;AACzC,iBAAA;;;ACRD;;AAEG;;;;"}

package/dist/accessibility-bar/public-api.d.ts

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 export { UX4GAccessibilityBarComponent } from './ux4g-accessibility-bar.component';
 export { UX4GAccessibilityBarModule } from './ux4g-accessibility-bar.module';
 //# sourceMappingURL=public-api.d.ts.map

package/dist/accessibility-bar/public-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/accessibility-bar/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC"}
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/accessibility-bar/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,uCAAuC,CAAC;AAC/C,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC"}

package/dist/accordion/README.md

@@ -0,0 +1,87 @@
+# ux4g-components-angular
+
+Angular wrapper components for the UX4G Design System.
+
+## Installation
+
+```bash
+npm install ux4g-components-angular ux4g-components-web
+```
+
+## Setup
+
+Add the CSS bundle to your `angular.json` styles array:
+
+```json
+{
+  "styles": [
+    "node_modules/ux4g-components-web/styles/ux4g.css",
+    "src/styles.css"
+  ]
+}
+```
+
+## Usage
+
+```ts
+// app.module.ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+
+@NgModule({
+  imports: [UX4GButtonModule, UX4GSpinnerModule],
+})
+export class AppModule {}
+```
+
+```html
+<!-- app.component.html -->
+<ux4g-button variant="primary" size="md" (buttonClick)="onSave()">
+  Save
+</ux4g-button>
+
+<ux4g-spinner variant="primary" size="md" type="full"></ux4g-spinner>
+```
+
+## Available Components (50)
+
+Each component is available as a sub-path import:
+
+```ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+import { UX4GBadgeModule } from 'ux4g-components-angular/badge';
+import { UX4GCardModule } from 'ux4g-components-angular/card';
+// ... and 46 more
+```
+
+Full list: `accessibility-bar`, `accordion`, `alert`, `avatar`, `badge`, `breadcrumb`, `button`, `card`, `carousel`, `checkbox`, `chip`, `chip-group`, `combobox`, `date-time-picker`, `divider`, `draft-status-banner`, `drawer`, `dropdown`, `empty-state`, `feedback`, `file-upload`, `footer`, `form-field-group`, `icon-button`, `image`, `input`, `journey-timeline`, `link`, `list`, `modal`, `navbar`, `otp-input`, `pagination`, `popover`, `progress-indicator`, `radio`, `result-list-row`, `search`, `sla-progress-indicator`, `slider`, `slot-grid`, `social-links`, `spinner`, `status-pipeline`, `stepper`, `switch`, `tab`, `table`, `tag`, `tooltip`
+
+## Architecture
+
+This package follows a CSS-first architecture:
+
+- **CSS is the source of truth** — all visual decisions live in CSS
+- **Wrappers are thin** — they map typed inputs to CSS class strings via `buildXxxClasses()` functions
+- **No inline styles, no CSS-in-JS** — only `[class]` bindings
+- **No local `types.ts` copies** — all Class_Builder functions are imported from `ux4g-components-web/types`
+
+## Compatibility
+
+- Angular >= 15.0.0
+- Built with Ivy partial compilation (compatible with Angular 15–19+)
+- `typesVersions` included for `moduleResolution: node` compatibility
+
+## Peer Dependencies
+
+- `@angular/core >= 15.0.0`
+- `@angular/common >= 15.0.0`
+
+## Related Packages
+
+- [`ux4g-components-web`](https://www.npmjs.com/package/ux4g-components-web) — CSS bundle and shared types (required)
+- [`ux4g-components-react`](https://www.npmjs.com/package/ux4g-components-react) — React wrapper components
+
+## License
+
+MIT

package/dist/accordion/fesm2022/ux4g-components-angular-accordion.mjs

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 import * as i0 from '@angular/core';
 import { Input, ViewEncapsulation, Component, NgModule } from '@angular/core';
 import { buildAccordionClasses } from 'ux4g-components-web/types';

package/dist/accordion/fesm2022/ux4g-components-angular-accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ux4g-components-angular-accordion.mjs","sources":["../../../src/accordion/ux4g-accordion.component.ts","../../../src/accordion/ux4g-accordion.module.ts","../../../src/accordion/ux4g-components-angular-accordion.ts"],"sourcesContent":["import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AccordionArrowPosition, AccordionVariant, buildAccordionClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-accordion',\r\n  standalone: false,\r\n  template: `<div [className]=\"accordionClasses\"><ng-content></ng-content></div>`,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAccordionComponent {\r\n  @Input() arrowPosition: AccordionArrowPosition = 'right';\r\n  @Input() variant: AccordionVariant = 'default';\r\n\r\n  get accordionClasses(): string {\r\n    return buildAccordionClasses(this.arrowPosition, this.variant);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAccordionComponent } from './ux4g-accordion.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAccordionComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAccordionComponent],\r\n})\r\nexport class UX4GAccordionModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MASa,sBAAsB,CAAA;AANnC,IAAA,WAAA,GAAA;QAOW,IAAA,CAAA,aAAa,GAA2B,OAAO;QAC/C,IAAA,CAAA,OAAO,GAAqB,SAAS;AAK/C,IAAA;AAHC,IAAA,IAAI,gBAAgB,GAAA;QAClB,OAAO,qBAAqB,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC;IAChE;+GANW,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,2IAHvB,CAAA,mEAAA,CAAqE,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAGpE,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBANlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA,mEAAA,CAAqE;oBAC/E,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;8BAEU,aAAa,EAAA,CAAA;sBAArB;gBACQ,OAAO,EAAA,CAAA;sBAAf;;;MCFU,mBAAmB,CAAA;+GAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,mBAAmB,EAAA,YAAA,EAAA,CAJf,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAC3B,YAAY,aACZ,sBAAsB,CAAA,EAAA,CAAA,CAAA;AAErB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,mBAAmB,YAHpB,YAAY,CAAA,EAAA,CAAA,CAAA;;4FAGX,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAL/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,sBAAsB,CAAC;oBACtC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,sBAAsB,CAAC;AAClC,iBAAA;;;ACRD;;AAEG;;;;"}
+{"version":3,"file":"ux4g-components-angular-accordion.mjs","sources":["../../../src/accordion/ux4g-accordion.component.ts","../../../src/accordion/ux4g-accordion.module.ts","../../../src/accordion/ux4g-components-angular-accordion.ts"],"sourcesContent":["import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AccordionArrowPosition, AccordionVariant, buildAccordionClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-accordion',\r\n  standalone: false,\r\n  template: `<div [className]=\"accordionClasses\"><ng-content></ng-content></div>`,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAccordionComponent {\r\n  @Input() arrowPosition: AccordionArrowPosition = 'right';\r\n  @Input() variant: AccordionVariant = 'default';\r\n\r\n  get accordionClasses(): string {\r\n    return buildAccordionClasses(this.arrowPosition, this.variant);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAccordionComponent } from './ux4g-accordion.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAccordionComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAccordionComponent],\r\n})\r\nexport class UX4GAccordionModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MASa,sBAAsB,CAAA;AANnC,IAAA,WAAA,GAAA;QAOW,IAAA,CAAA,aAAa,GAA2B,OAAO;QAC/C,IAAA,CAAA,OAAO,GAAqB,SAAS;AAK/C,IAAA;AAHC,IAAA,IAAI,gBAAgB,GAAA;QAClB,OAAO,qBAAqB,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC;IAChE;+GANW,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,2IAHvB,CAAA,mEAAA,CAAqE,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAGpE,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBANlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA,mEAAA,CAAqE;oBAC/E,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;8BAEU,aAAa,EAAA,CAAA;sBAArB;gBACQ,OAAO,EAAA,CAAA;sBAAf;;;MCFU,mBAAmB,CAAA;+GAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,mBAAmB,EAAA,YAAA,EAAA,CAJf,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAC3B,YAAY,aACZ,sBAAsB,CAAA,EAAA,CAAA,CAAA;AAErB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,mBAAmB,YAHpB,YAAY,CAAA,EAAA,CAAA,CAAA;;4FAGX,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAL/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,sBAAsB,CAAC;oBACtC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,sBAAsB,CAAC;AAClC,iBAAA;;;ACRD;;AAEG;;;;"}

package/dist/accordion/public-api.d.ts

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 export { UX4GAccordionComponent } from './ux4g-accordion.component';
 export { UX4GAccordionModule } from './ux4g-accordion.module';
 export { AccordionArrowPosition, AccordionVariant, buildAccordionClasses } from 'ux4g-components-web/types';

package/dist/accordion/public-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/accordion/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/accordion/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,uCAAuC,CAAC;AAC/C,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/alert/README.md

@@ -0,0 +1,87 @@
+# ux4g-components-angular
+
+Angular wrapper components for the UX4G Design System.
+
+## Installation
+
+```bash
+npm install ux4g-components-angular ux4g-components-web
+```
+
+## Setup
+
+Add the CSS bundle to your `angular.json` styles array:
+
+```json
+{
+  "styles": [
+    "node_modules/ux4g-components-web/styles/ux4g.css",
+    "src/styles.css"
+  ]
+}
+```
+
+## Usage
+
+```ts
+// app.module.ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+
+@NgModule({
+  imports: [UX4GButtonModule, UX4GSpinnerModule],
+})
+export class AppModule {}
+```
+
+```html
+<!-- app.component.html -->
+<ux4g-button variant="primary" size="md" (buttonClick)="onSave()">
+  Save
+</ux4g-button>
+
+<ux4g-spinner variant="primary" size="md" type="full"></ux4g-spinner>
+```
+
+## Available Components (50)
+
+Each component is available as a sub-path import:
+
+```ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+import { UX4GBadgeModule } from 'ux4g-components-angular/badge';
+import { UX4GCardModule } from 'ux4g-components-angular/card';
+// ... and 46 more
+```
+
+Full list: `accessibility-bar`, `accordion`, `alert`, `avatar`, `badge`, `breadcrumb`, `button`, `card`, `carousel`, `checkbox`, `chip`, `chip-group`, `combobox`, `date-time-picker`, `divider`, `draft-status-banner`, `drawer`, `dropdown`, `empty-state`, `feedback`, `file-upload`, `footer`, `form-field-group`, `icon-button`, `image`, `input`, `journey-timeline`, `link`, `list`, `modal`, `navbar`, `otp-input`, `pagination`, `popover`, `progress-indicator`, `radio`, `result-list-row`, `search`, `sla-progress-indicator`, `slider`, `slot-grid`, `social-links`, `spinner`, `status-pipeline`, `stepper`, `switch`, `tab`, `table`, `tag`, `tooltip`
+
+## Architecture
+
+This package follows a CSS-first architecture:
+
+- **CSS is the source of truth** — all visual decisions live in CSS
+- **Wrappers are thin** — they map typed inputs to CSS class strings via `buildXxxClasses()` functions
+- **No inline styles, no CSS-in-JS** — only `[class]` bindings
+- **No local `types.ts` copies** — all Class_Builder functions are imported from `ux4g-components-web/types`
+
+## Compatibility
+
+- Angular >= 15.0.0
+- Built with Ivy partial compilation (compatible with Angular 15–19+)
+- `typesVersions` included for `moduleResolution: node` compatibility
+
+## Peer Dependencies
+
+- `@angular/core >= 15.0.0`
+- `@angular/common >= 15.0.0`
+
+## Related Packages
+
+- [`ux4g-components-web`](https://www.npmjs.com/package/ux4g-components-web) — CSS bundle and shared types (required)
+- [`ux4g-components-react`](https://www.npmjs.com/package/ux4g-components-react) — React wrapper components
+
+## License
+
+MIT

package/dist/alert/fesm2022/ux4g-components-angular-alert.mjs

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 import * as i0 from '@angular/core';
 import { Input, ViewEncapsulation, Component, NgModule } from '@angular/core';
 import { buildContextAlertClasses, buildAlertClasses, buildAlertContainerClasses } from 'ux4g-components-web/types';

package/dist/alert/fesm2022/ux4g-components-angular-alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ux4g-components-angular-alert.mjs","sources":["../../../src/alert/ux4g-alert.component.ts","../../../src/alert/ux4g-alert-container.component.ts","../../../src/alert/ux4g-alert.module.ts","../../../src/alert/ux4g-components-angular-alert.ts"],"sourcesContent":["import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AlertVariant, AlertLayout, buildAlertClasses, buildContextAlertClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-alert',\r\n  standalone: false,\r\n  template: `\r\n    <div [className]=\"alertClasses\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  `,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAlertComponent {\r\n  @Input() variant: AlertVariant = 'info';\r\n  @Input() toast: boolean = false;\r\n  @Input() layout: AlertLayout = 'fluid';\r\n\r\n  get alertClasses(): string {\r\n    return this.toast\r\n      ? buildContextAlertClasses(this.variant)\r\n      : buildAlertClasses(this.variant, this.layout);\r\n  }\r\n}\r\n","import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AlertPosition, buildAlertContainerClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-alert-container',\r\n  standalone: false,\r\n  template: `\r\n    <div [className]=\"containerClasses\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  `,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAlertContainerComponent {\r\n  @Input() position: AlertPosition = 'top-right';\r\n\r\n  get containerClasses(): string {\r\n    return buildAlertContainerClasses(this.position);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAlertComponent } from './ux4g-alert.component';\r\nimport { UX4GAlertContainerComponent } from './ux4g-alert-container.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAlertComponent, UX4GAlertContainerComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAlertComponent, UX4GAlertContainerComponent],\r\n})\r\nexport class UX4GAlertModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ux4g-components-angular-alert.mjs","sources":["../../../src/alert/ux4g-alert.component.ts","../../../src/alert/ux4g-alert-container.component.ts","../../../src/alert/ux4g-alert.module.ts","../../../src/alert/ux4g-components-angular-alert.ts"],"sourcesContent":["import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AlertVariant, AlertLayout, buildAlertClasses, buildContextAlertClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-alert',\r\n  standalone: false,\r\n  template: `\r\n    <div [className]=\"alertClasses\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  `,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAlertComponent {\r\n  @Input() variant: AlertVariant = 'info';\r\n  @Input() toast: boolean = false;\r\n  @Input() layout: AlertLayout = 'fluid';\r\n\r\n  get alertClasses(): string {\r\n    return this.toast\r\n      ? buildContextAlertClasses(this.variant)\r\n      : buildAlertClasses(this.variant, this.layout);\r\n  }\r\n}\r\n","import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AlertPosition, buildAlertContainerClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-alert-container',\r\n  standalone: false,\r\n  template: `\r\n    <div [className]=\"containerClasses\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  `,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAlertContainerComponent {\r\n  @Input() position: AlertPosition = 'top-right';\r\n\r\n  get containerClasses(): string {\r\n    return buildAlertContainerClasses(this.position);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAlertComponent } from './ux4g-alert.component';\r\nimport { UX4GAlertContainerComponent } from './ux4g-alert-container.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAlertComponent, UX4GAlertContainerComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAlertComponent, UX4GAlertContainerComponent],\r\n})\r\nexport class UX4GAlertModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/dist/alert/public-api.d.ts

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 export { UX4GAlertComponent } from './ux4g-alert.component';
 export { UX4GAlertContainerComponent } from './ux4g-alert-container.component';
 export { UX4GAlertModule } from './ux4g-alert.module';

package/dist/alert/public-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/alert/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/alert/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,uCAAuC,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/avatar/README.md

@@ -0,0 +1,87 @@
+# ux4g-components-angular
+
+Angular wrapper components for the UX4G Design System.
+
+## Installation
+
+```bash
+npm install ux4g-components-angular ux4g-components-web
+```
+
+## Setup
+
+Add the CSS bundle to your `angular.json` styles array:
+
+```json
+{
+  "styles": [
+    "node_modules/ux4g-components-web/styles/ux4g.css",
+    "src/styles.css"
+  ]
+}
+```
+
+## Usage
+
+```ts
+// app.module.ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+
+@NgModule({
+  imports: [UX4GButtonModule, UX4GSpinnerModule],
+})
+export class AppModule {}
+```
+
+```html
+<!-- app.component.html -->
+<ux4g-button variant="primary" size="md" (buttonClick)="onSave()">
+  Save
+</ux4g-button>
+
+<ux4g-spinner variant="primary" size="md" type="full"></ux4g-spinner>
+```
+
+## Available Components (50)
+
+Each component is available as a sub-path import:
+
+```ts
+import { UX4GButtonModule } from 'ux4g-components-angular/button';
+import { UX4GSpinnerModule } from 'ux4g-components-angular/spinner';
+import { UX4GBadgeModule } from 'ux4g-components-angular/badge';
+import { UX4GCardModule } from 'ux4g-components-angular/card';
+// ... and 46 more
+```
+
+Full list: `accessibility-bar`, `accordion`, `alert`, `avatar`, `badge`, `breadcrumb`, `button`, `card`, `carousel`, `checkbox`, `chip`, `chip-group`, `combobox`, `date-time-picker`, `divider`, `draft-status-banner`, `drawer`, `dropdown`, `empty-state`, `feedback`, `file-upload`, `footer`, `form-field-group`, `icon-button`, `image`, `input`, `journey-timeline`, `link`, `list`, `modal`, `navbar`, `otp-input`, `pagination`, `popover`, `progress-indicator`, `radio`, `result-list-row`, `search`, `sla-progress-indicator`, `slider`, `slot-grid`, `social-links`, `spinner`, `status-pipeline`, `stepper`, `switch`, `tab`, `table`, `tag`, `tooltip`
+
+## Architecture
+
+This package follows a CSS-first architecture:
+
+- **CSS is the source of truth** — all visual decisions live in CSS
+- **Wrappers are thin** — they map typed inputs to CSS class strings via `buildXxxClasses()` functions
+- **No inline styles, no CSS-in-JS** — only `[class]` bindings
+- **No local `types.ts` copies** — all Class_Builder functions are imported from `ux4g-components-web/types`
+
+## Compatibility
+
+- Angular >= 15.0.0
+- Built with Ivy partial compilation (compatible with Angular 15–19+)
+- `typesVersions` included for `moduleResolution: node` compatibility
+
+## Peer Dependencies
+
+- `@angular/core >= 15.0.0`
+- `@angular/common >= 15.0.0`
+
+## Related Packages
+
+- [`ux4g-components-web`](https://www.npmjs.com/package/ux4g-components-web) — CSS bundle and shared types (required)
+- [`ux4g-components-react`](https://www.npmjs.com/package/ux4g-components-react) — React wrapper components
+
+## License
+
+MIT

package/dist/avatar/fesm2022/ux4g-components-angular-avatar.mjs

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 import * as i0 from '@angular/core';
 import { Input, ViewEncapsulation, Component, NgModule } from '@angular/core';
 import { buildAvatarClasses } from 'ux4g-components-web/types';

package/dist/avatar/fesm2022/ux4g-components-angular-avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ux4g-components-angular-avatar.mjs","sources":["../../../src/avatar/ux4g-avatar.component.ts","../../../src/avatar/ux4g-avatar.module.ts","../../../src/avatar/ux4g-components-angular-avatar.ts"],"sourcesContent":["import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AvatarType, AvatarSize, buildAvatarClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-avatar',\r\n  standalone: false,\r\n  template: `<div [class]=\"avatarClasses\"><ng-content></ng-content></div>`,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAvatarComponent {\r\n  @Input() avatarType: AvatarType = 'status';\r\n  @Input() size?: AvatarSize;\r\n\r\n  get avatarClasses(): string {\r\n    return buildAvatarClasses(this.avatarType, this.size);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAvatarComponent } from './ux4g-avatar.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAvatarComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAvatarComponent],\r\n})\r\nexport class UX4GAvatarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MASa,mBAAmB,CAAA;AANhC,IAAA,WAAA,GAAA;QAOW,IAAA,CAAA,UAAU,GAAe,QAAQ;AAM3C,IAAA;AAHC,IAAA,IAAI,aAAa,GAAA;QACf,OAAO,kBAAkB,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC;IACvD;+GANW,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,mBAAmB,4HAHpB,CAAA,4DAAA,CAA8D,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAG7D,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAN/B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,aAAa;AACvB,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA,4DAAA,CAA8D;oBACxE,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;8BAEU,UAAU,EAAA,CAAA;sBAAlB;gBACQ,IAAI,EAAA,CAAA;sBAAZ;;;MCFU,gBAAgB,CAAA;+GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,CAJZ,mBAAmB,CAAA,EAAA,OAAA,EAAA,CACxB,YAAY,aACZ,mBAAmB,CAAA,EAAA,CAAA,CAAA;AAElB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,YAHjB,YAAY,CAAA,EAAA,CAAA,CAAA;;4FAGX,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAL5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,mBAAmB,CAAC;oBACnC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,mBAAmB,CAAC;AAC/B,iBAAA;;;ACRD;;AAEG;;;;"}
+{"version":3,"file":"ux4g-components-angular-avatar.mjs","sources":["../../../src/avatar/ux4g-avatar.component.ts","../../../src/avatar/ux4g-avatar.module.ts","../../../src/avatar/ux4g-components-angular-avatar.ts"],"sourcesContent":["import { Component, Input, ViewEncapsulation } from '@angular/core';\r\nimport { AvatarType, AvatarSize, buildAvatarClasses } from 'ux4g-components-web/types';\r\n\r\n@Component({\r\n  selector: 'ux4g-avatar',\r\n  standalone: false,\r\n  template: `<div [class]=\"avatarClasses\"><ng-content></ng-content></div>`,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class UX4GAvatarComponent {\r\n  @Input() avatarType: AvatarType = 'status';\r\n  @Input() size?: AvatarSize;\r\n\r\n  get avatarClasses(): string {\r\n    return buildAvatarClasses(this.avatarType, this.size);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { UX4GAvatarComponent } from './ux4g-avatar.component';\r\n\r\n@NgModule({\r\n  declarations: [UX4GAvatarComponent],\r\n  imports: [CommonModule],\r\n  exports: [UX4GAvatarComponent],\r\n})\r\nexport class UX4GAvatarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MASa,mBAAmB,CAAA;AANhC,IAAA,WAAA,GAAA;QAOW,IAAA,CAAA,UAAU,GAAe,QAAQ;AAM3C,IAAA;AAHC,IAAA,IAAI,aAAa,GAAA;QACf,OAAO,kBAAkB,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC;IACvD;+GANW,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,mBAAmB,4HAHpB,CAAA,4DAAA,CAA8D,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAG7D,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAN/B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,aAAa;AACvB,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA,4DAAA,CAA8D;oBACxE,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;8BAEU,UAAU,EAAA,CAAA;sBAAlB;gBACQ,IAAI,EAAA,CAAA;sBAAZ;;;MCFU,gBAAgB,CAAA;+GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,CAJZ,mBAAmB,CAAA,EAAA,OAAA,EAAA,CACxB,YAAY,aACZ,mBAAmB,CAAA,EAAA,CAAA,CAAA;AAElB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,YAHjB,YAAY,CAAA,EAAA,CAAA,CAAA;;4FAGX,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAL5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,mBAAmB,CAAC;oBACnC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,mBAAmB,CAAC;AAC/B,iBAAA;;;ACRD;;AAEG;;;;"}

package/dist/avatar/public-api.d.ts

@@ -1,3 +1,4 @@
+import 'ux4g-components-web/runtime/bootstrap';
 export { UX4GAvatarComponent } from './ux4g-avatar.component';
 export { UX4GAvatarModule } from './ux4g-avatar.module';
 export { AvatarType, AvatarSize } from 'ux4g-components-web/types';

package/dist/avatar/public-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/avatar/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../src/avatar/public-api.ts"],"names":[],"mappings":"AAAA,OAAO,uCAAuC,CAAC;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC"}