@ardium-ui/ui 2.0.6 → 2.2.0

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 (15) hide show
  1. package/esm2022/lib/_internal/selectable-list-component.mjs +5 -2
  2. package/esm2022/lib/segment/segment.component.mjs +2 -1
  3. package/esm2022/lib/segment/segment.types.mjs +2 -1
  4. package/esm2022/lib/tabber/tabber.component.mjs +10 -5
  5. package/fesm2022/ardium-ui-ui.mjs +15 -5
  6. package/fesm2022/ardium-ui-ui.mjs.map +1 -1
  7. package/lib/segment/segment.types.d.ts +1 -0
  8. package/lib/tabber/tabber.component.d.ts +2 -1
  9. package/package.json +1 -1
  10. package/prebuilt-themes/default/segment.css +24 -15
  11. package/prebuilt-themes/default/segment.css.map +1 -1
  12. package/prebuilt-themes/default/tabber.css +1 -0
  13. package/prebuilt-themes/default/tabber.css.map +1 -1
  14. package/themes/default/segment.scss +19 -8
  15. package/themes/default/tabber.scss +1 -0
package/lib/segment/segment.types.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  export declare const SegmentVariant: {
2
2
  readonly RoundedConnected: "rounded-connected";
3
3
  readonly SharpConnected: "sharp-connected";
4
+ readonly PillConnected: "pill-connected";
4
5
  readonly Pill: "pill";
5
6
  readonly Rounded: "rounded";
6
7
  readonly Sharp: "sharp";
package/lib/tabber/tabber.component.d.ts CHANGED
@@ -17,9 +17,10 @@ export declare class ArdiumTabberComponent implements AfterContentInit {
17
17
  readonly color: import("@angular/core").InputSignal<ComponentColor>;
18
18
  readonly ngClasses: import("@angular/core").Signal<string>;
19
19
  readonly stretchTabs: import("@angular/core").InputSignalWithTransform<boolean, any>;
20
+ readonly uniformTabWidths: import("@angular/core").InputSignalWithTransform<boolean, any>;
20
21
  readonly tabAlignment: import("@angular/core").InputSignal<OneAxisAlignment>;
21
22
  readonly tabContainerClasses: import("@angular/core").Signal<string>;
22
23
  readonly tabIndex: import("@angular/core").InputSignal<string | number>;
23
24
  static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumTabberComponent, never>;
24
- static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumTabberComponent, "ard-tabber", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "stretchTabs": { "alias": "stretchTabs"; "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>;
25
+ static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumTabberComponent, "ard-tabber", never, { "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>;
25
26
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ardium-ui/ui",
3
- "version": "2.0.6",
3
+ "version": "2.2.0",
4
4
  "peerDependencies": {
5
5
  "@angular/common": ">=18.0.0",
6
6
  "@angular/core": ">=18.0.0",
package/prebuilt-themes/default/segment.css CHANGED
@@ -247,55 +247,61 @@
247
247
  border: 1px solid var(--ard-border-light);
248
248
  }
249
249
  .ard-segment-container.ard-appearance-outlined .ard-segment-option.ard-option-selected, .ard-segment-container.ard-appearance-outlined-strong .ard-segment-option.ard-option-selected {
250
- border-color: var(--ard-cmpcl--border);
250
+ border-color: var(--ard-cmpcl--content);
251
251
  color: var(--ard-cmpcl--content);
252
252
  }
253
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected, .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected {
253
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected, .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected {
254
254
  gap: 0;
255
255
  }
256
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected .ard-segment-row {
256
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected .ard-segment-row, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected .ard-segment-row {
257
257
  gap: 0;
258
258
  }
259
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected .ard-segment-row:not(:first-child) {
259
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected .ard-segment-row:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected .ard-segment-row:not(:first-child) {
260
260
  margin-top: -1px;
261
261
  }
262
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected .ard-segment-row .ard-segment-option:not(:first-child) {
262
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined.ard-variant-sharp-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-sharp-connected .ard-segment-row .ard-segment-option:not(:first-child), .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected .ard-segment-row .ard-segment-option:not(:first-child) {
263
263
  margin-left: -1px;
264
264
  }
265
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row .ard-segment-option, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row .ard-segment-option {
265
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row .ard-segment-option, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row .ard-segment-option, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row .ard-segment-option, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row .ard-segment-option {
266
266
  border-radius: 0 !important;
267
267
  }
268
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child {
268
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child .ard-segment-option:first-child {
269
269
  border-top-left-radius: var(--ard-variant-border-radius) !important;
270
270
  }
271
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:last-child {
271
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child .ard-segment-option:last-child {
272
272
  border-top-right-radius: var(--ard-variant-border-radius) !important;
273
273
  }
274
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child:last-child {
274
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child .ard-segment-option:first-child:last-child {
275
275
  border-top-right-radius: var(--ard-variant-border-radius) !important;
276
276
  border-top-left-radius: var(--ard-variant-border-radius) !important;
277
277
  }
278
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child {
278
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:last-child .ard-segment-option:first-child {
279
279
  border-bottom-left-radius: var(--ard-variant-border-radius) !important;
280
280
  }
281
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:last-child {
281
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:last-child .ard-segment-option:last-child {
282
282
  border-bottom-right-radius: var(--ard-variant-border-radius) !important;
283
283
  }
284
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child:last-child {
284
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:last-child .ard-segment-option:first-child:last-child {
285
285
  border-bottom-right-radius: var(--ard-variant-border-radius) !important;
286
286
  border-bottom-left-radius: var(--ard-variant-border-radius) !important;
287
287
  }
288
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child {
288
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child:last-child .ard-segment-option:first-child {
289
289
  border-top-left-radius: var(--ard-variant-border-radius) !important;
290
290
  border-bottom-left-radius: var(--ard-variant-border-radius) !important;
291
291
  }
292
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:last-child {
292
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child:last-child .ard-segment-option:last-child {
293
293
  border-top-right-radius: var(--ard-variant-border-radius) !important;
294
294
  border-bottom-right-radius: var(--ard-variant-border-radius) !important;
295
295
  }
296
- .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child:last-child {
296
+ .ard-segment-container.ard-appearance-outlined.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-rounded-connected .ard-segment-row:first-child:last-child .ard-segment-option:first-child:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row:first-child:last-child .ard-segment-option:first-child:last-child {
297
297
  border-radius: var(--ard-variant-border-radius) !important;
298
298
  }
299
+ .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row .ard-segment-option:first-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row .ard-segment-option:first-child {
300
+ padding-left: 1.25em;
301
+ }
302
+ .ard-segment-container.ard-appearance-outlined.ard-variant-pill-connected.ard-singlerow .ard-segment-row .ard-segment-option:last-child, .ard-segment-container.ard-appearance-outlined-strong.ard-variant-pill-connected.ard-singlerow .ard-segment-row .ard-segment-option:last-child {
303
+ padding-right: 1.25em;
304
+ }
299
305
  .ard-segment-container.ard-appearance-outlined-strong .ard-segment-option.ard-option-selected {
300
306
  background-color: var(--ard-cmpcl--bg);
301
307
  color: var(--ard-cmpcl--on-bg);
@@ -359,6 +365,9 @@
359
365
  .ard-segment-container.ard-variant-sharp .ard-segment-row .ard-segment-option, .ard-segment-container.ard-variant-sharp-connected .ard-segment-row .ard-segment-option {
360
366
  border-radius: calc(var(--ard-variant-border-radius));
361
367
  }
368
+ .ard-segment-container.ard-variant-pill-connected.ard-singlerow {
369
+ --ard-variant-border-radius: 9999px;
370
+ }
362
371
  .ard-segment-container.ard-compact .ard-segment-row {
363
372
  --ard-_font-size: 0.85em;
364
373
  height: calc(1.85em + 1px);
package/prebuilt-themes/default/segment.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/segment.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAIA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EC0CA;;ACtDA;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;;AD5FF;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE;EACA;;AAOF;EAEE;;AAEF;EACE;;AAEF;EACE;;AD9CF;ECRA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EDCE;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAQJ;EACE;;AAIF;EACE;;AAIF;EACE;;AAOA;EACE;;AAIF;EACE;;AAOR;EACE;;AAII;EACE;;AAGF;EACE;;AAKR;EAEE,YG7HC;EH8HD;;AAEA;EACE;;AAEA;EACE;EACA;;AAGJ;EAEE;;AAEA;EACE;;AAEA;EACE;;AAGF;EACE;;AAMF;EACE;;AAIE;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAMF;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAMF;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAQV;EACE;EACA;;AAGJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKE;EACE;;AAIF;EACE;;AAKR;EACE;EACA;;AAGE;EACE;;AAEA;EACE;;AAGA;EACE;;AAGJ;EACE;EACA;;AAEA;EACE;;AAQV;EACE;;AAGE;EACE;;AAIN;EAEE;EACA;;AAGE;EACE;;AAIN;EAEE;;AAGE;EACE;;AAOJ;EACE;EACA;;AAEA;EACE;EACA;;AAMJ;EACE;EACA;EACA;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;;AAKA;AAAA;EAEE;;AAEF;EACE","file":"segment.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/segment.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAIA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EC0CA;;ACtDA;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;;AD5FF;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE;EACA;;AAOF;EAEE;;AAEF;EACE;;AAEF;EACE;;AD9CF;ECRA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EDCE;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAQJ;EACE;;AAIF;EACE;;AAIF;EACE;;AAOA;EACE;;AAIF;EACE;;AAOR;EACE;;AAII;EACE;;AAGF;EACE;;AAKR;EAEE,YGzHC;EH0HD;;AAEA;EACE;;AAEA;EACE;EACA;;AAGJ;EAGE;;AAEA;EACE;;AAEA;EACE;;AAGF;EACE;;AAOF;EACE;;AAIE;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAMF;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAMF;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAQN;EACE;;AAEF;EACE;;AAMN;EACE;EACA;;AAGJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKE;EACE;;AAIF;EACE;;AAKR;EACE;EACA;;AAGE;EACE;;AAEA;EACE;;AAGA;EACE;;AAGJ;EACE;EACA;;AAEA;EACE;;AAQV;EACE;;AAGE;EACE;;AAIN;EAEE;EACA;;AAGE;EACE;;AAIN;EAEE;;AAGE;EACE;;AAIN;EACE;;AAKA;EACE;EACA;;AAEA;EACE;EACA;;AAMJ;EACE;EACA;EACA;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;;AAKA;AAAA;EAEE;;AAEF;EACE","file":"segment.css"}
package/prebuilt-themes/default/tabber.css CHANGED
@@ -166,6 +166,7 @@ ard-tabber {
166
166
  .ard-tabber .ard-tabber-tabs .ard-tab-button {
167
167
  height: 2.5em;
168
168
  font-size: 0.875rem;
169
+ font-weight: 500;
169
170
  position: relative;
170
171
  border: none;
171
172
  background: none;
package/prebuilt-themes/default/tabber.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/tabber.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAIA;EACE;;;AAGF;EAEE;EACA;EACA;EACA;EACA;;ACXA;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;;ADtHF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EEpCJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EF6BM,YGlDC;;AHuDD;EACE;;AAKF;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"tabber.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/tabber.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAIA;EACE;;;AAGF;EAEE;EACA;EACA;EACA;EACA;;ACXA;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;;ADtHF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EErCJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EF8BM,YGnDC;;AHwDD;EACE;;AAKF;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"tabber.css"}
package/themes/default/segment.scss CHANGED
@@ -41,11 +41,7 @@
41
41
  background: transparent;
42
42
  position: relative;
43
43
  cursor: pointer;
44
- transition:
45
- color 0.1s $timing-fn,
46
- opacity 0.1s $timing-fn,
47
- border-color 0.1s $timing-fn,
48
- background-color 0.1s $timing-fn;
44
+ transition: color 0.1s $timing-fn, opacity 0.1s $timing-fn, border-color 0.1s $timing-fn, background-color 0.1s $timing-fn;
49
45
  outline: none;
50
46
  display: flex;
51
47
  align-items: center;
@@ -130,12 +126,13 @@
130
126
  border: 1px solid $border-light;
131
127
 
132
128
  &.ard-option-selected {
133
- border-color: var(--ard-cmpcl--border);
129
+ border-color: var(--ard-cmpcl--content);
134
130
  color: var(--ard-cmpcl--content);
135
131
  }
136
132
  }
137
133
  &.ard-variant-rounded-connected,
138
- &.ard-variant-sharp-connected {
134
+ &.ard-variant-sharp-connected,
135
+ &.ard-variant-pill-connected {
139
136
  gap: 0;
140
137
 
141
138
  .ard-segment-row {
@@ -150,7 +147,8 @@
150
147
  }
151
148
  }
152
149
  }
153
- &.ard-variant-rounded-connected {
150
+ &.ard-variant-rounded-connected,
151
+ &.ard-variant-pill-connected.ard-singlerow {
154
152
  .ard-segment-row {
155
153
  .ard-segment-option {
156
154
  border-radius: 0 !important;
@@ -200,6 +198,16 @@
200
198
  }
201
199
  }
202
200
  }
201
+ &.ard-variant-pill-connected.ard-singlerow {
202
+ .ard-segment-row .ard-segment-option {
203
+ &:first-child {
204
+ padding-left: 1.25em;
205
+ }
206
+ &:last-child {
207
+ padding-right: 1.25em;
208
+ }
209
+ }
210
+ }
203
211
  }
204
212
  &.ard-appearance-outlined-strong {
205
213
  .ard-segment-option.ard-option-selected {
@@ -294,6 +302,9 @@
294
302
  }
295
303
  }
296
304
  }
305
+ &.ard-variant-pill-connected.ard-singlerow {
306
+ --ard-variant-border-radius: 9999px;
307
+ }
297
308
 
298
309
  //! compact
299
310
  &.ard-compact {
package/themes/default/tabber.scss CHANGED
@@ -40,6 +40,7 @@ ard-tabber {
40
40
  .ard-tab-button {
41
41
  height: 2.5em;
42
42
  font-size: 0.875rem;
43
+ font-weight: 500;
43
44
  position: relative;
44
45
  border: none;
45
46
  background: none;