@proximus/lavender-angular 1.4.15-alpha.15 → 1.4.15-alpha.17

package/fesm2022/proximus-lavender-angular.mjs

@@ -5189,9 +5189,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 args: ['word-break-all--desktop']
             }] } });
 /**
- * @description Type-only wrapper for <px-button-icon>
+ * @description Type-only wrapper for <px-card>
  */
-class PxButtonIcon {
+class PxCard {
     elementRef;
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
@@ -5199,57 +5199,83 @@ class PxButtonIcon {
     get inverted() {
         return this.elementRef.nativeElement['inverted'];
     }
-    set loading(value) {
-        this.elementRef.nativeElement['loading'] = value;
+    set backgroundColor(value) {
+        this.elementRef.nativeElement['backgroundColor'] = value;
     }
-    get loading() {
-        return this.elementRef.nativeElement['loading'];
+    get backgroundColor() {
+        return this.elementRef.nativeElement['backgroundColor'];
     }
-    set size(value) {
-        this.elementRef.nativeElement['size'] = value;
+    set backgroundSize(value) {
+        this.elementRef.nativeElement['backgroundSize'] = value;
     }
-    get size() {
-        return this.elementRef.nativeElement['size'];
+    get backgroundSize() {
+        return this.elementRef.nativeElement['backgroundSize'];
     }
-    set variant(value) {
-        this.elementRef.nativeElement['variant'] = value;
+    set backgroundPosition(value) {
+        this.elementRef.nativeElement['backgroundPosition'] = value;
     }
-    get variant() {
-        return this.elementRef.nativeElement['variant'];
+    get backgroundPosition() {
+        return this.elementRef.nativeElement['backgroundPosition'];
     }
-    set ariaExpanded(value) {
-        this.elementRef.nativeElement['ariaExpanded'] = value;
+    set contrastHelperGradient(value) {
+        this.elementRef.nativeElement['contrastHelperGradient'] = value;
     }
-    get ariaExpanded() {
-        return this.elementRef.nativeElement['ariaExpanded'];
+    get contrastHelperGradient() {
+        return this.elementRef.nativeElement['contrastHelperGradient'];
     }
-    /** The name of the button, submitted as a pair with the button's value as part of the form data. */
-    set name(value) {
-        this.elementRef.nativeElement['name'] = value;
+    set contrastHelperOverlay(value) {
+        this.elementRef.nativeElement['contrastHelperOverlay'] = value;
     }
-    get name() {
-        return this.elementRef.nativeElement['name'];
+    get contrastHelperOverlay() {
+        return this.elementRef.nativeElement['contrastHelperOverlay'];
     }
-    /** The value associated with the button's name when it's submitted with a form. */
-    set value(value) {
-        this.elementRef.nativeElement['value'] = value;
+    set mediaPosition(value) {
+        this.elementRef.nativeElement['mediaPosition'] = value;
     }
-    get value() {
-        return this.elementRef.nativeElement['value'];
+    get mediaPosition() {
+        return this.elementRef.nativeElement['mediaPosition'];
     }
-    /** The default behavior of the button. Possible values are 'submit', 'reset', and 'button'. */
-    set type(value) {
-        this.elementRef.nativeElement['type'] = value;
+    set mediaPositionMobile(value) {
+        this.elementRef.nativeElement['mediaPositionMobile'] = value;
     }
-    get type() {
-        return this.elementRef.nativeElement['type'];
+    get mediaPositionMobile() {
+        return this.elementRef.nativeElement['mediaPositionMobile'];
     }
-    /** Whether the button is disabled. */
-    set disabled(value) {
-        this.elementRef.nativeElement['disabled'] = value;
+    set mediaPositionTablet(value) {
+        this.elementRef.nativeElement['mediaPositionTablet'] = value;
     }
-    get disabled() {
-        return this.elementRef.nativeElement['disabled'];
+    get mediaPositionTablet() {
+        return this.elementRef.nativeElement['mediaPositionTablet'];
+    }
+    set mediaPositionLaptop(value) {
+        this.elementRef.nativeElement['mediaPositionLaptop'] = value;
+    }
+    get mediaPositionLaptop() {
+        return this.elementRef.nativeElement['mediaPositionLaptop'];
+    }
+    set mediaSrc(value) {
+        this.elementRef.nativeElement['mediaSrc'] = value;
+    }
+    get mediaSrc() {
+        return this.elementRef.nativeElement['mediaSrc'];
+    }
+    set mediaSrcMobile(value) {
+        this.elementRef.nativeElement['mediaSrcMobile'] = value;
+    }
+    get mediaSrcMobile() {
+        return this.elementRef.nativeElement['mediaSrcMobile'];
+    }
+    set mediaSrcTablet(value) {
+        this.elementRef.nativeElement['mediaSrcTablet'] = value;
+    }
+    get mediaSrcTablet() {
+        return this.elementRef.nativeElement['mediaSrcTablet'];
+    }
+    set mediaSrcLaptop(value) {
+        this.elementRef.nativeElement['mediaSrcLaptop'] = value;
+    }
+    get mediaSrcLaptop() {
+        return this.elementRef.nativeElement['mediaSrcLaptop'];
     }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
@@ -5566,34 +5592,56 @@ class PxButtonIcon {
     constructor(elementRef) {
         this.elementRef = elementRef;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxButtonIcon, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxButtonIcon, isStandalone: true, selector: "px-button-icon", inputs: { inverted: "inverted", loading: "loading", size: "size", variant: "variant", ariaExpanded: ["aria-expanded", "ariaExpanded"], name: "name", value: "value", type: "type", disabled: "disabled", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCard, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCard, isStandalone: true, selector: "px-card", inputs: { inverted: "inverted", backgroundColor: ["background-color", "backgroundColor"], backgroundSize: ["background-size", "backgroundSize"], backgroundPosition: ["background-position", "backgroundPosition"], contrastHelperGradient: ["contrast-helper-gradient", "contrastHelperGradient"], contrastHelperOverlay: ["contrast-helper-overlay", "contrastHelperOverlay"], mediaPosition: ["media-position", "mediaPosition"], mediaPositionMobile: ["media-position--mobile", "mediaPositionMobile"], mediaPositionTablet: ["media-position--tablet", "mediaPositionTablet"], mediaPositionLaptop: ["media-position--laptop", "mediaPositionLaptop"], mediaSrc: ["media-src", "mediaSrc"], mediaSrcMobile: ["media-src--mobile", "mediaSrcMobile"], mediaSrcTablet: ["media-src--tablet", "mediaSrcTablet"], mediaSrcLaptop: ["media-src--laptop", "mediaSrcLaptop"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxButtonIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCard, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-button-icon',
+                    selector: 'px-card',
                     standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
                 type: Input
-            }], loading: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], variant: [{
-                type: Input
-            }], ariaExpanded: [{
+            }], backgroundColor: [{
                 type: Input,
-                args: ['aria-expanded']
-            }], name: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], disabled: [{
-                type: Input
+                args: ['background-color']
+            }], backgroundSize: [{
+                type: Input,
+                args: ['background-size']
+            }], backgroundPosition: [{
+                type: Input,
+                args: ['background-position']
+            }], contrastHelperGradient: [{
+                type: Input,
+                args: ['contrast-helper-gradient']
+            }], contrastHelperOverlay: [{
+                type: Input,
+                args: ['contrast-helper-overlay']
+            }], mediaPosition: [{
+                type: Input,
+                args: ['media-position']
+            }], mediaPositionMobile: [{
+                type: Input,
+                args: ['media-position--mobile']
+            }], mediaPositionTablet: [{
+                type: Input,
+                args: ['media-position--tablet']
+            }], mediaPositionLaptop: [{
+                type: Input,
+                args: ['media-position--laptop']
+            }], mediaSrc: [{
+                type: Input,
+                args: ['media-src']
+            }], mediaSrcMobile: [{
+                type: Input,
+                args: ['media-src--mobile']
+            }], mediaSrcTablet: [{
+                type: Input,
+                args: ['media-src--tablet']
+            }], mediaSrcLaptop: [{
+                type: Input,
+                args: ['media-src--laptop']
             }], grow: [{
                 type: Input
             }], growMobile: [{
@@ -5747,9 +5795,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 args: ['word-break-all--desktop']
             }] } });
 /**
- * @description Type-only wrapper for <px-card>
+ * @description Type-only wrapper for <px-button-icon>
  */
-class PxCard {
+class PxButtonIcon {
     elementRef;
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
@@ -5757,83 +5805,57 @@ class PxCard {
     get inverted() {
         return this.elementRef.nativeElement['inverted'];
     }
-    set backgroundColor(value) {
-        this.elementRef.nativeElement['backgroundColor'] = value;
-    }
-    get backgroundColor() {
-        return this.elementRef.nativeElement['backgroundColor'];
-    }
-    set backgroundSize(value) {
-        this.elementRef.nativeElement['backgroundSize'] = value;
-    }
-    get backgroundSize() {
-        return this.elementRef.nativeElement['backgroundSize'];
-    }
-    set backgroundPosition(value) {
-        this.elementRef.nativeElement['backgroundPosition'] = value;
-    }
-    get backgroundPosition() {
-        return this.elementRef.nativeElement['backgroundPosition'];
-    }
-    set contrastHelperGradient(value) {
-        this.elementRef.nativeElement['contrastHelperGradient'] = value;
-    }
-    get contrastHelperGradient() {
-        return this.elementRef.nativeElement['contrastHelperGradient'];
-    }
-    set contrastHelperOverlay(value) {
-        this.elementRef.nativeElement['contrastHelperOverlay'] = value;
-    }
-    get contrastHelperOverlay() {
-        return this.elementRef.nativeElement['contrastHelperOverlay'];
-    }
-    set mediaPosition(value) {
-        this.elementRef.nativeElement['mediaPosition'] = value;
+    set loading(value) {
+        this.elementRef.nativeElement['loading'] = value;
     }
-    get mediaPosition() {
-        return this.elementRef.nativeElement['mediaPosition'];
+    get loading() {
+        return this.elementRef.nativeElement['loading'];
     }
-    set mediaPositionMobile(value) {
-        this.elementRef.nativeElement['mediaPositionMobile'] = value;
+    set size(value) {
+        this.elementRef.nativeElement['size'] = value;
     }
-    get mediaPositionMobile() {
-        return this.elementRef.nativeElement['mediaPositionMobile'];
+    get size() {
+        return this.elementRef.nativeElement['size'];
     }
-    set mediaPositionTablet(value) {
-        this.elementRef.nativeElement['mediaPositionTablet'] = value;
+    set variant(value) {
+        this.elementRef.nativeElement['variant'] = value;
     }
-    get mediaPositionTablet() {
-        return this.elementRef.nativeElement['mediaPositionTablet'];
+    get variant() {
+        return this.elementRef.nativeElement['variant'];
     }
-    set mediaPositionLaptop(value) {
-        this.elementRef.nativeElement['mediaPositionLaptop'] = value;
+    set ariaExpanded(value) {
+        this.elementRef.nativeElement['ariaExpanded'] = value;
     }
-    get mediaPositionLaptop() {
-        return this.elementRef.nativeElement['mediaPositionLaptop'];
+    get ariaExpanded() {
+        return this.elementRef.nativeElement['ariaExpanded'];
     }
-    set mediaSrc(value) {
-        this.elementRef.nativeElement['mediaSrc'] = value;
+    /** The name of the button, submitted as a pair with the button's value as part of the form data. */
+    set name(value) {
+        this.elementRef.nativeElement['name'] = value;
     }
-    get mediaSrc() {
-        return this.elementRef.nativeElement['mediaSrc'];
+    get name() {
+        return this.elementRef.nativeElement['name'];
     }
-    set mediaSrcMobile(value) {
-        this.elementRef.nativeElement['mediaSrcMobile'] = value;
+    /** The value associated with the button's name when it's submitted with a form. */
+    set value(value) {
+        this.elementRef.nativeElement['value'] = value;
     }
-    get mediaSrcMobile() {
-        return this.elementRef.nativeElement['mediaSrcMobile'];
+    get value() {
+        return this.elementRef.nativeElement['value'];
     }
-    set mediaSrcTablet(value) {
-        this.elementRef.nativeElement['mediaSrcTablet'] = value;
+    /** The default behavior of the button. Possible values are 'submit', 'reset', and 'button'. */
+    set type(value) {
+        this.elementRef.nativeElement['type'] = value;
     }
-    get mediaSrcTablet() {
-        return this.elementRef.nativeElement['mediaSrcTablet'];
+    get type() {
+        return this.elementRef.nativeElement['type'];
     }
-    set mediaSrcLaptop(value) {
-        this.elementRef.nativeElement['mediaSrcLaptop'] = value;
+    /** Whether the button is disabled. */
+    set disabled(value) {
+        this.elementRef.nativeElement['disabled'] = value;
     }
-    get mediaSrcLaptop() {
-        return this.elementRef.nativeElement['mediaSrcLaptop'];
+    get disabled() {
+        return this.elementRef.nativeElement['disabled'];
     }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
@@ -6150,56 +6172,34 @@ class PxCard {
     constructor(elementRef) {
         this.elementRef = elementRef;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCard, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCard, isStandalone: true, selector: "px-card", inputs: { inverted: "inverted", backgroundColor: ["background-color", "backgroundColor"], backgroundSize: ["background-size", "backgroundSize"], backgroundPosition: ["background-position", "backgroundPosition"], contrastHelperGradient: ["contrast-helper-gradient", "contrastHelperGradient"], contrastHelperOverlay: ["contrast-helper-overlay", "contrastHelperOverlay"], mediaPosition: ["media-position", "mediaPosition"], mediaPositionMobile: ["media-position--mobile", "mediaPositionMobile"], mediaPositionTablet: ["media-position--tablet", "mediaPositionTablet"], mediaPositionLaptop: ["media-position--laptop", "mediaPositionLaptop"], mediaSrc: ["media-src", "mediaSrc"], mediaSrcMobile: ["media-src--mobile", "mediaSrcMobile"], mediaSrcTablet: ["media-src--tablet", "mediaSrcTablet"], mediaSrcLaptop: ["media-src--laptop", "mediaSrcLaptop"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxButtonIcon, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxButtonIcon, isStandalone: true, selector: "px-button-icon", inputs: { inverted: "inverted", loading: "loading", size: "size", variant: "variant", ariaExpanded: ["aria-expanded", "ariaExpanded"], name: "name", value: "value", type: "type", disabled: "disabled", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxButtonIcon, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-card',
+                    selector: 'px-button-icon',
                     standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
                 type: Input
-            }], backgroundColor: [{
-                type: Input,
-                args: ['background-color']
-            }], backgroundSize: [{
-                type: Input,
-                args: ['background-size']
-            }], backgroundPosition: [{
-                type: Input,
-                args: ['background-position']
-            }], contrastHelperGradient: [{
-                type: Input,
-                args: ['contrast-helper-gradient']
-            }], contrastHelperOverlay: [{
-                type: Input,
-                args: ['contrast-helper-overlay']
-            }], mediaPosition: [{
-                type: Input,
-                args: ['media-position']
-            }], mediaPositionMobile: [{
-                type: Input,
-                args: ['media-position--mobile']
-            }], mediaPositionTablet: [{
-                type: Input,
-                args: ['media-position--tablet']
-            }], mediaPositionLaptop: [{
-                type: Input,
-                args: ['media-position--laptop']
-            }], mediaSrc: [{
-                type: Input,
-                args: ['media-src']
-            }], mediaSrcMobile: [{
-                type: Input,
-                args: ['media-src--mobile']
-            }], mediaSrcTablet: [{
-                type: Input,
-                args: ['media-src--tablet']
-            }], mediaSrcLaptop: [{
+            }], loading: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], ariaExpanded: [{
                 type: Input,
-                args: ['media-src--laptop']
+                args: ['aria-expanded']
+            }], name: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], disabled: [{
+                type: Input
             }], grow: [{
                 type: Input
             }], growMobile: [{
@@ -27624,6 +27624,175 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 type: Input,
                 args: ['word-break-all--desktop']
             }] } });
+/**
+ * @description Type-only wrapper for <px-card-actions>
+ */
+class PxCardActions {
+    elementRef;
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardActions, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCardActions, isStandalone: true, selector: "px-card-actions", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardActions, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'px-card-actions',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
+/**
+ * @description Type-only wrapper for <px-card-container>
+ */
+class PxCardContainer {
+    elementRef;
+    /** Switches to a dark surface with inverted text colors. */
+    set inverted(value) {
+        this.elementRef.nativeElement['inverted'] = value;
+    }
+    get inverted() {
+        return this.elementRef.nativeElement['inverted'];
+    }
+    /** URL of the card media image. */
+    set src(value) {
+        this.elementRef.nativeElement['src'] = value;
+    }
+    get src() {
+        return this.elementRef.nativeElement['src'];
+    }
+    /** Where the media image is rendered. */
+    set mediaPosition(value) {
+        this.elementRef.nativeElement['mediaPosition'] = value;
+    }
+    get mediaPosition() {
+        return this.elementRef.nativeElement['mediaPosition'];
+    }
+    /** How the media image is fitted. */
+    set mediaSize(value) {
+        this.elementRef.nativeElement['mediaSize'] = value;
+    }
+    get mediaSize() {
+        return this.elementRef.nativeElement['mediaSize'];
+    }
+    set mediaAltText(value) {
+        this.elementRef.nativeElement['mediaAltText'] = value;
+    }
+    get mediaAltText() {
+        return this.elementRef.nativeElement['mediaAltText'];
+    }
+    /** Inner content padding size. */
+    set padding(value) {
+        this.elementRef.nativeElement['padding'] = value;
+    }
+    get padding() {
+        return this.elementRef.nativeElement['padding'];
+    }
+    /** Aspect ratio applied to top media (e.g. `'16:9'`, `'1:1'`, `'4:3'`). */
+    set aspectRatio(value) {
+        this.elementRef.nativeElement['aspectRatio'] = value;
+    }
+    get aspectRatio() {
+        return this.elementRef.nativeElement['aspectRatio'];
+    }
+    /** Whether the card has a visible border. */
+    set hasBorder(value) {
+        this.elementRef.nativeElement['hasBorder'] = value;
+    }
+    get hasBorder() {
+        return this.elementRef.nativeElement['hasBorder'];
+    }
+    /** Surface color preset. */
+    set backgroundColor(value) {
+        this.elementRef.nativeElement['backgroundColor'] = value;
+    }
+    get backgroundColor() {
+        return this.elementRef.nativeElement['backgroundColor'];
+    }
+    /** URL of a full-card background image (delegated to `<px-container>`). */
+    set backgroundImage(value) {
+        this.elementRef.nativeElement['backgroundImage'] = value;
+    }
+    get backgroundImage() {
+        return this.elementRef.nativeElement['backgroundImage'];
+    }
+    set interactiveState(value) {
+        this.elementRef.nativeElement['interactiveState'] = value;
+    }
+    get interactiveState() {
+        return this.elementRef.nativeElement['interactiveState'];
+    }
+    /** Alt text for the media image. */
+    set alternativeText(value) {
+        this.elementRef.nativeElement['alternativeText'] = value;
+    }
+    get alternativeText() {
+        return this.elementRef.nativeElement['alternativeText'];
+    }
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCardContainer, isStandalone: true, selector: "px-card-container", inputs: { inverted: "inverted", src: "src", mediaPosition: ["media-position", "mediaPosition"], mediaSize: ["media-size", "mediaSize"], mediaAltText: ["media-alt-text", "mediaAltText"], padding: "padding", aspectRatio: ["aspect-ratio", "aspectRatio"], hasBorder: ["has-border", "hasBorder"], backgroundColor: ["background-color", "backgroundColor"], backgroundImage: ["background-image", "backgroundImage"], interactiveState: ["interactive-state", "interactiveState"], alternativeText: ["alternative-text", "alternativeText"] }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardContainer, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'px-card-container',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
+                type: Input
+            }], src: [{
+                type: Input
+            }], mediaPosition: [{
+                type: Input,
+                args: ['media-position']
+            }], mediaSize: [{
+                type: Input,
+                args: ['media-size']
+            }], mediaAltText: [{
+                type: Input,
+                args: ['media-alt-text']
+            }], padding: [{
+                type: Input
+            }], aspectRatio: [{
+                type: Input,
+                args: ['aspect-ratio']
+            }], hasBorder: [{
+                type: Input,
+                args: ['has-border']
+            }], backgroundColor: [{
+                type: Input,
+                args: ['background-color']
+            }], backgroundImage: [{
+                type: Input,
+                args: ['background-image']
+            }], interactiveState: [{
+                type: Input,
+                args: ['interactive-state']
+            }], alternativeText: [{
+                type: Input,
+                args: ['alternative-text']
+            }] } });
+/**
+ * @description Type-only wrapper for <px-card-heading>
+ */
+class PxCardHeading {
+    elementRef;
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardHeading, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCardHeading, isStandalone: true, selector: "px-card-heading", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardHeading, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'px-card-heading',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
 /**
  * @description Type-only wrapper for <px-pillar>
  */
@@ -28147,175 +28316,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 type: Input,
                 args: ['word-break-all--desktop']
             }] } });
-/**
- * @description Type-only wrapper for <px-card-actions>
- */
-class PxCardActions {
-    elementRef;
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardActions, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCardActions, isStandalone: true, selector: "px-card-actions", ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardActions, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'px-card-actions',
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }] });
-/**
- * @description Type-only wrapper for <px-card-container>
- */
-class PxCardContainer {
-    elementRef;
-    /** Switches to a dark surface with inverted text colors. */
-    set inverted(value) {
-        this.elementRef.nativeElement['inverted'] = value;
-    }
-    get inverted() {
-        return this.elementRef.nativeElement['inverted'];
-    }
-    /** URL of the card media image. */
-    set src(value) {
-        this.elementRef.nativeElement['src'] = value;
-    }
-    get src() {
-        return this.elementRef.nativeElement['src'];
-    }
-    /** Where the media image is rendered. */
-    set mediaPosition(value) {
-        this.elementRef.nativeElement['mediaPosition'] = value;
-    }
-    get mediaPosition() {
-        return this.elementRef.nativeElement['mediaPosition'];
-    }
-    /** How the media image is fitted. */
-    set mediaSize(value) {
-        this.elementRef.nativeElement['mediaSize'] = value;
-    }
-    get mediaSize() {
-        return this.elementRef.nativeElement['mediaSize'];
-    }
-    set mediaAltText(value) {
-        this.elementRef.nativeElement['mediaAltText'] = value;
-    }
-    get mediaAltText() {
-        return this.elementRef.nativeElement['mediaAltText'];
-    }
-    /** Inner content padding size. */
-    set padding(value) {
-        this.elementRef.nativeElement['padding'] = value;
-    }
-    get padding() {
-        return this.elementRef.nativeElement['padding'];
-    }
-    /** Aspect ratio applied to top media (e.g. `'16:9'`, `'1:1'`, `'4:3'`). */
-    set aspectRatio(value) {
-        this.elementRef.nativeElement['aspectRatio'] = value;
-    }
-    get aspectRatio() {
-        return this.elementRef.nativeElement['aspectRatio'];
-    }
-    /** Whether the card has a visible border. */
-    set hasBorder(value) {
-        this.elementRef.nativeElement['hasBorder'] = value;
-    }
-    get hasBorder() {
-        return this.elementRef.nativeElement['hasBorder'];
-    }
-    /** Surface color preset. */
-    set backgroundColor(value) {
-        this.elementRef.nativeElement['backgroundColor'] = value;
-    }
-    get backgroundColor() {
-        return this.elementRef.nativeElement['backgroundColor'];
-    }
-    /** URL of a full-card background image (delegated to `<px-container>`). */
-    set backgroundImage(value) {
-        this.elementRef.nativeElement['backgroundImage'] = value;
-    }
-    get backgroundImage() {
-        return this.elementRef.nativeElement['backgroundImage'];
-    }
-    set interactiveState(value) {
-        this.elementRef.nativeElement['interactiveState'] = value;
-    }
-    get interactiveState() {
-        return this.elementRef.nativeElement['interactiveState'];
-    }
-    /** Alt text for the media image. */
-    set alternativeText(value) {
-        this.elementRef.nativeElement['alternativeText'] = value;
-    }
-    get alternativeText() {
-        return this.elementRef.nativeElement['alternativeText'];
-    }
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCardContainer, isStandalone: true, selector: "px-card-container", inputs: { inverted: "inverted", src: "src", mediaPosition: ["media-position", "mediaPosition"], mediaSize: ["media-size", "mediaSize"], mediaAltText: ["media-alt-text", "mediaAltText"], padding: "padding", aspectRatio: ["aspect-ratio", "aspectRatio"], hasBorder: ["has-border", "hasBorder"], backgroundColor: ["background-color", "backgroundColor"], backgroundImage: ["background-image", "backgroundImage"], interactiveState: ["interactive-state", "interactiveState"], alternativeText: ["alternative-text", "alternativeText"] }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardContainer, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'px-card-container',
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
-                type: Input
-            }], src: [{
-                type: Input
-            }], mediaPosition: [{
-                type: Input,
-                args: ['media-position']
-            }], mediaSize: [{
-                type: Input,
-                args: ['media-size']
-            }], mediaAltText: [{
-                type: Input,
-                args: ['media-alt-text']
-            }], padding: [{
-                type: Input
-            }], aspectRatio: [{
-                type: Input,
-                args: ['aspect-ratio']
-            }], hasBorder: [{
-                type: Input,
-                args: ['has-border']
-            }], backgroundColor: [{
-                type: Input,
-                args: ['background-color']
-            }], backgroundImage: [{
-                type: Input,
-                args: ['background-image']
-            }], interactiveState: [{
-                type: Input,
-                args: ['interactive-state']
-            }], alternativeText: [{
-                type: Input,
-                args: ['alternative-text']
-            }] } });
-/**
- * @description Type-only wrapper for <px-card-heading>
- */
-class PxCardHeading {
-    elementRef;
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardHeading, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxCardHeading, isStandalone: true, selector: "px-card-heading", ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxCardHeading, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'px-card-heading',
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }] });
 /**
  * @description Type-only wrapper for <px-price>
  */
@@ -28822,72 +28822,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 args: ['word-break-all--desktop']
             }] } });
 /**
- * @description Type-only wrapper for <px-radio>
+ * @description Type-only wrapper for <px-ribbon>
  */
-class PxRadio {
+class PxRibbon {
     elementRef;
-    /** The validation state of the radio button. */
-    set state(value) {
-        this.elementRef.nativeElement['state'] = value;
-    }
-    get state() {
-        return this.elementRef.nativeElement['state'];
-    }
-    /** The visual variant of the radio button. */
-    set variant(value) {
-        this.elementRef.nativeElement['variant'] = value;
-    }
-    get variant() {
-        return this.elementRef.nativeElement['variant'];
-    }
-    /** Whether to use inverted (dark background) styling. */
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
     }
     get inverted() {
         return this.elementRef.nativeElement['inverted'];
     }
-    set size(value) {
-        this.elementRef.nativeElement['size'] = value;
-    }
-    get size() {
-        return this.elementRef.nativeElement['size'];
-    }
-    /** Whether the radio button is checked. */
-    set checked(value) {
-        this.elementRef.nativeElement['checked'] = value;
-    }
-    get checked() {
-        return this.elementRef.nativeElement['checked'];
-    }
-    /** Whether the radio button is disabled. */
-    set disabled(value) {
-        this.elementRef.nativeElement['disabled'] = value;
-    }
-    get disabled() {
-        return this.elementRef.nativeElement['disabled'];
-    }
-    /** Whether to apply hover styling. */
-    set hover(value) {
-        this.elementRef.nativeElement['hover'] = value;
-    }
-    get hover() {
-        return this.elementRef.nativeElement['hover'];
-    }
-    /** The name of the radio button, used for form submission. */
-    set name(value) {
-        this.elementRef.nativeElement['name'] = value;
-    }
-    get name() {
-        return this.elementRef.nativeElement['name'];
-    }
-    /** The value of the radio button, used for form submission. */
-    set value(value) {
-        this.elementRef.nativeElement['value'] = value;
-    }
-    get value() {
-        return this.elementRef.nativeElement['value'];
-    }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
     }
@@ -29200,40 +29144,19 @@ class PxRadio {
     get wordBreakAllDesktop() {
         return this.elementRef.nativeElement['wordBreakAllDesktop'];
     }
-    /** Fired when the radio button becomes checked. */
-    change = new EventEmitter();
     constructor(elementRef) {
         this.elementRef = elementRef;
-        this.elementRef.nativeElement.addEventListener('change', (e) => {
-            this.change.emit(e.detail);
-        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadio, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRadio, isStandalone: true, selector: "px-radio", inputs: { state: "state", variant: "variant", inverted: "inverted", size: "size", checked: "checked", disabled: "disabled", hover: "hover", name: "name", value: "value", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, outputs: { change: "change" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRibbon, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRibbon, isStandalone: true, selector: "px-ribbon", inputs: { inverted: "inverted", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRibbon, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-radio',
+                    selector: 'px-ribbon',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { state: [{
-                type: Input
-            }], variant: [{
-                type: Input
-            }], inverted: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], checked: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], hover: [{
-                type: Input
-            }], name: [{
-                type: Input
-            }], value: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
                 type: Input
             }], grow: [{
                 type: Input
@@ -29386,20 +29309,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], wordBreakAllDesktop: [{
                 type: Input,
                 args: ['word-break-all--desktop']
-            }], change: [{
-                type: Output
             }] } });
 /**
- * @description Type-only wrapper for <px-radio-base>
+ * @description Type-only wrapper for <px-radio>
  */
-class PxRadioBase {
+class PxRadio {
     elementRef;
-    set hover(value) {
-        this.elementRef.nativeElement['hover'] = value;
+    /** The validation state of the radio button. */
+    set state(value) {
+        this.elementRef.nativeElement['state'] = value;
     }
-    get hover() {
-        return this.elementRef.nativeElement['hover'];
+    get state() {
+        return this.elementRef.nativeElement['state'];
     }
+    /** The visual variant of the radio button. */
+    set variant(value) {
+        this.elementRef.nativeElement['variant'] = value;
+    }
+    get variant() {
+        return this.elementRef.nativeElement['variant'];
+    }
+    /** Whether to use inverted (dark background) styling. */
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
     }
@@ -29412,6 +29342,41 @@ class PxRadioBase {
     get size() {
         return this.elementRef.nativeElement['size'];
     }
+    /** Whether the radio button is checked. */
+    set checked(value) {
+        this.elementRef.nativeElement['checked'] = value;
+    }
+    get checked() {
+        return this.elementRef.nativeElement['checked'];
+    }
+    /** Whether the radio button is disabled. */
+    set disabled(value) {
+        this.elementRef.nativeElement['disabled'] = value;
+    }
+    get disabled() {
+        return this.elementRef.nativeElement['disabled'];
+    }
+    /** Whether to apply hover styling. */
+    set hover(value) {
+        this.elementRef.nativeElement['hover'] = value;
+    }
+    get hover() {
+        return this.elementRef.nativeElement['hover'];
+    }
+    /** The name of the radio button, used for form submission. */
+    set name(value) {
+        this.elementRef.nativeElement['name'] = value;
+    }
+    get name() {
+        return this.elementRef.nativeElement['name'];
+    }
+    /** The value of the radio button, used for form submission. */
+    set value(value) {
+        this.elementRef.nativeElement['value'] = value;
+    }
+    get value() {
+        return this.elementRef.nativeElement['value'];
+    }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
     }
@@ -29724,24 +29689,41 @@ class PxRadioBase {
     get wordBreakAllDesktop() {
         return this.elementRef.nativeElement['wordBreakAllDesktop'];
     }
+    /** Fired when the radio button becomes checked. */
+    change = new EventEmitter();
     constructor(elementRef) {
         this.elementRef = elementRef;
+        this.elementRef.nativeElement.addEventListener('change', (e) => {
+            this.change.emit(e.detail);
+        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioBase, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRadioBase, isStandalone: true, selector: "px-radio-base", inputs: { hover: "hover", inverted: "inverted", size: "size", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadio, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRadio, isStandalone: true, selector: "px-radio", inputs: { state: "state", variant: "variant", inverted: "inverted", size: "size", checked: "checked", disabled: "disabled", hover: "hover", name: "name", value: "value", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, outputs: { change: "change" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadio, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-radio-base',
+                    selector: 'px-radio',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { hover: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { state: [{
+                type: Input
+            }], variant: [{
                 type: Input
             }], inverted: [{
                 type: Input
             }], size: [{
                 type: Input
+            }], checked: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], hover: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], value: [{
+                type: Input
             }], grow: [{
                 type: Input
             }], growMobile: [{
@@ -29893,47 +29875,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], wordBreakAllDesktop: [{
                 type: Input,
                 args: ['word-break-all--desktop']
+            }], change: [{
+                type: Output
             }] } });
 /**
- * @description Type-only wrapper for <px-radio-group>
+ * @description Type-only wrapper for <px-radio-base>
  */
-class PxRadioGroup {
+class PxRadioBase {
     elementRef;
-    set name(value) {
-        this.elementRef.nativeElement['name'] = value;
-    }
-    get name() {
-        return this.elementRef.nativeElement['name'];
-    }
-    set gap(value) {
-        this.elementRef.nativeElement['gap'] = value;
-    }
-    get gap() {
-        return this.elementRef.nativeElement['gap'];
-    }
-    set variant(value) {
-        this.elementRef.nativeElement['variant'] = value;
-    }
-    get variant() {
-        return this.elementRef.nativeElement['variant'];
-    }
-    set required(value) {
-        this.elementRef.nativeElement['required'] = value;
-    }
-    get required() {
-        return this.elementRef.nativeElement['required'];
-    }
-    set disabled(value) {
-        this.elementRef.nativeElement['disabled'] = value;
-    }
-    get disabled() {
-        return this.elementRef.nativeElement['disabled'];
-    }
-    set state(value) {
-        this.elementRef.nativeElement['state'] = value;
+    set hover(value) {
+        this.elementRef.nativeElement['hover'] = value;
     }
-    get state() {
-        return this.elementRef.nativeElement['state'];
+    get hover() {
+        return this.elementRef.nativeElement['hover'];
     }
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
@@ -30262,26 +30216,16 @@ class PxRadioGroup {
     constructor(elementRef) {
         this.elementRef = elementRef;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioGroup, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRadioGroup, isStandalone: true, selector: "px-radio-group", inputs: { name: "name", gap: "gap", variant: "variant", required: "required", disabled: "disabled", state: "state", inverted: "inverted", size: "size", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioBase, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRadioBase, isStandalone: true, selector: "px-radio-base", inputs: { hover: "hover", inverted: "inverted", size: "size", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioBase, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-radio-group',
+                    selector: 'px-radio-base',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { name: [{
-                type: Input
-            }], gap: [{
-                type: Input
-            }], variant: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], state: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { hover: [{
                 type: Input
             }], inverted: [{
                 type: Input
@@ -30440,16 +30384,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 args: ['word-break-all--desktop']
             }] } });
 /**
- * @description Type-only wrapper for <px-ribbon>
+ * @description Type-only wrapper for <px-radio-group>
  */
-class PxRibbon {
+class PxRadioGroup {
     elementRef;
+    set name(value) {
+        this.elementRef.nativeElement['name'] = value;
+    }
+    get name() {
+        return this.elementRef.nativeElement['name'];
+    }
+    set gap(value) {
+        this.elementRef.nativeElement['gap'] = value;
+    }
+    get gap() {
+        return this.elementRef.nativeElement['gap'];
+    }
+    set variant(value) {
+        this.elementRef.nativeElement['variant'] = value;
+    }
+    get variant() {
+        return this.elementRef.nativeElement['variant'];
+    }
+    set required(value) {
+        this.elementRef.nativeElement['required'] = value;
+    }
+    get required() {
+        return this.elementRef.nativeElement['required'];
+    }
+    set disabled(value) {
+        this.elementRef.nativeElement['disabled'] = value;
+    }
+    get disabled() {
+        return this.elementRef.nativeElement['disabled'];
+    }
+    set state(value) {
+        this.elementRef.nativeElement['state'] = value;
+    }
+    get state() {
+        return this.elementRef.nativeElement['state'];
+    }
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
     }
     get inverted() {
         return this.elementRef.nativeElement['inverted'];
     }
+    set size(value) {
+        this.elementRef.nativeElement['size'] = value;
+    }
+    get size() {
+        return this.elementRef.nativeElement['size'];
+    }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
     }
@@ -30765,16 +30751,30 @@ class PxRibbon {
     constructor(elementRef) {
         this.elementRef = elementRef;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRibbon, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRibbon, isStandalone: true, selector: "px-ribbon", inputs: { inverted: "inverted", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioGroup, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxRadioGroup, isStandalone: true, selector: "px-radio-group", inputs: { name: "name", gap: "gap", variant: "variant", required: "required", disabled: "disabled", state: "state", inverted: "inverted", size: "size", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRibbon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxRadioGroup, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-ribbon',
+                    selector: 'px-radio-group',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { name: [{
+                type: Input
+            }], gap: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], state: [{
+                type: Input
+            }], inverted: [{
+                type: Input
+            }], size: [{
                 type: Input
             }], grow: [{
                 type: Input
@@ -31634,27 +31634,57 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 args: ['word-break-all--desktop']
             }] } });
 /**
- * @description Type-only wrapper for <px-selectable-box>
+ * @description Type-only wrapper for <px-separator>
  */
-class PxSelectableBox {
+class PxSeparator {
     elementRef;
-    set inverted(value) {
-        this.elementRef.nativeElement['inverted'] = value;
+    set direction(value) {
+        this.elementRef.nativeElement['direction'] = value;
     }
-    get inverted() {
-        return this.elementRef.nativeElement['inverted'];
+    get direction() {
+        return this.elementRef.nativeElement['direction'];
     }
-    set hideFooter(value) {
-        this.elementRef.nativeElement['hideFooter'] = value;
+    set directionMobile(value) {
+        this.elementRef.nativeElement['directionMobile'] = value;
     }
-    get hideFooter() {
-        return this.elementRef.nativeElement['hideFooter'];
+    get directionMobile() {
+        return this.elementRef.nativeElement['directionMobile'];
     }
-    set footerPosition(value) {
-        this.elementRef.nativeElement['footerPosition'] = value;
+    set directionTablet(value) {
+        this.elementRef.nativeElement['directionTablet'] = value;
     }
-    get footerPosition() {
-        return this.elementRef.nativeElement['footerPosition'];
+    get directionTablet() {
+        return this.elementRef.nativeElement['directionTablet'];
+    }
+    set directionLaptop(value) {
+        this.elementRef.nativeElement['directionLaptop'] = value;
+    }
+    get directionLaptop() {
+        return this.elementRef.nativeElement['directionLaptop'];
+    }
+    set directionDesktop(value) {
+        this.elementRef.nativeElement['directionDesktop'] = value;
+    }
+    get directionDesktop() {
+        return this.elementRef.nativeElement['directionDesktop'];
+    }
+    set size(value) {
+        this.elementRef.nativeElement['size'] = value;
+    }
+    get size() {
+        return this.elementRef.nativeElement['size'];
+    }
+    set color(value) {
+        this.elementRef.nativeElement['color'] = value;
+    }
+    get color() {
+        return this.elementRef.nativeElement['color'];
+    }
+    set inverted(value) {
+        this.elementRef.nativeElement['inverted'] = value;
+    }
+    get inverted() {
+        return this.elementRef.nativeElement['inverted'];
     }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
@@ -31971,23 +32001,35 @@ class PxSelectableBox {
     constructor(elementRef) {
         this.elementRef = elementRef;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBox, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSelectableBox, isStandalone: true, selector: "px-selectable-box", inputs: { inverted: "inverted", hideFooter: ["hide-footer", "hideFooter"], footerPosition: ["footer-position", "footerPosition"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSeparator, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSeparator, isStandalone: true, selector: "px-separator", inputs: { direction: "direction", directionMobile: ["direction--mobile", "directionMobile"], directionTablet: ["direction--tablet", "directionTablet"], directionLaptop: ["direction--laptop", "directionLaptop"], directionDesktop: ["direction--desktop", "directionDesktop"], size: "size", color: "color", inverted: "inverted", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSeparator, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-selectable-box',
+                    selector: 'px-separator',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { direction: [{
                 type: Input
-            }], hideFooter: [{
+            }], directionMobile: [{
                 type: Input,
-                args: ['hide-footer']
-            }], footerPosition: [{
+                args: ['direction--mobile']
+            }], directionTablet: [{
                 type: Input,
-                args: ['footer-position']
+                args: ['direction--tablet']
+            }], directionLaptop: [{
+                type: Input,
+                args: ['direction--laptop']
+            }], directionDesktop: [{
+                type: Input,
+                args: ['direction--desktop']
+            }], size: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], inverted: [{
+                type: Input
             }], grow: [{
                 type: Input
             }], growMobile: [{
@@ -32141,9 +32183,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 args: ['word-break-all--desktop']
             }] } });
 /**
- * @description Type-only wrapper for <px-selectable-box-checkbox>
+ * @description Type-only wrapper for <px-selectable-box>
  */
-class PxSelectableBoxCheckbox {
+class PxSelectableBox {
     elementRef;
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
@@ -32151,29 +32193,11 @@ class PxSelectableBoxCheckbox {
     get inverted() {
         return this.elementRef.nativeElement['inverted'];
     }
-    set name(value) {
-        this.elementRef.nativeElement['name'] = value;
-    }
-    get name() {
-        return this.elementRef.nativeElement['name'];
-    }
-    set value(value) {
-        this.elementRef.nativeElement['value'] = value;
-    }
-    get value() {
-        return this.elementRef.nativeElement['value'];
-    }
-    set checked(value) {
-        this.elementRef.nativeElement['checked'] = value;
-    }
-    get checked() {
-        return this.elementRef.nativeElement['checked'];
-    }
-    set disabled(value) {
-        this.elementRef.nativeElement['disabled'] = value;
+    set hideFooter(value) {
+        this.elementRef.nativeElement['hideFooter'] = value;
     }
-    get disabled() {
-        return this.elementRef.nativeElement['disabled'];
+    get hideFooter() {
+        return this.elementRef.nativeElement['hideFooter'];
     }
     set footerPosition(value) {
         this.elementRef.nativeElement['footerPosition'] = value;
@@ -32493,32 +32517,23 @@ class PxSelectableBoxCheckbox {
     get wordBreakAllDesktop() {
         return this.elementRef.nativeElement['wordBreakAllDesktop'];
     }
-    change = new EventEmitter();
     constructor(elementRef) {
         this.elementRef = elementRef;
-        this.elementRef.nativeElement.addEventListener('change', (e) => {
-            this.change.emit(e.detail);
-        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxCheckbox, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSelectableBoxCheckbox, isStandalone: true, selector: "px-selectable-box-checkbox", inputs: { inverted: "inverted", name: "name", value: "value", checked: "checked", disabled: "disabled", footerPosition: ["footer-position", "footerPosition"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, outputs: { change: "change" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBox, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSelectableBox, isStandalone: true, selector: "px-selectable-box", inputs: { inverted: "inverted", hideFooter: ["hide-footer", "hideFooter"], footerPosition: ["footer-position", "footerPosition"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBox, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-selectable-box-checkbox',
+                    selector: 'px-selectable-box',
                     standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
                 type: Input
-            }], name: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], checked: [{
-                type: Input
-            }], disabled: [{
-                type: Input
+            }], hideFooter: [{
+                type: Input,
+                args: ['hide-footer']
             }], footerPosition: [{
                 type: Input,
                 args: ['footer-position']
@@ -32673,13 +32688,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], wordBreakAllDesktop: [{
                 type: Input,
                 args: ['word-break-all--desktop']
-            }], change: [{
-                type: Output
             }] } });
 /**
- * @description Type-only wrapper for <px-selectable-box-radio>
+ * @description Type-only wrapper for <px-selectable-box-checkbox>
  */
-class PxSelectableBoxRadio {
+class PxSelectableBoxCheckbox {
     elementRef;
     set inverted(value) {
         this.elementRef.nativeElement['inverted'] = value;
@@ -33029,28 +33042,20 @@ class PxSelectableBoxRadio {
     get wordBreakAllDesktop() {
         return this.elementRef.nativeElement['wordBreakAllDesktop'];
     }
-    SELECTABLE_BOX_RADIO_CONNECTED_EVENT = new EventEmitter();
-    SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT = new EventEmitter();
     change = new EventEmitter();
     constructor(elementRef) {
         this.elementRef = elementRef;
-        this.elementRef.nativeElement.addEventListener('SELECTABLE_BOX_RADIO_CONNECTED_EVENT', (e) => {
-            this.SELECTABLE_BOX_RADIO_CONNECTED_EVENT.emit(e.detail);
-        });
-        this.elementRef.nativeElement.addEventListener('SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT', (e) => {
-            this.SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT.emit(e.detail);
-        });
         this.elementRef.nativeElement.addEventListener('change', (e) => {
             this.change.emit(e.detail);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxRadio, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSelectableBoxRadio, isStandalone: true, selector: "px-selectable-box-radio", inputs: { inverted: "inverted", name: "name", value: "value", checked: "checked", disabled: "disabled", footerPosition: ["footer-position", "footerPosition"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, outputs: { SELECTABLE_BOX_RADIO_CONNECTED_EVENT: "SELECTABLE_BOX_RADIO_CONNECTED_EVENT", SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT: "SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT", change: "change" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxCheckbox, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSelectableBoxCheckbox, isStandalone: true, selector: "px-selectable-box-checkbox", inputs: { inverted: "inverted", name: "name", value: "value", checked: "checked", disabled: "disabled", footerPosition: ["footer-position", "footerPosition"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, outputs: { change: "change" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxCheckbox, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-selectable-box-radio',
+                    selector: 'px-selectable-box-checkbox',
                     standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
@@ -33217,65 +33222,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], wordBreakAllDesktop: [{
                 type: Input,
                 args: ['word-break-all--desktop']
-            }], SELECTABLE_BOX_RADIO_CONNECTED_EVENT: [{
-                type: Output
-            }], SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT: [{
-                type: Output
             }], change: [{
                 type: Output
             }] } });
 /**
- * @description Type-only wrapper for <px-separator>
+ * @description Type-only wrapper for <px-selectable-box-radio>
  */
-class PxSeparator {
+class PxSelectableBoxRadio {
     elementRef;
-    set direction(value) {
-        this.elementRef.nativeElement['direction'] = value;
-    }
-    get direction() {
-        return this.elementRef.nativeElement['direction'];
-    }
-    set directionMobile(value) {
-        this.elementRef.nativeElement['directionMobile'] = value;
-    }
-    get directionMobile() {
-        return this.elementRef.nativeElement['directionMobile'];
-    }
-    set directionTablet(value) {
-        this.elementRef.nativeElement['directionTablet'] = value;
+    set inverted(value) {
+        this.elementRef.nativeElement['inverted'] = value;
     }
-    get directionTablet() {
-        return this.elementRef.nativeElement['directionTablet'];
+    get inverted() {
+        return this.elementRef.nativeElement['inverted'];
     }
-    set directionLaptop(value) {
-        this.elementRef.nativeElement['directionLaptop'] = value;
+    set name(value) {
+        this.elementRef.nativeElement['name'] = value;
     }
-    get directionLaptop() {
-        return this.elementRef.nativeElement['directionLaptop'];
+    get name() {
+        return this.elementRef.nativeElement['name'];
     }
-    set directionDesktop(value) {
-        this.elementRef.nativeElement['directionDesktop'] = value;
+    set value(value) {
+        this.elementRef.nativeElement['value'] = value;
     }
-    get directionDesktop() {
-        return this.elementRef.nativeElement['directionDesktop'];
+    get value() {
+        return this.elementRef.nativeElement['value'];
     }
-    set size(value) {
-        this.elementRef.nativeElement['size'] = value;
+    set checked(value) {
+        this.elementRef.nativeElement['checked'] = value;
     }
-    get size() {
-        return this.elementRef.nativeElement['size'];
+    get checked() {
+        return this.elementRef.nativeElement['checked'];
     }
-    set color(value) {
-        this.elementRef.nativeElement['color'] = value;
+    set disabled(value) {
+        this.elementRef.nativeElement['disabled'] = value;
     }
-    get color() {
-        return this.elementRef.nativeElement['color'];
+    get disabled() {
+        return this.elementRef.nativeElement['disabled'];
     }
-    set inverted(value) {
-        this.elementRef.nativeElement['inverted'] = value;
+    set footerPosition(value) {
+        this.elementRef.nativeElement['footerPosition'] = value;
     }
-    get inverted() {
-        return this.elementRef.nativeElement['inverted'];
+    get footerPosition() {
+        return this.elementRef.nativeElement['footerPosition'];
     }
     set grow(value) {
         this.elementRef.nativeElement['grow'] = value;
@@ -33589,38 +33578,43 @@ class PxSeparator {
     get wordBreakAllDesktop() {
         return this.elementRef.nativeElement['wordBreakAllDesktop'];
     }
+    SELECTABLE_BOX_RADIO_CONNECTED_EVENT = new EventEmitter();
+    SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT = new EventEmitter();
+    change = new EventEmitter();
     constructor(elementRef) {
         this.elementRef = elementRef;
+        this.elementRef.nativeElement.addEventListener('SELECTABLE_BOX_RADIO_CONNECTED_EVENT', (e) => {
+            this.SELECTABLE_BOX_RADIO_CONNECTED_EVENT.emit(e.detail);
+        });
+        this.elementRef.nativeElement.addEventListener('SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT', (e) => {
+            this.SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT.emit(e.detail);
+        });
+        this.elementRef.nativeElement.addEventListener('change', (e) => {
+            this.change.emit(e.detail);
+        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSeparator, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSeparator, isStandalone: true, selector: "px-separator", inputs: { direction: "direction", directionMobile: ["direction--mobile", "directionMobile"], directionTablet: ["direction--tablet", "directionTablet"], directionLaptop: ["direction--laptop", "directionLaptop"], directionDesktop: ["direction--desktop", "directionDesktop"], size: "size", color: "color", inverted: "inverted", grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxRadio, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: PxSelectableBoxRadio, isStandalone: true, selector: "px-selectable-box-radio", inputs: { inverted: "inverted", name: "name", value: "value", checked: "checked", disabled: "disabled", footerPosition: ["footer-position", "footerPosition"], grow: "grow", growMobile: ["grow--mobile", "growMobile"], growTablet: ["grow--tablet", "growTablet"], growLaptop: ["grow--laptop", "growLaptop"], growDesktop: ["grow--desktop", "growDesktop"], shrink: "shrink", shrinkMobile: ["shrink--mobile", "shrinkMobile"], shrinkTablet: ["shrink--tablet", "shrinkTablet"], shrinkLaptop: ["shrink--laptop", "shrinkLaptop"], shrinkDesktop: ["shrink--desktop", "shrinkDesktop"], basis: "basis", basisMobile: ["basis--mobile", "basisMobile"], basisTablet: ["basis--tablet", "basisTablet"], basisLaptop: ["basis--laptop", "basisLaptop"], basisDesktop: ["basis--desktop", "basisDesktop"], alignSelf: ["align-self", "alignSelf"], alignSelfMobile: ["align-self--mobile", "alignSelfMobile"], alignSelfTablet: ["align-self--tablet", "alignSelfTablet"], alignSelfLaptop: ["align-self--laptop", "alignSelfLaptop"], alignSelfDesktop: ["align-self--desktop", "alignSelfDesktop"], justifySelf: ["justify-self", "justifySelf"], justifySelfMobile: ["justify-self--mobile", "justifySelfMobile"], justifySelfTablet: ["justify-self--tablet", "justifySelfTablet"], justifySelfLaptop: ["justify-self--laptop", "justifySelfLaptop"], justifySelfDesktop: ["justify-self--desktop", "justifySelfDesktop"], hidden: "hidden", hiddenMobile: ["hidden--mobile", "hiddenMobile"], hiddenTablet: ["hidden--tablet", "hiddenTablet"], hiddenLaptop: ["hidden--laptop", "hiddenLaptop"], hiddenDesktop: ["hidden--desktop", "hiddenDesktop"], shownSr: ["shown--sr", "shownSr"], shownSrMobile: ["shown--sr--mobile", "shownSrMobile"], shownSrTablet: ["shown--sr--tablet", "shownSrTablet"], shownSrLaptop: ["shown--sr--laptop", "shownSrLaptop"], shownSrDesktop: ["shown--sr--desktop", "shownSrDesktop"], colSpan: ["col-span", "colSpan"], colSpanMobile: ["col-span--mobile", "colSpanMobile"], colSpanTablet: ["col-span--tablet", "colSpanTablet"], colSpanLaptop: ["col-span--laptop", "colSpanLaptop"], colSpanDesktop: ["col-span--desktop", "colSpanDesktop"], order: "order", orderMobile: ["order--mobile", "orderMobile"], orderTablet: ["order--tablet", "orderTablet"], orderLaptop: ["order--laptop", "orderLaptop"], orderDesktop: ["order--desktop", "orderDesktop"], stickyTop: ["sticky-top", "stickyTop"], stickyBottom: ["sticky-bottom", "stickyBottom"], wordBreakAll: ["word-break-all", "wordBreakAll"], wordBreakAllMobile: ["word-break-all--mobile", "wordBreakAllMobile"], wordBreakAllTablet: ["word-break-all--tablet", "wordBreakAllTablet"], wordBreakAllLaptop: ["word-break-all--laptop", "wordBreakAllLaptop"], wordBreakAllDesktop: ["word-break-all--desktop", "wordBreakAllDesktop"] }, outputs: { SELECTABLE_BOX_RADIO_CONNECTED_EVENT: "SELECTABLE_BOX_RADIO_CONNECTED_EVENT", SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT: "SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT", change: "change" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PxSelectableBoxRadio, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'px-separator',
+                    selector: 'px-selectable-box-radio',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { direction: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inverted: [{
                 type: Input
-            }], directionMobile: [{
-                type: Input,
-                args: ['direction--mobile']
-            }], directionTablet: [{
-                type: Input,
-                args: ['direction--tablet']
-            }], directionLaptop: [{
-                type: Input,
-                args: ['direction--laptop']
-            }], directionDesktop: [{
-                type: Input,
-                args: ['direction--desktop']
-            }], size: [{
+            }], name: [{
                 type: Input
-            }], color: [{
+            }], value: [{
                 type: Input
-            }], inverted: [{
+            }], checked: [{
                 type: Input
+            }], disabled: [{
+                type: Input
+            }], footerPosition: [{
+                type: Input,
+                args: ['footer-position']
             }], grow: [{
                 type: Input
             }], growMobile: [{
@@ -33772,6 +33766,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], wordBreakAllDesktop: [{
                 type: Input,
                 args: ['word-break-all--desktop']
+            }], SELECTABLE_BOX_RADIO_CONNECTED_EVENT: [{
+                type: Output
+            }], SELECTABLE_BOX_RADIO_DISCONNECTED_EVENT: [{
+                type: Output
+            }], change: [{
+                type: Output
             }] } });
 /**
  * @description Type-only wrapper for <px-skeleton>
@@ -41329,7 +41329,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }] } });
 class Lavender {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: Lavender, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.25", ngImport: i0, type: Lavender, imports: [PxAccordion, PxAgGridTable, PxAgGridTableThButton, PxAgGridTableThContent, PxBanner, PxBreadcrumbItem, PxBreadcrumb, PxButton, PxButtonWrapper, PxButtonIcon, PxCard, PxAppleseed, PxCarousel, PxCarouselItem, PxCell, PxCellButton, PxCellCheckbox, PxCellLink, PxCellRadio, PxCellSwitch, PxCheckbox, PxColorOption, PxColorOptionLink, PxContainer, PxContentHeader, PxDrawer, PxDropdown, PxFieldset, PxGrid, PxH1, PxH2, PxH3, PxH4, PxH5, PxH6, PxHeadingGroup, PxImg, PxPicture, PxInput, PxSelect, PxTextarea, PxFileupload, PxPage, PxSpacer, PxStack, PxVstack, PxHstack, PxA, PxAWrapper, PxList, PxListItem, PxModal, PxP, PxPillar, PxCardActions, PxCardContainer, PxCardHeading, PxPrice, PxRadio, PxRadioBase, PxRadioGroup, PxRibbon, PxSection, PxSelectableBox, PxSelectableBoxCheckbox, PxSelectableBoxRadio, PxSeparator, PxSkeleton, PxSpan, PxSpinner, PxStatus, PxStatusCard, PxStickyContainer, PxThemeSwitcher, PxSwitch, PxTable, PxTbody, PxTd, PxTh, PxThead, PxTr, PxTabs, PxTab, PxTabPanel, PxTag, PxTile, PxTileButton, PxTileCheckbox, PxTileLink, PxTileRadio, PxTileSwitch, PxTimeline, PxTimelineItem, PxTypography, PxPatch, PxIcon, PxIconSet, PxThemeProvider, PxProximusThemeProvider, PxScarletThemeProvider], exports: [PxAccordion, PxAgGridTable, PxAgGridTableThButton, PxAgGridTableThContent, PxBanner, PxBreadcrumbItem, PxBreadcrumb, PxButton, PxButtonWrapper, PxButtonIcon, PxCard, PxAppleseed, PxCarousel, PxCarouselItem, PxCell, PxCellButton, PxCellCheckbox, PxCellLink, PxCellRadio, PxCellSwitch, PxCheckbox, PxColorOption, PxColorOptionLink, PxContainer, PxContentHeader, PxDrawer, PxDropdown, PxFieldset, PxGrid, PxH1, PxH2, PxH3, PxH4, PxH5, PxH6, PxHeadingGroup, PxImg, PxPicture, PxInput, PxSelect, PxTextarea, PxFileupload, PxPage, PxSpacer, PxStack, PxVstack, PxHstack, PxA, PxAWrapper, PxList, PxListItem, PxModal, PxP, PxPillar, PxCardActions, PxCardContainer, PxCardHeading, PxPrice, PxRadio, PxRadioBase, PxRadioGroup, PxRibbon, PxSection, PxSelectableBox, PxSelectableBoxCheckbox, PxSelectableBoxRadio, PxSeparator, PxSkeleton, PxSpan, PxSpinner, PxStatus, PxStatusCard, PxStickyContainer, PxThemeSwitcher, PxSwitch, PxTable, PxTbody, PxTd, PxTh, PxThead, PxTr, PxTabs, PxTab, PxTabPanel, PxTag, PxTile, PxTileButton, PxTileCheckbox, PxTileLink, PxTileRadio, PxTileSwitch, PxTimeline, PxTimelineItem, PxTypography, PxPatch, PxIcon, PxIconSet, PxThemeProvider, PxProximusThemeProvider, PxScarletThemeProvider] });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.25", ngImport: i0, type: Lavender, imports: [PxAccordion, PxAgGridTable, PxAgGridTableThButton, PxAgGridTableThContent, PxBanner, PxBreadcrumbItem, PxBreadcrumb, PxButton, PxButtonWrapper, PxCard, PxButtonIcon, PxAppleseed, PxCarousel, PxCarouselItem, PxCell, PxCellButton, PxCellCheckbox, PxCellLink, PxCellRadio, PxCellSwitch, PxCheckbox, PxColorOption, PxColorOptionLink, PxContainer, PxContentHeader, PxDrawer, PxDropdown, PxFieldset, PxGrid, PxH1, PxH2, PxH3, PxH4, PxH5, PxH6, PxHeadingGroup, PxImg, PxPicture, PxInput, PxSelect, PxTextarea, PxFileupload, PxPage, PxSpacer, PxStack, PxVstack, PxHstack, PxA, PxAWrapper, PxList, PxListItem, PxModal, PxP, PxCardActions, PxCardContainer, PxCardHeading, PxPillar, PxPrice, PxRibbon, PxRadio, PxRadioBase, PxRadioGroup, PxSection, PxSeparator, PxSelectableBox, PxSelectableBoxCheckbox, PxSelectableBoxRadio, PxSkeleton, PxSpan, PxSpinner, PxStatus, PxStatusCard, PxStickyContainer, PxThemeSwitcher, PxSwitch, PxTable, PxTbody, PxTd, PxTh, PxThead, PxTr, PxTabs, PxTab, PxTabPanel, PxTag, PxTile, PxTileButton, PxTileCheckbox, PxTileLink, PxTileRadio, PxTileSwitch, PxTimeline, PxTimelineItem, PxTypography, PxPatch, PxIcon, PxIconSet, PxThemeProvider, PxProximusThemeProvider, PxScarletThemeProvider], exports: [PxAccordion, PxAgGridTable, PxAgGridTableThButton, PxAgGridTableThContent, PxBanner, PxBreadcrumbItem, PxBreadcrumb, PxButton, PxButtonWrapper, PxCard, PxButtonIcon, PxAppleseed, PxCarousel, PxCarouselItem, PxCell, PxCellButton, PxCellCheckbox, PxCellLink, PxCellRadio, PxCellSwitch, PxCheckbox, PxColorOption, PxColorOptionLink, PxContainer, PxContentHeader, PxDrawer, PxDropdown, PxFieldset, PxGrid, PxH1, PxH2, PxH3, PxH4, PxH5, PxH6, PxHeadingGroup, PxImg, PxPicture, PxInput, PxSelect, PxTextarea, PxFileupload, PxPage, PxSpacer, PxStack, PxVstack, PxHstack, PxA, PxAWrapper, PxList, PxListItem, PxModal, PxP, PxCardActions, PxCardContainer, PxCardHeading, PxPillar, PxPrice, PxRibbon, PxRadio, PxRadioBase, PxRadioGroup, PxSection, PxSeparator, PxSelectableBox, PxSelectableBoxCheckbox, PxSelectableBoxRadio, PxSkeleton, PxSpan, PxSpinner, PxStatus, PxStatusCard, PxStickyContainer, PxThemeSwitcher, PxSwitch, PxTable, PxTbody, PxTd, PxTh, PxThead, PxTr, PxTabs, PxTab, PxTabPanel, PxTag, PxTile, PxTileButton, PxTileCheckbox, PxTileLink, PxTileRadio, PxTileSwitch, PxTimeline, PxTimelineItem, PxTypography, PxPatch, PxIcon, PxIconSet, PxThemeProvider, PxProximusThemeProvider, PxScarletThemeProvider] });
     static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: Lavender });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: Lavender, decorators: [{
@@ -41345,8 +41345,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         PxBreadcrumb,
                         PxButton,
                         PxButtonWrapper,
-                        PxButtonIcon,
                         PxCard,
+                        PxButtonIcon,
                         PxAppleseed,
                         PxCarousel,
                         PxCarouselItem,
@@ -41389,20 +41389,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         PxListItem,
                         PxModal,
                         PxP,
-                        PxPillar,
                         PxCardActions,
                         PxCardContainer,
                         PxCardHeading,
+                        PxPillar,
                         PxPrice,
+                        PxRibbon,
                         PxRadio,
                         PxRadioBase,
                         PxRadioGroup,
-                        PxRibbon,
                         PxSection,
+                        PxSeparator,
                         PxSelectableBox,
                         PxSelectableBoxCheckbox,
                         PxSelectableBoxRadio,
-                        PxSeparator,
                         PxSkeleton,
                         PxSpan,
                         PxSpinner,
@@ -41447,8 +41447,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         PxBreadcrumb,
                         PxButton,
                         PxButtonWrapper,
-                        PxButtonIcon,
                         PxCard,
+                        PxButtonIcon,
                         PxAppleseed,
                         PxCarousel,
                         PxCarouselItem,
@@ -41491,20 +41491,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         PxListItem,
                         PxModal,
                         PxP,
-                        PxPillar,
                         PxCardActions,
                         PxCardContainer,
                         PxCardHeading,
+                        PxPillar,
                         PxPrice,
+                        PxRibbon,
                         PxRadio,
                         PxRadioBase,
                         PxRadioGroup,
-                        PxRibbon,
                         PxSection,
+                        PxSeparator,
                         PxSelectableBox,
                         PxSelectableBoxCheckbox,
                         PxSelectableBoxRadio,
-                        PxSeparator,
                         PxSkeleton,
                         PxSpan,
                         PxSpinner,