@ardium-ui/ui 5.0.0-alpha.11 → 5.0.0-alpha.13

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 (12) hide show
  1. package/fesm2022/ardium-ui-ui.mjs +46 -14
  2. package/fesm2022/ardium-ui-ui.mjs.map +1 -1
  3. package/lib/tabber/index.d.ts +2 -0
  4. package/lib/tabber/tab/tab.component.d.ts +3 -2
  5. package/lib/tabber/tabber.component.d.ts +10 -2
  6. package/lib/tabber/tabber.directives.d.ts +9 -0
  7. package/lib/tabber/tabber.module.d.ts +3 -2
  8. package/lib/tabber/tabber.types.d.ts +5 -0
  9. package/package.json +1 -1
  10. package/prebuilt-themes/default/chips.css +9 -4
  11. package/prebuilt-themes/default/chips.css.map +1 -1
  12. package/themes/default/chips.scss +11 -11
package/lib/tabber/index.d.ts CHANGED
@@ -2,4 +2,6 @@ export * from './tab/tab.component';
2
2
  export * from './tab/tab.defaults';
3
3
  export * from './tabber.component';
4
4
  export * from './tabber.defaults';
5
+ export * from './tabber.directives';
5
6
  export * from './tabber.module';
7
+ export * from './tabber.types';
package/lib/tabber/tab/tab.component.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import { TemplateRef } from '@angular/core';
1
2
  import { BooleanLike } from '@ardium-ui/devkit';
2
3
  import * as i0 from "@angular/core";
3
4
  export declare class ArdiumTabComponent {
@@ -9,8 +10,8 @@ export declare class ArdiumTabComponent {
9
10
  get _selectedHostAttribute(): boolean;
10
11
  private _emitChange;
11
12
  readonly focused: import("@angular/core").WritableSignal<boolean>;
12
- readonly _label: import("@angular/core").InputSignal<string | null>;
13
- readonly label: import("@angular/core").Signal<string>;
13
+ readonly _label: import("@angular/core").InputSignal<string | TemplateRef<any> | null>;
14
+ readonly label: import("@angular/core").Signal<string | TemplateRef<any>>;
14
15
  readonly tabId: import("@angular/core").InputSignal<string>;
15
16
  readonly focusEvent: import("@angular/core").OutputEmitterRef<void>;
16
17
  readonly blurEvent: import("@angular/core").OutputEmitterRef<void>;
package/lib/tabber/tabber.component.d.ts CHANGED
@@ -1,8 +1,10 @@
1
- import { AfterContentInit } from '@angular/core';
1
+ import { AfterContentInit, TemplateRef } from '@angular/core';
2
2
  import { BooleanLike } from '@ardium-ui/devkit';
3
3
  import { OneAxisAlignment } from '../types/alignment.types';
4
4
  import { ComponentColor } from '../types/colors.types';
5
5
  import { ArdiumTabComponent } from './tab/tab.component';
6
+ import { ArdTabberLabelTemplateDirective } from './tabber.directives';
7
+ import { TabberLabelContext } from './tabber.types';
6
8
  import * as i0 from "@angular/core";
7
9
  export declare class ArdiumTabberComponent implements AfterContentInit {
8
10
  protected readonly _DEFAULTS: import("./tabber.defaults").ArdTabberDefaults;
@@ -24,6 +26,12 @@ export declare class ArdiumTabberComponent implements AfterContentInit {
24
26
  readonly tabAlignment: import("@angular/core").InputSignal<OneAxisAlignment>;
25
27
  readonly tabContainerClasses: import("@angular/core").Signal<string>;
26
28
  readonly tabIndex: import("@angular/core").InputSignal<string | number>;
29
+ readonly labelTemplate: import("@angular/core").Signal<ArdTabberLabelTemplateDirective | undefined>;
30
+ readonly tabsWithTemplates: import("@angular/core").Signal<{
31
+ tab: ArdiumTabComponent;
32
+ template: TemplateRef<any> | null;
33
+ templateContext: TabberLabelContext | null;
34
+ }[]>;
27
35
  static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumTabberComponent, never>;
28
- static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumTabberComponent, "ard-tabber", never, { "initialTab": { "alias": "initialTab"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "stretchTabs": { "alias": "stretchTabs"; "required": false; "isSignal": true; }; "uniformTabWidths": { "alias": "uniformTabWidths"; "required": false; "isSignal": true; }; "tabAlignment": { "alias": "tabAlignment"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; }, { "focusEvent": "focus"; "blurEvent": "blur"; "changeTab": "changeTab"; }, ["tabs"], ["*"], false, never>;
36
+ static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumTabberComponent, "ard-tabber", never, { "initialTab": { "alias": "initialTab"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "stretchTabs": { "alias": "stretchTabs"; "required": false; "isSignal": true; }; "uniformTabWidths": { "alias": "uniformTabWidths"; "required": false; "isSignal": true; }; "tabAlignment": { "alias": "tabAlignment"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; }, { "focusEvent": "focus"; "blurEvent": "blur"; "changeTab": "changeTab"; }, ["tabs", "labelTemplate"], ["*"], false, never>;
29
37
  }
package/lib/tabber/tabber.directives.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import { TemplateRef } from '@angular/core';
2
+ import { TabberLabelContext } from './tabber.types';
3
+ import * as i0 from "@angular/core";
4
+ export declare class ArdTabberLabelTemplateDirective {
5
+ template: TemplateRef<TabberLabelContext>;
6
+ constructor(template: TemplateRef<TabberLabelContext>);
7
+ static ɵfac: i0.ɵɵFactoryDeclaration<ArdTabberLabelTemplateDirective, never>;
8
+ static ɵdir: i0.ɵɵDirectiveDeclaration<ArdTabberLabelTemplateDirective, "ng-template[ard-tabber-label-tmp]", never, {}, {}, never, never, false, never>;
9
+ }
package/lib/tabber/tabber.module.d.ts CHANGED
@@ -1,9 +1,10 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import * as i1 from "./tabber.component";
3
3
  import * as i2 from "./tab/tab.component";
4
- import * as i3 from "@angular/common";
4
+ import * as i3 from "./tabber.directives";
5
+ import * as i4 from "@angular/common";
5
6
  export declare class ArdiumTabberModule {
6
7
  static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumTabberModule, never>;
7
- static ɵmod: i0.ɵɵNgModuleDeclaration<ArdiumTabberModule, [typeof i1.ArdiumTabberComponent, typeof i2.ArdiumTabComponent], [typeof i3.CommonModule], [typeof i1.ArdiumTabberComponent, typeof i2.ArdiumTabComponent]>;
8
+ static ɵmod: i0.ɵɵNgModuleDeclaration<ArdiumTabberModule, [typeof i1.ArdiumTabberComponent, typeof i2.ArdiumTabComponent, typeof i3.ArdTabberLabelTemplateDirective], [typeof i4.CommonModule], [typeof i1.ArdiumTabberComponent, typeof i2.ArdiumTabComponent, typeof i3.ArdTabberLabelTemplateDirective]>;
8
9
  static ɵinj: i0.ɵɵInjectorDeclaration<ArdiumTabberModule>;
9
10
  }
package/lib/tabber/tabber.types.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ export interface TabberLabelContext {
2
+ $implicit: string;
3
+ label: string;
4
+ tabId: string;
5
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ardium-ui/ui",
3
- "version": "5.0.0-alpha.11",
3
+ "version": "5.0.0-alpha.13",
4
4
  "peerDependencies": {
5
5
  "@angular/common": ">=18.0.0",
6
6
  "@angular/core": ">=18.0.0",
package/prebuilt-themes/default/chips.css CHANGED
@@ -293,20 +293,25 @@
293
293
  }
294
294
  .ard-chip-wrapper.ard-appearance-outlined.ard-chip-selectable.ard-chip-selected, .ard-chip-wrapper.ard-appearance-outlined-strong.ard-chip-selectable.ard-chip-selected {
295
295
  color: var(--ard-cmpcl--content);
296
+ border-color: var(--ard-cmpcl--content);
296
297
  }
297
298
  .ard-chip-wrapper.ard-appearance-outlined.ard-chip-selectable.ard-chip-selected > .ard-focus-overlay, .ard-chip-wrapper.ard-appearance-outlined-strong.ard-chip-selectable.ard-chip-selected > .ard-focus-overlay {
298
- opacity: 7.5%;
299
+ opacity: 12%;
299
300
  }
300
301
  .ard-chip-wrapper.ard-appearance-outlined.ard-chip-selectable.ard-chip-selected:hover > .ard-focus-overlay, .ard-chip-wrapper.ard-appearance-outlined.ard-chip-selectable.ard-chip-selected:focus > .ard-focus-overlay, .ard-chip-wrapper.ard-appearance-outlined-strong.ard-chip-selectable.ard-chip-selected:hover > .ard-focus-overlay, .ard-chip-wrapper.ard-appearance-outlined-strong.ard-chip-selectable.ard-chip-selected:focus > .ard-focus-overlay {
301
- opacity: 15%;
302
+ opacity: 17%;
302
303
  }
303
304
  .ard-chip-wrapper.ard-appearance-outlined.ard-chip-selectable.ard-chip-selected:active > .ard-focus-overlay, .ard-chip-wrapper.ard-appearance-outlined-strong.ard-chip-selectable.ard-chip-selected:active > .ard-focus-overlay {
304
- opacity: 20%;
305
+ opacity: 22%;
305
306
  }
306
307
  .ard-chip-wrapper.ard-appearance-outlined-strong > .ard-focus-overlay {
307
- opacity: 7.5%;
308
+ opacity: 12%;
308
309
  background: var(--ard-cmpcl--bg-colored);
309
310
  }
311
+ .ard-chip-wrapper.ard-appearance-outlined-strong.ard-chip-selectable {
312
+ color: var(--ard-text2);
313
+ border: 1px solid var(--ard-detail-light);
314
+ }
310
315
  .ard-chip-wrapper.ard-chip-align-left {
311
316
  flex-direction: row;
312
317
  padding-left: 2px;
package/prebuilt-themes/default/chips.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/chips.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_clear-button.scss"],"names":[],"mappings":"AAMA;ECsEE;EDjEA;EACA,OEJM;EFKN,YEbG;EFcH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AGtBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AClIF;EACE,QFkCgB;EEjChB,OFiCgB;EEhChB;;AAGF;EACE;EACA;EACA,OFGK;EEFL,OFyBgB;EExBhB,QFwBgB;EEvBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EHvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EGgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EH7CN;EACA;EACA,yBACE;EG4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AHUN;EAEE;;AAEF;EACE;;AAEF;EACE;;AD3DF;EACE;;AAEF;ECjBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EDUE,YE9BM;EF+BN;;AAGF;EACE;EACA;EACA;;AAIE;EACE;;AAIF;EACE;;AAIJ;EClDF;EACA;EACA,yBACE;;ADkDE;EACE;;AAKN;EACE;EACA;EACA;;AAEA;EACE,kBE/DC;EFgED,OE7DE;EF8DF,YACE;;AAIF;EACE;EACA;;AAIN;EAEE;EACA;EACA;EACA;EACA;;AAEA;EACE,YACE;;AAGF;EACE;EACA;;AAIA;EACE;;AAIF;EACE;;AAIJ;EACE;;AAEA;EACE;;AAIA;EACE;;AAIF;EACE;;AAOR;EACE;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAIN;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAKN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEF;EACE;EACA;;;AAMJ;EACE;EACA;;AAEA;EACE","file":"chips.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/chips.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_clear-button.scss"],"names":[],"mappings":"AAMA;ECsEE;EDjEA;EACA,OEJM;EFKN,YEbG;EFcH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AGtBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AClIF;EACE,QFkCgB;EEjChB,OFiCgB;EEhChB;;AAGF;EACE;EACA;EACA,OFGK;EEFL,OFyBgB;EExBhB,QFwBgB;EEvBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EHvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EGgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EH7CN;EACA;EACA,yBACE;EG4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AHUN;EAEE;;AAEF;EACE;;AAEF;EACE;;AD3DF;EACE;;AAEF;ECjBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EDUE,YE9BM;EF+BN;;AAGF;EACE;EACA;EACA;;AAIE;EACE;;AAIF;EACE;;AAIJ;EClDF;EACA;EACA,yBACE;;ADkDE;EACE;;AAKN;EACE;EACA;EACA;;AAEA;EACE,kBE/DC;EFgED,OE7DE;EF8DF;;AAEA;EACE;EACA;;AAIN;EAEE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAIA;EACE;;AAIF;EACE;;AAIJ;EACE;EACA;;AAEA;EACE;;AAIA;EACE;;AAIF;EACE;;AAOR;EACE;EACA;;AAEF;EACE;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAIN;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAKN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEF;EACE;EACA;;;AAMJ;EACE;EACA;;AAEA;EACE","file":"chips.css"}
package/themes/default/chips.scss CHANGED
@@ -68,10 +68,7 @@
68
68
  &.ard-chip-selectable {
69
69
  background-color: ARD.$bg-f;
70
70
  color: ARD.$text2;
71
- transition:
72
- color 0.15s ease,
73
- border-color 0.15s ease,
74
- background-color 0.15s ease;
71
+ transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
75
72
 
76
73
  &.ard-chip-selected {
77
74
  color: var(--ard-cmpcl--on-bg-colored);
@@ -88,9 +85,7 @@
88
85
  font-weight: 600;
89
86
 
90
87
  &.ard-chip-selectable {
91
- transition:
92
- color 0.15s ease,
93
- border-color 0.15s ease;
88
+ transition: color 0.15s ease, border-color 0.15s ease;
94
89
 
95
90
  > .ard-focus-overlay {
96
91
  opacity: 0;
@@ -110,19 +105,20 @@
110
105
 
111
106
  &.ard-chip-selected {
112
107
  color: var(--ard-cmpcl--content);
108
+ border-color: var(--ard-cmpcl--content);
113
109
 
114
110
  > .ard-focus-overlay {
115
- opacity: 7.5%;
111
+ opacity: 12%;
116
112
  }
117
113
  &:hover,
118
114
  &:focus {
119
115
  > .ard-focus-overlay {
120
- opacity: 15%;
116
+ opacity: 17%;
121
117
  }
122
118
  }
123
119
  &:active {
124
120
  > .ard-focus-overlay {
125
- opacity: 20%;
121
+ opacity: 22%;
126
122
  }
127
123
  }
128
124
  }
@@ -130,9 +126,13 @@
130
126
  }
131
127
  &.ard-appearance-outlined-strong {
132
128
  > .ard-focus-overlay {
133
- opacity: 7.5%;
129
+ opacity: 12%;
134
130
  background: var(--ard-cmpcl--bg-colored);
135
131
  }
132
+ &.ard-chip-selectable {
133
+ color: var(--ard-text2);
134
+ border: 1px solid var(--ard-detail-light);
135
+ }
136
136
  }
137
137
 
138
138
  //! alignments