@muxima-ui/radio-button 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -0
- package/esm2020/index.mjs +2 -0
- package/esm2020/lib/radio-button/radio-button.component.mjs +164 -0
- package/esm2020/muxima-ui-radio-button.mjs +5 -0
- package/fesm2015/muxima-ui-radio-button.mjs +171 -0
- package/fesm2015/muxima-ui-radio-button.mjs.map +1 -0
- package/fesm2020/muxima-ui-radio-button.mjs +171 -0
- package/fesm2020/muxima-ui-radio-button.mjs.map +1 -0
- package/index.d.ts +1 -0
- package/lib/radio-button/radio-button.component.d.ts +44 -0
- package/package.json +56 -0
package/README.md
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export * from './lib/radio-button/radio-button.component';
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9mb3JtL3JhZGlvLWJ1dHRvbi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYywyQ0FBMkMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vbGliL3JhZGlvLWJ1dHRvbi9yYWRpby1idXR0b24uY29tcG9uZW50JztcclxuIl19
|
|
@@ -0,0 +1,164 @@
|
|
|
1
|
+
import { Component, Input, Output, EventEmitter, forwardRef } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@angular/common";
|
|
6
|
+
export class RadioButtonComponent {
|
|
7
|
+
constructor() {
|
|
8
|
+
this.name = '';
|
|
9
|
+
this.label = '';
|
|
10
|
+
this.description = '';
|
|
11
|
+
this.icon = ''; // Icon or emoji
|
|
12
|
+
this.badge = ''; // Badge text (e.g., "New", "Popular")
|
|
13
|
+
this.price = ''; // For pricing cards
|
|
14
|
+
this.subtitle = ''; // Additional subtitle
|
|
15
|
+
this.disabled = false;
|
|
16
|
+
this.size = 'md';
|
|
17
|
+
this.color = 'primary';
|
|
18
|
+
this.variant = 'default';
|
|
19
|
+
this.required = false;
|
|
20
|
+
this.error = false;
|
|
21
|
+
this.helperText = '';
|
|
22
|
+
this.showCheckIcon = false; // Show checkmark when selected
|
|
23
|
+
this.glow = false; // Glow effect when selected
|
|
24
|
+
this.bordered = true; // Show border
|
|
25
|
+
this.rounded = true; // Rounded corners
|
|
26
|
+
this.valueChange = new EventEmitter();
|
|
27
|
+
this.radioChange = new EventEmitter();
|
|
28
|
+
this.onChange = () => { };
|
|
29
|
+
this.onTouched = () => { };
|
|
30
|
+
}
|
|
31
|
+
get isChecked() {
|
|
32
|
+
return this.selectedValue === this.value;
|
|
33
|
+
}
|
|
34
|
+
selectRadio(event) {
|
|
35
|
+
if (this.disabled) {
|
|
36
|
+
event?.preventDefault();
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
this.selectedValue = this.value;
|
|
40
|
+
this.valueChange.emit(this.value);
|
|
41
|
+
this.radioChange.emit({
|
|
42
|
+
value: this.value,
|
|
43
|
+
label: this.label
|
|
44
|
+
});
|
|
45
|
+
this.onChange(this.value);
|
|
46
|
+
this.onTouched();
|
|
47
|
+
}
|
|
48
|
+
// ControlValueAccessor methods
|
|
49
|
+
writeValue(value) {
|
|
50
|
+
this.selectedValue = value;
|
|
51
|
+
}
|
|
52
|
+
registerOnChange(fn) {
|
|
53
|
+
this.onChange = fn;
|
|
54
|
+
}
|
|
55
|
+
registerOnTouched(fn) {
|
|
56
|
+
this.onTouched = fn;
|
|
57
|
+
}
|
|
58
|
+
setDisabledState(isDisabled) {
|
|
59
|
+
this.disabled = isDisabled;
|
|
60
|
+
}
|
|
61
|
+
getWrapperClasses() {
|
|
62
|
+
const classes = ['muxima-radio-wrapper'];
|
|
63
|
+
if (this.disabled)
|
|
64
|
+
classes.push('muxima-radio-wrapper--disabled');
|
|
65
|
+
if (this.size)
|
|
66
|
+
classes.push(`muxima-radio-wrapper--${this.size}`);
|
|
67
|
+
if (this.variant)
|
|
68
|
+
classes.push(`muxima-radio-wrapper--${this.variant}`);
|
|
69
|
+
if (this.isChecked)
|
|
70
|
+
classes.push('muxima-radio-wrapper--checked');
|
|
71
|
+
if (this.error)
|
|
72
|
+
classes.push('muxima-radio-wrapper--error');
|
|
73
|
+
if (this.glow && this.isChecked)
|
|
74
|
+
classes.push('muxima-radio-wrapper--glow');
|
|
75
|
+
if (!this.bordered)
|
|
76
|
+
classes.push('muxima-radio-wrapper--no-border');
|
|
77
|
+
if (!this.rounded)
|
|
78
|
+
classes.push('muxima-radio-wrapper--square');
|
|
79
|
+
return classes;
|
|
80
|
+
}
|
|
81
|
+
getRadioClasses() {
|
|
82
|
+
const classes = ['muxima-radio'];
|
|
83
|
+
if (this.isChecked)
|
|
84
|
+
classes.push('muxima-radio--checked');
|
|
85
|
+
if (this.disabled)
|
|
86
|
+
classes.push('muxima-radio--disabled');
|
|
87
|
+
if (this.size)
|
|
88
|
+
classes.push(`muxima-radio--${this.size}`);
|
|
89
|
+
if (this.color)
|
|
90
|
+
classes.push(`muxima-radio--${this.color}`);
|
|
91
|
+
if (this.error)
|
|
92
|
+
classes.push('muxima-radio--error');
|
|
93
|
+
return classes;
|
|
94
|
+
}
|
|
95
|
+
getLabelClasses() {
|
|
96
|
+
const classes = ['muxima-radio-label'];
|
|
97
|
+
if (this.disabled)
|
|
98
|
+
classes.push('muxima-radio-label--disabled');
|
|
99
|
+
if (this.size)
|
|
100
|
+
classes.push(`muxima-radio-label--${this.size}`);
|
|
101
|
+
return classes;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
RadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
105
|
+
RadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: RadioButtonComponent, isStandalone: true, selector: "muxima-radio-button", inputs: { value: "value", name: "name", label: "label", description: "description", icon: "icon", badge: "badge", price: "price", subtitle: "subtitle", disabled: "disabled", size: "size", color: "color", variant: "variant", required: "required", error: "error", helperText: "helperText", showCheckIcon: "showCheckIcon", glow: "glow", bordered: "bordered", rounded: "rounded" }, outputs: { valueChange: "valueChange", radioChange: "radioChange" }, providers: [
|
|
106
|
+
{
|
|
107
|
+
provide: NG_VALUE_ACCESSOR,
|
|
108
|
+
useExisting: forwardRef(() => RadioButtonComponent),
|
|
109
|
+
multi: true
|
|
110
|
+
}
|
|
111
|
+
], ngImport: i0, template: "<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n", styles: [":host{--muxima-white: #FFFFFF;--muxima-primary: var(--muxima-primary, #3B82F6);--muxima-primary-dark: var(--muxima-primary-dark, #2563EB);--muxima-primary-light: var(--muxima-primary-light, #DBEAFE);--muxima-success: var(--muxima-success, #10B981);--muxima-success-dark: var(--muxima-success-dark, #059669);--muxima-success-light: var(--muxima-success-light, #D1FAE5);--muxima-warning: var(--muxima-warning, #F59E0B);--muxima-warning-dark: var(--muxima-warning-dark, #D97706);--muxima-warning-light: var(--muxima-warning-light, #FEF3C7);--muxima-danger: var(--muxima-danger, #EF4444);--muxima-danger-dark: var(--muxima-danger-dark, #DC2626);--muxima-danger-light: var(--muxima-danger-light, #FEE2E2);--muxima-info: var(--muxima-info, #06B6D4);--muxima-info-dark: var(--muxima-info-dark, #0891B2);--muxima-info-light: var(--muxima-info-light, #CFFAFE);--muxima-purple: #8B5CF6;--muxima-purple-dark: #7C3AED;--muxima-purple-light: #EDE9FE;--muxima-pink: #EC4899;--muxima-pink-dark: #DB2777;--muxima-pink-light: #FCE7F3;--muxima-gray-100: #F3F4F6;--muxima-gray-200: #E5E7EB;--muxima-gray-300: #D1D5DB;--muxima-gray-400: #9CA3AF;--muxima-gray-500: #6B7280;--muxima-gray-600: #4B5563;--muxima-gray-700: #374151;--muxima-gray-900: #111827;display:inline-block}.muxima-radio-wrapper{position:relative;display:inline-flex;align-items:flex-start;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}.muxima-radio-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.muxima-radio-wrapper--card{flex-direction:column;padding:1.5rem;border:2px solid var(--muxima-gray-200);border-radius:12px;background:var(--muxima-white);transition:all .3s cubic-bezier(.4,0,.2,1);min-width:200px}.muxima-radio-wrapper--card:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.muxima-radio-wrapper--card.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary-light);box-shadow:0 4px 16px #3b82f633}.muxima-radio-wrapper--button{padding:.75rem 1.5rem;border:2px solid var(--muxima-gray-300);border-radius:8px;background:var(--muxima-white);transition:all .2s ease;justify-content:center;min-width:120px}.muxima-radio-wrapper--button:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);background:var(--muxima-gray-100)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary);color:var(--muxima-white)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked .muxima-radio-label{color:var(--muxima-white);font-weight:600}.muxima-radio-wrapper--button .muxima-radio{display:none}.muxima-radio-wrapper--tile{flex-direction:column;align-items:center;padding:2rem 1.5rem;border:2px solid var(--muxima-gray-200);border-radius:16px;background:var(--muxima-white);transition:all .3s ease;min-width:150px;text-align:center}.muxima-radio-wrapper--tile:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 8px 24px #3b82f61f;transform:scale(1.02)}.muxima-radio-wrapper--tile.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:linear-gradient(135deg,var(--muxima-primary-light) 0%,var(--muxima-white) 100%);box-shadow:0 8px 24px #3b82f633}.muxima-radio-wrapper--tile .muxima-radio{order:-1;margin-bottom:1rem}.muxima-radio-wrapper--minimal{gap:.5rem}.muxima-radio-wrapper--minimal .muxima-radio-outer{border-width:1px}.muxima-radio-wrapper--glow.muxima-radio-wrapper--checked{filter:drop-shadow(0 0 12px rgba(59,130,246,.6))}.muxima-radio-wrapper--no-border{border:none!important}.muxima-radio-wrapper--square{border-radius:0!important}.muxima-radio-wrapper--error .muxima-radio-outer,.muxima-radio-wrapper--error.muxima-radio-wrapper--card,.muxima-radio-wrapper--error.muxima-radio-wrapper--tile{border-color:var(--muxima-danger)!important}.muxima-radio-badge{position:absolute;top:-8px;right:-8px;padding:.25rem .5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);color:var(--muxima-white);font-size:.625rem;font-weight:700;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #3b82f666;z-index:10}.muxima-radio-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--muxima-gray-100);border-radius:12px;margin-bottom:.75rem}.muxima-radio-icon-content{font-size:1.5rem}.muxima-radio-wrapper--checked .muxima-radio-icon{background:var(--muxima-primary-light)}.muxima-radio{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;outline:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.muxima-radio:focus-visible{box-shadow:0 0 0 3px #3b82f64d;border-radius:50%}.muxima-radio-outer{width:20px;height:20px;border:2px solid var(--muxima-gray-400);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--muxima-white);box-shadow:inset 0 1px 2px #0000000d}.muxima-radio:hover:not(.muxima-radio--disabled) .muxima-radio-outer{border-color:var(--muxima-primary);box-shadow:0 0 0 4px #3b82f61a}.muxima-radio-inner{width:10px;height:10px;border-radius:50%;animation:radioAppear .2s ease;box-shadow:0 2px 4px #0003}@keyframes radioAppear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.muxima-radio-check-icon{position:absolute;width:16px;height:16px;color:var(--muxima-white);animation:checkAppear .2s ease}@keyframes checkAppear{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio--primary.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-primary);background:var(--muxima-white)}.muxima-radio--primary.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%)}.muxima-radio--success.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-success)}.muxima-radio--success.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-success) 0%,var(--muxima-success-dark) 100%)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-warning)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-warning) 0%,var(--muxima-warning-dark) 100%)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-danger)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-danger) 0%,var(--muxima-danger-dark) 100%)}.muxima-radio--info.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-info)}.muxima-radio--info.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-info) 0%,var(--muxima-info-dark) 100%)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-purple)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-purple) 0%,var(--muxima-purple-dark) 100%)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-pink)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-pink) 0%,var(--muxima-pink-dark) 100%)}.muxima-radio--xs .muxima-radio-outer{width:14px;height:14px}.muxima-radio--xs .muxima-radio-inner{width:6px;height:6px}.muxima-radio--sm .muxima-radio-outer{width:16px;height:16px}.muxima-radio--sm .muxima-radio-inner{width:8px;height:8px}.muxima-radio--md .muxima-radio-outer{width:20px;height:20px}.muxima-radio--md .muxima-radio-inner{width:10px;height:10px}.muxima-radio--lg .muxima-radio-outer{width:24px;height:24px}.muxima-radio--lg .muxima-radio-inner{width:12px;height:12px}.muxima-radio--xl .muxima-radio-outer{width:28px;height:28px}.muxima-radio--xl .muxima-radio-inner{width:14px;height:14px}.muxima-radio-wrapper--xs{gap:.375rem}.muxima-radio-wrapper--sm{gap:.5rem}.muxima-radio-wrapper--md{gap:.75rem}.muxima-radio-wrapper--lg{gap:1rem}.muxima-radio-wrapper--xl{gap:1.25rem}.muxima-radio-content{display:flex;flex-direction:column;gap:.25rem;flex:1}.muxima-radio-label{font-size:.9375rem;font-weight:500;color:var(--muxima-gray-900);line-height:1.5}.muxima-radio-label--disabled{color:var(--muxima-gray-400)}.muxima-radio-subtitle{font-size:.8125rem;font-weight:500;color:var(--muxima-gray-600);line-height:1.4}.muxima-radio-description{font-size:.875rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-required{color:var(--muxima-danger);margin-left:.25rem}.muxima-radio-price{font-size:1.875rem;font-weight:700;color:var(--muxima-primary);margin-bottom:.5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muxima-radio-selected-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--muxima-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #3b82f666;animation:indicatorAppear .3s ease}.muxima-radio-selected-indicator svg{width:14px;height:14px;color:var(--muxima-white)}@keyframes indicatorAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio-helper{margin-top:.375rem;font-size:.8125rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-error-text{color:var(--muxima-danger);font-weight:500}.muxima-radio-label--xs{font-size:.8125rem}.muxima-radio-label--sm{font-size:.875rem}.muxima-radio-label--md{font-size:.9375rem}.muxima-radio-label--lg{font-size:1rem}.muxima-radio-label--xl{font-size:1.125rem}@media (max-width: 640px){.muxima-radio-wrapper--card,.muxima-radio-wrapper--tile{min-width:100%}.muxima-radio-wrapper--button{min-width:100px;padding:.625rem 1rem}.muxima-radio-price{font-size:1.5rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
112
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RadioButtonComponent, decorators: [{
|
|
113
|
+
type: Component,
|
|
114
|
+
args: [{ selector: 'muxima-radio-button', standalone: true, imports: [CommonModule], providers: [
|
|
115
|
+
{
|
|
116
|
+
provide: NG_VALUE_ACCESSOR,
|
|
117
|
+
useExisting: forwardRef(() => RadioButtonComponent),
|
|
118
|
+
multi: true
|
|
119
|
+
}
|
|
120
|
+
], template: "<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n", styles: [":host{--muxima-white: #FFFFFF;--muxima-primary: var(--muxima-primary, #3B82F6);--muxima-primary-dark: var(--muxima-primary-dark, #2563EB);--muxima-primary-light: var(--muxima-primary-light, #DBEAFE);--muxima-success: var(--muxima-success, #10B981);--muxima-success-dark: var(--muxima-success-dark, #059669);--muxima-success-light: var(--muxima-success-light, #D1FAE5);--muxima-warning: var(--muxima-warning, #F59E0B);--muxima-warning-dark: var(--muxima-warning-dark, #D97706);--muxima-warning-light: var(--muxima-warning-light, #FEF3C7);--muxima-danger: var(--muxima-danger, #EF4444);--muxima-danger-dark: var(--muxima-danger-dark, #DC2626);--muxima-danger-light: var(--muxima-danger-light, #FEE2E2);--muxima-info: var(--muxima-info, #06B6D4);--muxima-info-dark: var(--muxima-info-dark, #0891B2);--muxima-info-light: var(--muxima-info-light, #CFFAFE);--muxima-purple: #8B5CF6;--muxima-purple-dark: #7C3AED;--muxima-purple-light: #EDE9FE;--muxima-pink: #EC4899;--muxima-pink-dark: #DB2777;--muxima-pink-light: #FCE7F3;--muxima-gray-100: #F3F4F6;--muxima-gray-200: #E5E7EB;--muxima-gray-300: #D1D5DB;--muxima-gray-400: #9CA3AF;--muxima-gray-500: #6B7280;--muxima-gray-600: #4B5563;--muxima-gray-700: #374151;--muxima-gray-900: #111827;display:inline-block}.muxima-radio-wrapper{position:relative;display:inline-flex;align-items:flex-start;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}.muxima-radio-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.muxima-radio-wrapper--card{flex-direction:column;padding:1.5rem;border:2px solid var(--muxima-gray-200);border-radius:12px;background:var(--muxima-white);transition:all .3s cubic-bezier(.4,0,.2,1);min-width:200px}.muxima-radio-wrapper--card:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.muxima-radio-wrapper--card.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary-light);box-shadow:0 4px 16px #3b82f633}.muxima-radio-wrapper--button{padding:.75rem 1.5rem;border:2px solid var(--muxima-gray-300);border-radius:8px;background:var(--muxima-white);transition:all .2s ease;justify-content:center;min-width:120px}.muxima-radio-wrapper--button:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);background:var(--muxima-gray-100)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary);color:var(--muxima-white)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked .muxima-radio-label{color:var(--muxima-white);font-weight:600}.muxima-radio-wrapper--button .muxima-radio{display:none}.muxima-radio-wrapper--tile{flex-direction:column;align-items:center;padding:2rem 1.5rem;border:2px solid var(--muxima-gray-200);border-radius:16px;background:var(--muxima-white);transition:all .3s ease;min-width:150px;text-align:center}.muxima-radio-wrapper--tile:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 8px 24px #3b82f61f;transform:scale(1.02)}.muxima-radio-wrapper--tile.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:linear-gradient(135deg,var(--muxima-primary-light) 0%,var(--muxima-white) 100%);box-shadow:0 8px 24px #3b82f633}.muxima-radio-wrapper--tile .muxima-radio{order:-1;margin-bottom:1rem}.muxima-radio-wrapper--minimal{gap:.5rem}.muxima-radio-wrapper--minimal .muxima-radio-outer{border-width:1px}.muxima-radio-wrapper--glow.muxima-radio-wrapper--checked{filter:drop-shadow(0 0 12px rgba(59,130,246,.6))}.muxima-radio-wrapper--no-border{border:none!important}.muxima-radio-wrapper--square{border-radius:0!important}.muxima-radio-wrapper--error .muxima-radio-outer,.muxima-radio-wrapper--error.muxima-radio-wrapper--card,.muxima-radio-wrapper--error.muxima-radio-wrapper--tile{border-color:var(--muxima-danger)!important}.muxima-radio-badge{position:absolute;top:-8px;right:-8px;padding:.25rem .5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);color:var(--muxima-white);font-size:.625rem;font-weight:700;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #3b82f666;z-index:10}.muxima-radio-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--muxima-gray-100);border-radius:12px;margin-bottom:.75rem}.muxima-radio-icon-content{font-size:1.5rem}.muxima-radio-wrapper--checked .muxima-radio-icon{background:var(--muxima-primary-light)}.muxima-radio{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;outline:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.muxima-radio:focus-visible{box-shadow:0 0 0 3px #3b82f64d;border-radius:50%}.muxima-radio-outer{width:20px;height:20px;border:2px solid var(--muxima-gray-400);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--muxima-white);box-shadow:inset 0 1px 2px #0000000d}.muxima-radio:hover:not(.muxima-radio--disabled) .muxima-radio-outer{border-color:var(--muxima-primary);box-shadow:0 0 0 4px #3b82f61a}.muxima-radio-inner{width:10px;height:10px;border-radius:50%;animation:radioAppear .2s ease;box-shadow:0 2px 4px #0003}@keyframes radioAppear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.muxima-radio-check-icon{position:absolute;width:16px;height:16px;color:var(--muxima-white);animation:checkAppear .2s ease}@keyframes checkAppear{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio--primary.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-primary);background:var(--muxima-white)}.muxima-radio--primary.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%)}.muxima-radio--success.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-success)}.muxima-radio--success.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-success) 0%,var(--muxima-success-dark) 100%)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-warning)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-warning) 0%,var(--muxima-warning-dark) 100%)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-danger)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-danger) 0%,var(--muxima-danger-dark) 100%)}.muxima-radio--info.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-info)}.muxima-radio--info.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-info) 0%,var(--muxima-info-dark) 100%)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-purple)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-purple) 0%,var(--muxima-purple-dark) 100%)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-pink)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-pink) 0%,var(--muxima-pink-dark) 100%)}.muxima-radio--xs .muxima-radio-outer{width:14px;height:14px}.muxima-radio--xs .muxima-radio-inner{width:6px;height:6px}.muxima-radio--sm .muxima-radio-outer{width:16px;height:16px}.muxima-radio--sm .muxima-radio-inner{width:8px;height:8px}.muxima-radio--md .muxima-radio-outer{width:20px;height:20px}.muxima-radio--md .muxima-radio-inner{width:10px;height:10px}.muxima-radio--lg .muxima-radio-outer{width:24px;height:24px}.muxima-radio--lg .muxima-radio-inner{width:12px;height:12px}.muxima-radio--xl .muxima-radio-outer{width:28px;height:28px}.muxima-radio--xl .muxima-radio-inner{width:14px;height:14px}.muxima-radio-wrapper--xs{gap:.375rem}.muxima-radio-wrapper--sm{gap:.5rem}.muxima-radio-wrapper--md{gap:.75rem}.muxima-radio-wrapper--lg{gap:1rem}.muxima-radio-wrapper--xl{gap:1.25rem}.muxima-radio-content{display:flex;flex-direction:column;gap:.25rem;flex:1}.muxima-radio-label{font-size:.9375rem;font-weight:500;color:var(--muxima-gray-900);line-height:1.5}.muxima-radio-label--disabled{color:var(--muxima-gray-400)}.muxima-radio-subtitle{font-size:.8125rem;font-weight:500;color:var(--muxima-gray-600);line-height:1.4}.muxima-radio-description{font-size:.875rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-required{color:var(--muxima-danger);margin-left:.25rem}.muxima-radio-price{font-size:1.875rem;font-weight:700;color:var(--muxima-primary);margin-bottom:.5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muxima-radio-selected-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--muxima-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #3b82f666;animation:indicatorAppear .3s ease}.muxima-radio-selected-indicator svg{width:14px;height:14px;color:var(--muxima-white)}@keyframes indicatorAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio-helper{margin-top:.375rem;font-size:.8125rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-error-text{color:var(--muxima-danger);font-weight:500}.muxima-radio-label--xs{font-size:.8125rem}.muxima-radio-label--sm{font-size:.875rem}.muxima-radio-label--md{font-size:.9375rem}.muxima-radio-label--lg{font-size:1rem}.muxima-radio-label--xl{font-size:1.125rem}@media (max-width: 640px){.muxima-radio-wrapper--card,.muxima-radio-wrapper--tile{min-width:100%}.muxima-radio-wrapper--button{min-width:100px;padding:.625rem 1rem}.muxima-radio-price{font-size:1.5rem}}\n"] }]
|
|
121
|
+
}], propDecorators: { value: [{
|
|
122
|
+
type: Input
|
|
123
|
+
}], name: [{
|
|
124
|
+
type: Input
|
|
125
|
+
}], label: [{
|
|
126
|
+
type: Input
|
|
127
|
+
}], description: [{
|
|
128
|
+
type: Input
|
|
129
|
+
}], icon: [{
|
|
130
|
+
type: Input
|
|
131
|
+
}], badge: [{
|
|
132
|
+
type: Input
|
|
133
|
+
}], price: [{
|
|
134
|
+
type: Input
|
|
135
|
+
}], subtitle: [{
|
|
136
|
+
type: Input
|
|
137
|
+
}], disabled: [{
|
|
138
|
+
type: Input
|
|
139
|
+
}], size: [{
|
|
140
|
+
type: Input
|
|
141
|
+
}], color: [{
|
|
142
|
+
type: Input
|
|
143
|
+
}], variant: [{
|
|
144
|
+
type: Input
|
|
145
|
+
}], required: [{
|
|
146
|
+
type: Input
|
|
147
|
+
}], error: [{
|
|
148
|
+
type: Input
|
|
149
|
+
}], helperText: [{
|
|
150
|
+
type: Input
|
|
151
|
+
}], showCheckIcon: [{
|
|
152
|
+
type: Input
|
|
153
|
+
}], glow: [{
|
|
154
|
+
type: Input
|
|
155
|
+
}], bordered: [{
|
|
156
|
+
type: Input
|
|
157
|
+
}], rounded: [{
|
|
158
|
+
type: Input
|
|
159
|
+
}], valueChange: [{
|
|
160
|
+
type: Output
|
|
161
|
+
}], radioChange: [{
|
|
162
|
+
type: Output
|
|
163
|
+
}] } });
|
|
164
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmFkaW8tYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2Zvcm0vcmFkaW8tYnV0dG9uL3NyYy9saWIvcmFkaW8tYnV0dG9uL3JhZGlvLWJ1dHRvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9mb3JtL3JhZGlvLWJ1dHRvbi9zcmMvbGliL3JhZGlvLWJ1dHRvbi9yYWRpby1idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbkYsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBd0IsaUJBQWlCLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7O0FBb0J6RSxNQUFNLE9BQU8sb0JBQW9CO0lBZGpDO1FBZ0JXLFNBQUksR0FBVyxFQUFFLENBQUM7UUFDbEIsVUFBSyxHQUFXLEVBQUUsQ0FBQztRQUNuQixnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQUN6QixTQUFJLEdBQVcsRUFBRSxDQUFDLENBQUMsZ0JBQWdCO1FBQ25DLFVBQUssR0FBVyxFQUFFLENBQUMsQ0FBQyxzQ0FBc0M7UUFDMUQsVUFBSyxHQUFXLEVBQUUsQ0FBQyxDQUFDLG9CQUFvQjtRQUN4QyxhQUFRLEdBQVcsRUFBRSxDQUFDLENBQUMsc0JBQXNCO1FBQzdDLGFBQVEsR0FBWSxLQUFLLENBQUM7UUFDMUIsU0FBSSxHQUFjLElBQUksQ0FBQztRQUN2QixVQUFLLEdBQWUsU0FBUyxDQUFDO1FBQzlCLFlBQU8sR0FBaUIsU0FBUyxDQUFDO1FBQ2xDLGFBQVEsR0FBWSxLQUFLLENBQUM7UUFDMUIsVUFBSyxHQUFZLEtBQUssQ0FBQztRQUN2QixlQUFVLEdBQVcsRUFBRSxDQUFDO1FBQ3hCLGtCQUFhLEdB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QUksV0FDUCxDQUFDLFlBQVksQ0FBQyxhQUdaO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLHFCQUFxQixDQUFDOzRCQUNuRCxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRjs4QkFHUSxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUVJLFdBQVc7c0JBQXBCLE1BQU07Z0JBQ0csV0FBVztzQkFBcEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBmb3J3YXJkUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBOR19WQUxVRV9BQ0NFU1NPUiB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuXHJcbnR5cGUgUmFkaW9TaXplID0gJ3hzJyB8ICdzbScgfCAnbWQnIHwgJ2xnJyB8ICd4bCc7XHJcbnR5cGUgUmFkaW9Db2xvciA9ICdwcmltYXJ5JyB8ICdzdWNjZXNzJyB8ICd3YXJuaW5nJyB8ICdkYW5nZXInIHwgJ2luZm8nIHwgJ3B1cnBsZScgfCAncGluayc7XHJcbnR5cGUgUmFkaW9WYXJpYW50ID0gJ2RlZmF1bHQnIHwgJ2NhcmQnIHwgJ2J1dHRvbicgfCAndGlsZScgfCAnbWluaW1hbCc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ211eGltYS1yYWRpby1idXR0b24nLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3JhZGlvLWJ1dHRvbi5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vcmFkaW8tYnV0dG9uLmNvbXBvbmVudC5jc3MnXSxcclxuICBwcm92aWRlcnM6IFtcclxuICAgIHtcclxuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXHJcbiAgICAgIHVzZUV4aXN0aW5nOiBmb3J3YXJkUmVmKCgpID0+IFJhZGlvQnV0dG9uQ29tcG9uZW50KSxcclxuICAgICAgbXVsdGk6IHRydWVcclxuICAgIH1cclxuICBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBSYWRpb0J1dHRvbkNvbXBvbmVudCBpbXBsZW1lbnRzIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcclxuICBASW5wdXQoKSB2YWx1ZTogYW55O1xyXG4gIEBJbnB1dCgpIG5hbWU6IHN0cmluZyA9ICcnO1xyXG4gIEBJbnB1dCgpIGxhYmVsOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBkZXNjcmlwdGlvbjogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgaWNvbjogc3RyaW5nID0gJyc7IC8vIEljb24gb3IgZW1vamlcclxuICBASW5wdXQoKSBiYWRnZTogc3RyaW5nID0gJyc7IC8vIEJhZGdlIHRleHQgKGUuZy4sIFwiTmV3XCIsIFwiUG9wdWxhclwiKVxyXG4gIEBJbnB1dCgpIHByaWNlOiBzdHJpbmcgPSAnJzsgLy8gRm9yIHByaWNpbmcgY2FyZHNcclxuICBASW5wdXQoKSBzdWJ0aXRsZTogc3RyaW5nID0gJyc7IC8vIEFkZGl0aW9uYWwgc3VidGl0bGVcclxuICBASW5wdXQoKSBkaXNhYmxlZDogYm9vbGVhbiA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIHNpemU6IFJhZGlvU2l6ZSA9ICdtZCc7XHJcbiAgQElucHV0KCkgY29sb3I6IFJhZGlvQ29sb3IgPSAncHJpbWFyeSc7XHJcbiAgQElucHV0KCkgdmFyaWFudDogUmFkaW9WYXJpYW50ID0gJ2RlZmF1bHQnO1xyXG4gIEBJbnB1dCgpIHJlcXVpcmVkOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgZXJyb3I6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoKSBoZWxwZXJUZXh0OiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBzaG93Q2hlY2tJY29uOiBib29sZWFuID0gZmFsc2U7IC8vIFNob3cgY2hlY2ttYXJrIHdoZW4gc2VsZWN0ZWRcclxuICBASW5wdXQoKSBnbG93OiBib29sZWFuID0gZmFsc2U7IC8vIEdsb3cgZWZmZWN0IHdoZW4gc2VsZWN0ZWRcclxuICBASW5wdXQoKSBib3JkZXJlZDogYm9vbGVhbiA9IHRydWU7IC8vIFNob3cgYm9yZGVyXHJcbiAgQElucHV0KCkgcm91bmRlZDogYm9vbGVhbiA9IHRydWU7IC8vIFJvdW5kZWQgY29ybmVyc1xyXG4gIFxyXG4gIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xyXG4gIEBPdXRwdXQoKSByYWRpb0NoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xyXG5cclxuICBwcml2YXRlIHNlbGVjdGVkVmFsdWU6IGFueTtcclxuICBwcml2YXRlIG9uQ2hhbmdlOiAodmFsdWU6IGFueSkgPT4gdm9pZCA9ICgpID0+IHt9O1xyXG4gIHByaXZhdGUgb25Ub3VjaGVkOiAoKSA9PiB2b2lkID0gKCkgPT4ge307XHJcblxyXG4gIGdldCBpc0NoZWNrZWQoKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5zZWxlY3RlZFZhbHVlID09PSB0aGlzLnZhbHVlO1xyXG4gIH1cclxuXHJcbiAgc2VsZWN0UmFkaW8oZXZlbnQ/OiBFdmVudCk6IHZvaWQge1xyXG4gICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcclxuICAgICAgZXZlbnQ/LnByZXZlbnREZWZhdWx0KCk7XHJcbiAgICAgIHJldHVybjtcclxuICAgIH1cclxuICAgIFxyXG4gICAgdGhpcy5zZWxlY3RlZFZhbHVlID0gdGhpcy52YWx1ZTtcclxuICAgIHRoaXMudmFsdWVDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcclxuICAgIHRoaXMucmFkaW9DaGFuZ2UuZW1pdCh7XHJcbiAgICAgIHZhbHVlOiB0aGlzLnZhbHVlLFxyXG4gICAgICBsYWJlbDogdGhpcy5sYWJlbFxyXG4gICAgfSk7XHJcbiAgICB0aGlzLm9uQ2hhbmdlKHRoaXMudmFsdWUpO1xyXG4gICAgdGhpcy5vblRvdWNoZWQoKTtcclxuICB9XHJcblxyXG4gIC8vIENvbnRyb2xWYWx1ZUFjY2Vzc29yIG1ldGhvZHNcclxuICB3cml0ZVZhbHVlKHZhbHVlOiBhbnkpOiB2b2lkIHtcclxuICAgIHRoaXMuc2VsZWN0ZWRWYWx1ZSA9IHZhbHVlO1xyXG4gIH1cclxuXHJcbiAgcmVnaXN0ZXJPbkNoYW5nZShmbjogYW55KTogdm9pZCB7XHJcbiAgICB0aGlzLm9uQ2hhbmdlID0gZm47XHJcbiAgfVxyXG5cclxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XHJcbiAgICB0aGlzLm9uVG91Y2hlZCA9IGZuO1xyXG4gIH1cclxuXHJcbiAgc2V0RGlzYWJsZWRTdGF0ZShpc0Rpc2FibGVkOiBib29sZWFuKTogdm9pZCB7XHJcbiAgICB0aGlzLmRpc2FibGVkID0gaXNEaXNhYmxlZDtcclxuICB9XHJcblxyXG4gIGdldFdyYXBwZXJDbGFzc2VzKCk6IHN0cmluZ1tdIHtcclxuICAgIGNvbnN0IGNsYXNzZXMgPSBbJ211eGltYS1yYWRpby13cmFwcGVyJ107XHJcbiAgICBcclxuICAgIGlmICh0aGlzLmRpc2FibGVkKSBjbGFzc2VzLnB1c2goJ211eGltYS1yYWRpby13cmFwcGVyLS1kaXNhYmxlZCcpO1xyXG4gICAgaWYgKHRoaXMuc2l6ZSkgY2xhc3Nlcy5wdXNoKGBtdXhpbWEtcmFkaW8td3JhcHBlci0tJHt0aGlzLnNpemV9YCk7XHJcbiAgICBpZiAodGhpcy52YXJpYW50KSBjbGFzc2VzLnB1c2goYG11eGltYS1yYWRpby13cmFwcGVyLS0ke3RoaXMudmFyaWFudH1gKTtcclxuICAgIGlmICh0aGlzLmlzQ2hlY2tlZCkgY2xhc3Nlcy5wdXNoKCdtdXhpbWEtcmFkaW8td3JhcHBlci0tY2hlY2tlZCcpO1xyXG4gICAgaWYgKHRoaXMuZXJyb3IpIGNsYXNzZXMucHVzaCgnbXV4aW1hLXJhZGlvLXdyYXBwZXItLWVycm9yJyk7XHJcbiAgICBpZiAodGhpcy5nbG93ICYmIHRoaXMuaXNDaGVja2VkKSBjbGFzc2VzLnB1c2goJ211eGltYS1yYWRpby13cmFwcGVyLS1nbG93Jyk7XHJcbiAgICBpZiAoIXRoaXMuYm9yZGVyZWQpIGNsYXNzZXMucHVzaCgnbXV4aW1hLXJhZGlvLXdyYXBwZXItLW5vLWJvcmRlcicpO1xyXG4gICAgaWYgKCF0aGlzLnJvdW5kZWQpIGNsYXNzZXMucHVzaCgnbXV4aW1hLXJhZGlvLXdyYXBwZXItLXNxdWFyZScpO1xyXG4gICAgXHJcbiAgICByZXR1cm4gY2xhc3NlcztcclxuICB9XHJcblxyXG4gIGdldFJhZGlvQ2xhc3NlcygpOiBzdHJpbmdbXSB7XHJcbiAgICBjb25zdCBjbGFzc2VzID0gWydtdXhpbWEtcmFkaW8nXTtcclxuICAgIFxyXG4gICAgaWYgKHRoaXMuaXNDaGVja2VkKSBjbGFzc2VzLnB1c2goJ211eGltYS1yYWRpby0tY2hlY2tlZCcpO1xyXG4gICAgaWYgKHRoaXMuZGlzYWJsZWQpIGNsYXNzZXMucHVzaCgnbXV4aW1hLXJhZGlvLS1kaXNhYmxlZCcpO1xyXG4gICAgaWYgKHRoaXMuc2l6ZSkgY2xhc3Nlcy5wdXNoKGBtdXhpbWEtcmFkaW8tLSR7dGhpcy5zaXplfWApO1xyXG4gICAgaWYgKHRoaXMuY29sb3IpIGNsYXNzZXMucHVzaChgbXV4aW1hLXJhZGlvLS0ke3RoaXMuY29sb3J9YCk7XHJcbiAgICBpZiAodGhpcy5lcnJvcikgY2xhc3Nlcy5wdXNoKCdtdXhpbWEtcmFkaW8tLWVycm9yJyk7XHJcbiAgICBcclxuICAgIHJldHVybiBjbGFzc2VzO1xyXG4gIH1cclxuXHJcbiAgZ2V0TGFiZWxDbGFzc2VzKCk6IHN0cmluZ1tdIHtcclxuICAgIGNvbnN0IGNsYXNzZXMgPSBbJ211eGltYS1yYWRpby1sYWJlbCddO1xyXG4gICAgXHJcbiAgICBpZiAodGhpcy5kaXNhYmxlZCkgY2xhc3Nlcy5wdXNoKCdtdXhpbWEtcmFkaW8tbGFiZWwtLWRpc2FibGVkJyk7XHJcbiAgICBpZiAodGhpcy5zaXplKSBjbGFzc2VzLnB1c2goYG11eGltYS1yYWRpby1sYWJlbC0tJHt0aGlzLnNpemV9YCk7XHJcbiAgICBcclxuICAgIHJldHVybiBjbGFzc2VzO1xyXG4gIH1cclxufVxyXG5cclxuIiwiPGxhYmVsIFtuZ0NsYXNzXT1cImdldFdyYXBwZXJDbGFzc2VzKClcIiAoY2xpY2spPVwic2VsZWN0UmFkaW8oJGV2ZW50KVwiPlxuICA8IS0tIEJhZGdlIChOZXcsIFBvcHVsYXIsIGV0YykgLS0+XG4gIDxkaXYgY2xhc3M9XCJtdXhpbWEtcmFkaW8tYmFkZ2VcIiAqbmdJZj1cImJhZGdlICYmICFkaXNhYmxlZFwiPlxuICAgIHt7IGJhZGdlIH19XG4gIDwvZGl2PlxuXG4gIDwhLS0gSWNvbiAoZm9yIGNhcmQvdGlsZSB2YXJpYW50cykgLS0+XG4gIDxkaXYgY2xhc3M9XCJtdXhpbWEtcmFkaW8taWNvblwiICpuZ0lmPVwiaWNvblwiPlxuICAgIDxzcGFuIGNsYXNzPVwibXV4aW1hLXJhZGlvLWljb24tY29udGVudFwiPnt7IGljb24gfX08L3NwYW4+XG4gIDwvZGl2PlxuXG4gIDwhLS0gUmFkaW8gQ2lyY2xlIC0tPlxuICA8ZGl2IFxuICAgIFtuZ0NsYXNzXT1cImdldFJhZGlvQ2xhc3NlcygpXCJcbiAgICBbYXR0ci5hcmlhLWNoZWNrZWRdPVwiaXNDaGVja2VkXCJcbiAgICBbYXR0ci5hcmlhLWRpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICBbYXR0ci50YWJpbmRleF09XCJkaXNhYmxlZCA/IC0xIDogMFwiXG4gICAgcm9sZT1cInJhZGlvXCJcbiAgICAoa2V5ZG93bi5zcGFjZSk9XCIkZXZlbnQucHJldmVudERlZmF1bHQoKTsgc2VsZWN0UmFkaW8oJGV2ZW50KVwiXG4gICAgKGtleWRvd24uZW50ZXIpPVwiJGV2ZW50LnByZXZlbnREZWZhdWx0KCk7IHNlbGVjdFJhZGlvKCRldmVudClcIj5cbiAgICA8ZGl2IGNsYXNzPVwibXV4aW1hLXJhZGlvLW91dGVyXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwibXV4aW1hLXJhZGlvLWlubmVyXCIgKm5nSWY9XCJpc0NoZWNrZWRcIj48L2Rpdj5cbiAgICA8L2Rpdj5cbiAgICBcbiAgICA8IS0tIENoZWNrIEljb24gKGFsdGVybmF0aXZlIHRvIGRvdCkgLS0+XG4gICAgPHN2ZyAqbmdJZj1cInNob3dDaGVja0ljb24gJiYgaXNDaGVja2VkXCIgXG4gICAgICAgICBjbGFzcz1cIm11eGltYS1yYWRpby1jaGVjay1pY29uXCIgXG4gICAgICAgICB2aWV3Qm94PVwiMCAwIDI0IDI0XCIgXG4gICAgICAgICBmaWxsPVwibm9uZVwiIFxuICAgICAgICAgc3Ryb2tlPVwiY3VycmVudENvbG9yXCIgXG4gICAgICAgICBzdHJva2Utd2lkdGg9XCIzXCI+XG4gICAgICA8cG9seWxpbmUgcG9pbnRzPVwiMjAgNiA5IDE3IDQgMTJcIj48L3BvbHlsaW5lPlxuICAgIDwvc3ZnPlxuICA8L2Rpdj5cbiAgXG4gIDwhLS0gQ29udGVudCAtLT5cbiAgPGRpdiBjbGFzcz1cIm11eGltYS1yYWRpby1jb250ZW50XCIgKm5nSWY9XCJsYWJlbCB8fCBkZXNjcmlwdGlvbiB8fCBzdWJ0aXRsZSB8fCBwcmljZVwiPlxuICAgIDwhLS0gUHJpY2UgKGZvciBwcmljaW5nIGNhcmRzKSAtLT5cbiAgICA8ZGl2IGNsYXNzPVwibXV4aW1hLXJhZGlvLXByaWNlXCIgKm5nSWY9XCJwcmljZVwiPlxuICAgICAge3sgcHJpY2UgfX1cbiAgICA8L2Rpdj5cbiAgICBcbiAgICA8IS0tIExhYmVsIC0tPlxuICAgIDxzcGFuIFtuZ0NsYXNzXT1cImdldExhYmVsQ2xhc3NlcygpXCIgKm5nSWY9XCJsYWJlbFwiPlxuICAgICAge3sgbGFiZWwgfX1cbiAgICAgIDxzcGFuIGNsYXNzPVwibXV4aW1hLXJhZGlvLXJlcXVpcmVkXCIgKm5nSWY9XCJyZXF1aXJlZFwiPio8L3NwYW4+XG4gICAgPC9zcGFuPlxuICAgIFxuICAgIDwhLS0gU3VidGl0bGUgLS0+XG4gICAgPHNwYW4gY2xhc3M9XCJtdXhpbWEtcmFkaW8tc3VidGl0bGVcIiAqbmdJZj1cInN1YnRpdGxlXCI+e3sgc3VidGl0bGUgfX08L3NwYW4+XG4gICAgXG4gICAgPCEtLSBEZXNjcmlwdGlvbiAtLT5cbiAgICA8c3BhbiBjbGFzcz1cIm11eGltYS1yYWRpby1kZXNjcmlwdGlvblwiICpuZ0lmPVwiZGVzY3JpcHRpb25cIj57eyBkZXNjcmlwdGlvbiB9fTwvc3Bhbj5cbiAgPC9kaXY+XG4gIFxuICA8IS0tIFNlbGVjdGVkIEluZGljYXRvciAoZm9yIGJ1dHRvbi90aWxlIHZhcmlhbnRzKSAtLT5cbiAgPGRpdiBjbGFzcz1cIm11eGltYS1yYWRpby1zZWxlY3RlZC1pbmRpY2F0b3JcIiAqbmdJZj1cImlzQ2hlY2tlZCAmJiAodmFyaWFudCA9PT0gJ2NhcmQnIHx8IHZhcmlhbnQgPT09ICd0aWxlJylcIj5cbiAgICA8c3ZnIHZpZXdCb3g9XCIwIDAgMjQgMjRcIiBmaWxsPVwiY3VycmVudENvbG9yXCI+XG4gICAgICA8cGF0aCBkPVwiTTkgMTYuMTdMNC44MyAxMmwtMS40MiAxLjQxTDkgMTkgMjEgN2wtMS40MS0xLjQxelwiLz5cbiAgICA8L3N2Zz5cbiAgPC9kaXY+XG48L2xhYmVsPlxuXG48IS0tIEhlbHBlciBUZXh0IC8gRXJyb3IgTWVzc2FnZSAtLT5cbjxkaXYgY2xhc3M9XCJtdXhpbWEtcmFkaW8taGVscGVyXCIgKm5nSWY9XCJoZWxwZXJUZXh0ICYmICF2YXJpYW50XCI+XG4gIDxzcGFuIFtjbGFzcy5tdXhpbWEtcmFkaW8tZXJyb3ItdGV4dF09XCJlcnJvclwiPnt7IGhlbHBlclRleHQgfX08L3NwYW4+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generated bundle index. Do not edit.
|
|
3
|
+
*/
|
|
4
|
+
export * from './index';
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibXV4aW1hLXVpLXJhZGlvLWJ1dHRvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2Zvcm0vcmFkaW8tYnV0dG9uL3NyYy9tdXhpbWEtdWktcmFkaW8tYnV0dG9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxTQUFTLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vaW5kZXgnO1xuIl19
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { EventEmitter, forwardRef, Component, Input, Output } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/common';
|
|
4
|
+
import { CommonModule } from '@angular/common';
|
|
5
|
+
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
6
|
+
|
|
7
|
+
class RadioButtonComponent {
|
|
8
|
+
constructor() {
|
|
9
|
+
this.name = '';
|
|
10
|
+
this.label = '';
|
|
11
|
+
this.description = '';
|
|
12
|
+
this.icon = ''; // Icon or emoji
|
|
13
|
+
this.badge = ''; // Badge text (e.g., "New", "Popular")
|
|
14
|
+
this.price = ''; // For pricing cards
|
|
15
|
+
this.subtitle = ''; // Additional subtitle
|
|
16
|
+
this.disabled = false;
|
|
17
|
+
this.size = 'md';
|
|
18
|
+
this.color = 'primary';
|
|
19
|
+
this.variant = 'default';
|
|
20
|
+
this.required = false;
|
|
21
|
+
this.error = false;
|
|
22
|
+
this.helperText = '';
|
|
23
|
+
this.showCheckIcon = false; // Show checkmark when selected
|
|
24
|
+
this.glow = false; // Glow effect when selected
|
|
25
|
+
this.bordered = true; // Show border
|
|
26
|
+
this.rounded = true; // Rounded corners
|
|
27
|
+
this.valueChange = new EventEmitter();
|
|
28
|
+
this.radioChange = new EventEmitter();
|
|
29
|
+
this.onChange = () => { };
|
|
30
|
+
this.onTouched = () => { };
|
|
31
|
+
}
|
|
32
|
+
get isChecked() {
|
|
33
|
+
return this.selectedValue === this.value;
|
|
34
|
+
}
|
|
35
|
+
selectRadio(event) {
|
|
36
|
+
if (this.disabled) {
|
|
37
|
+
event === null || event === void 0 ? void 0 : event.preventDefault();
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
this.selectedValue = this.value;
|
|
41
|
+
this.valueChange.emit(this.value);
|
|
42
|
+
this.radioChange.emit({
|
|
43
|
+
value: this.value,
|
|
44
|
+
label: this.label
|
|
45
|
+
});
|
|
46
|
+
this.onChange(this.value);
|
|
47
|
+
this.onTouched();
|
|
48
|
+
}
|
|
49
|
+
// ControlValueAccessor methods
|
|
50
|
+
writeValue(value) {
|
|
51
|
+
this.selectedValue = value;
|
|
52
|
+
}
|
|
53
|
+
registerOnChange(fn) {
|
|
54
|
+
this.onChange = fn;
|
|
55
|
+
}
|
|
56
|
+
registerOnTouched(fn) {
|
|
57
|
+
this.onTouched = fn;
|
|
58
|
+
}
|
|
59
|
+
setDisabledState(isDisabled) {
|
|
60
|
+
this.disabled = isDisabled;
|
|
61
|
+
}
|
|
62
|
+
getWrapperClasses() {
|
|
63
|
+
const classes = ['muxima-radio-wrapper'];
|
|
64
|
+
if (this.disabled)
|
|
65
|
+
classes.push('muxima-radio-wrapper--disabled');
|
|
66
|
+
if (this.size)
|
|
67
|
+
classes.push(`muxima-radio-wrapper--${this.size}`);
|
|
68
|
+
if (this.variant)
|
|
69
|
+
classes.push(`muxima-radio-wrapper--${this.variant}`);
|
|
70
|
+
if (this.isChecked)
|
|
71
|
+
classes.push('muxima-radio-wrapper--checked');
|
|
72
|
+
if (this.error)
|
|
73
|
+
classes.push('muxima-radio-wrapper--error');
|
|
74
|
+
if (this.glow && this.isChecked)
|
|
75
|
+
classes.push('muxima-radio-wrapper--glow');
|
|
76
|
+
if (!this.bordered)
|
|
77
|
+
classes.push('muxima-radio-wrapper--no-border');
|
|
78
|
+
if (!this.rounded)
|
|
79
|
+
classes.push('muxima-radio-wrapper--square');
|
|
80
|
+
return classes;
|
|
81
|
+
}
|
|
82
|
+
getRadioClasses() {
|
|
83
|
+
const classes = ['muxima-radio'];
|
|
84
|
+
if (this.isChecked)
|
|
85
|
+
classes.push('muxima-radio--checked');
|
|
86
|
+
if (this.disabled)
|
|
87
|
+
classes.push('muxima-radio--disabled');
|
|
88
|
+
if (this.size)
|
|
89
|
+
classes.push(`muxima-radio--${this.size}`);
|
|
90
|
+
if (this.color)
|
|
91
|
+
classes.push(`muxima-radio--${this.color}`);
|
|
92
|
+
if (this.error)
|
|
93
|
+
classes.push('muxima-radio--error');
|
|
94
|
+
return classes;
|
|
95
|
+
}
|
|
96
|
+
getLabelClasses() {
|
|
97
|
+
const classes = ['muxima-radio-label'];
|
|
98
|
+
if (this.disabled)
|
|
99
|
+
classes.push('muxima-radio-label--disabled');
|
|
100
|
+
if (this.size)
|
|
101
|
+
classes.push(`muxima-radio-label--${this.size}`);
|
|
102
|
+
return classes;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
RadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
106
|
+
RadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: RadioButtonComponent, isStandalone: true, selector: "muxima-radio-button", inputs: { value: "value", name: "name", label: "label", description: "description", icon: "icon", badge: "badge", price: "price", subtitle: "subtitle", disabled: "disabled", size: "size", color: "color", variant: "variant", required: "required", error: "error", helperText: "helperText", showCheckIcon: "showCheckIcon", glow: "glow", bordered: "bordered", rounded: "rounded" }, outputs: { valueChange: "valueChange", radioChange: "radioChange" }, providers: [
|
|
107
|
+
{
|
|
108
|
+
provide: NG_VALUE_ACCESSOR,
|
|
109
|
+
useExisting: forwardRef(() => RadioButtonComponent),
|
|
110
|
+
multi: true
|
|
111
|
+
}
|
|
112
|
+
], ngImport: i0, template: "<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n", styles: [":host{--muxima-white: #FFFFFF;--muxima-primary: var(--muxima-primary, #3B82F6);--muxima-primary-dark: var(--muxima-primary-dark, #2563EB);--muxima-primary-light: var(--muxima-primary-light, #DBEAFE);--muxima-success: var(--muxima-success, #10B981);--muxima-success-dark: var(--muxima-success-dark, #059669);--muxima-success-light: var(--muxima-success-light, #D1FAE5);--muxima-warning: var(--muxima-warning, #F59E0B);--muxima-warning-dark: var(--muxima-warning-dark, #D97706);--muxima-warning-light: var(--muxima-warning-light, #FEF3C7);--muxima-danger: var(--muxima-danger, #EF4444);--muxima-danger-dark: var(--muxima-danger-dark, #DC2626);--muxima-danger-light: var(--muxima-danger-light, #FEE2E2);--muxima-info: var(--muxima-info, #06B6D4);--muxima-info-dark: var(--muxima-info-dark, #0891B2);--muxima-info-light: var(--muxima-info-light, #CFFAFE);--muxima-purple: #8B5CF6;--muxima-purple-dark: #7C3AED;--muxima-purple-light: #EDE9FE;--muxima-pink: #EC4899;--muxima-pink-dark: #DB2777;--muxima-pink-light: #FCE7F3;--muxima-gray-100: #F3F4F6;--muxima-gray-200: #E5E7EB;--muxima-gray-300: #D1D5DB;--muxima-gray-400: #9CA3AF;--muxima-gray-500: #6B7280;--muxima-gray-600: #4B5563;--muxima-gray-700: #374151;--muxima-gray-900: #111827;display:inline-block}.muxima-radio-wrapper{position:relative;display:inline-flex;align-items:flex-start;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}.muxima-radio-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.muxima-radio-wrapper--card{flex-direction:column;padding:1.5rem;border:2px solid var(--muxima-gray-200);border-radius:12px;background:var(--muxima-white);transition:all .3s cubic-bezier(.4,0,.2,1);min-width:200px}.muxima-radio-wrapper--card:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.muxima-radio-wrapper--card.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary-light);box-shadow:0 4px 16px #3b82f633}.muxima-radio-wrapper--button{padding:.75rem 1.5rem;border:2px solid var(--muxima-gray-300);border-radius:8px;background:var(--muxima-white);transition:all .2s ease;justify-content:center;min-width:120px}.muxima-radio-wrapper--button:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);background:var(--muxima-gray-100)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary);color:var(--muxima-white)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked .muxima-radio-label{color:var(--muxima-white);font-weight:600}.muxima-radio-wrapper--button .muxima-radio{display:none}.muxima-radio-wrapper--tile{flex-direction:column;align-items:center;padding:2rem 1.5rem;border:2px solid var(--muxima-gray-200);border-radius:16px;background:var(--muxima-white);transition:all .3s ease;min-width:150px;text-align:center}.muxima-radio-wrapper--tile:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 8px 24px #3b82f61f;transform:scale(1.02)}.muxima-radio-wrapper--tile.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:linear-gradient(135deg,var(--muxima-primary-light) 0%,var(--muxima-white) 100%);box-shadow:0 8px 24px #3b82f633}.muxima-radio-wrapper--tile .muxima-radio{order:-1;margin-bottom:1rem}.muxima-radio-wrapper--minimal{gap:.5rem}.muxima-radio-wrapper--minimal .muxima-radio-outer{border-width:1px}.muxima-radio-wrapper--glow.muxima-radio-wrapper--checked{filter:drop-shadow(0 0 12px rgba(59,130,246,.6))}.muxima-radio-wrapper--no-border{border:none!important}.muxima-radio-wrapper--square{border-radius:0!important}.muxima-radio-wrapper--error .muxima-radio-outer,.muxima-radio-wrapper--error.muxima-radio-wrapper--card,.muxima-radio-wrapper--error.muxima-radio-wrapper--tile{border-color:var(--muxima-danger)!important}.muxima-radio-badge{position:absolute;top:-8px;right:-8px;padding:.25rem .5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);color:var(--muxima-white);font-size:.625rem;font-weight:700;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #3b82f666;z-index:10}.muxima-radio-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--muxima-gray-100);border-radius:12px;margin-bottom:.75rem}.muxima-radio-icon-content{font-size:1.5rem}.muxima-radio-wrapper--checked .muxima-radio-icon{background:var(--muxima-primary-light)}.muxima-radio{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;outline:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.muxima-radio:focus-visible{box-shadow:0 0 0 3px #3b82f64d;border-radius:50%}.muxima-radio-outer{width:20px;height:20px;border:2px solid var(--muxima-gray-400);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--muxima-white);box-shadow:inset 0 1px 2px #0000000d}.muxima-radio:hover:not(.muxima-radio--disabled) .muxima-radio-outer{border-color:var(--muxima-primary);box-shadow:0 0 0 4px #3b82f61a}.muxima-radio-inner{width:10px;height:10px;border-radius:50%;animation:radioAppear .2s ease;box-shadow:0 2px 4px #0003}@keyframes radioAppear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.muxima-radio-check-icon{position:absolute;width:16px;height:16px;color:var(--muxima-white);animation:checkAppear .2s ease}@keyframes checkAppear{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio--primary.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-primary);background:var(--muxima-white)}.muxima-radio--primary.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%)}.muxima-radio--success.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-success)}.muxima-radio--success.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-success) 0%,var(--muxima-success-dark) 100%)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-warning)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-warning) 0%,var(--muxima-warning-dark) 100%)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-danger)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-danger) 0%,var(--muxima-danger-dark) 100%)}.muxima-radio--info.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-info)}.muxima-radio--info.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-info) 0%,var(--muxima-info-dark) 100%)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-purple)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-purple) 0%,var(--muxima-purple-dark) 100%)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-pink)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-pink) 0%,var(--muxima-pink-dark) 100%)}.muxima-radio--xs .muxima-radio-outer{width:14px;height:14px}.muxima-radio--xs .muxima-radio-inner{width:6px;height:6px}.muxima-radio--sm .muxima-radio-outer{width:16px;height:16px}.muxima-radio--sm .muxima-radio-inner{width:8px;height:8px}.muxima-radio--md .muxima-radio-outer{width:20px;height:20px}.muxima-radio--md .muxima-radio-inner{width:10px;height:10px}.muxima-radio--lg .muxima-radio-outer{width:24px;height:24px}.muxima-radio--lg .muxima-radio-inner{width:12px;height:12px}.muxima-radio--xl .muxima-radio-outer{width:28px;height:28px}.muxima-radio--xl .muxima-radio-inner{width:14px;height:14px}.muxima-radio-wrapper--xs{gap:.375rem}.muxima-radio-wrapper--sm{gap:.5rem}.muxima-radio-wrapper--md{gap:.75rem}.muxima-radio-wrapper--lg{gap:1rem}.muxima-radio-wrapper--xl{gap:1.25rem}.muxima-radio-content{display:flex;flex-direction:column;gap:.25rem;flex:1}.muxima-radio-label{font-size:.9375rem;font-weight:500;color:var(--muxima-gray-900);line-height:1.5}.muxima-radio-label--disabled{color:var(--muxima-gray-400)}.muxima-radio-subtitle{font-size:.8125rem;font-weight:500;color:var(--muxima-gray-600);line-height:1.4}.muxima-radio-description{font-size:.875rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-required{color:var(--muxima-danger);margin-left:.25rem}.muxima-radio-price{font-size:1.875rem;font-weight:700;color:var(--muxima-primary);margin-bottom:.5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muxima-radio-selected-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--muxima-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #3b82f666;animation:indicatorAppear .3s ease}.muxima-radio-selected-indicator svg{width:14px;height:14px;color:var(--muxima-white)}@keyframes indicatorAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio-helper{margin-top:.375rem;font-size:.8125rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-error-text{color:var(--muxima-danger);font-weight:500}.muxima-radio-label--xs{font-size:.8125rem}.muxima-radio-label--sm{font-size:.875rem}.muxima-radio-label--md{font-size:.9375rem}.muxima-radio-label--lg{font-size:1rem}.muxima-radio-label--xl{font-size:1.125rem}@media (max-width: 640px){.muxima-radio-wrapper--card,.muxima-radio-wrapper--tile{min-width:100%}.muxima-radio-wrapper--button{min-width:100px;padding:.625rem 1rem}.muxima-radio-price{font-size:1.5rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
113
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RadioButtonComponent, decorators: [{
|
|
114
|
+
type: Component,
|
|
115
|
+
args: [{ selector: 'muxima-radio-button', standalone: true, imports: [CommonModule], providers: [
|
|
116
|
+
{
|
|
117
|
+
provide: NG_VALUE_ACCESSOR,
|
|
118
|
+
useExisting: forwardRef(() => RadioButtonComponent),
|
|
119
|
+
multi: true
|
|
120
|
+
}
|
|
121
|
+
], template: "<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n", styles: [":host{--muxima-white: #FFFFFF;--muxima-primary: var(--muxima-primary, #3B82F6);--muxima-primary-dark: var(--muxima-primary-dark, #2563EB);--muxima-primary-light: var(--muxima-primary-light, #DBEAFE);--muxima-success: var(--muxima-success, #10B981);--muxima-success-dark: var(--muxima-success-dark, #059669);--muxima-success-light: var(--muxima-success-light, #D1FAE5);--muxima-warning: var(--muxima-warning, #F59E0B);--muxima-warning-dark: var(--muxima-warning-dark, #D97706);--muxima-warning-light: var(--muxima-warning-light, #FEF3C7);--muxima-danger: var(--muxima-danger, #EF4444);--muxima-danger-dark: var(--muxima-danger-dark, #DC2626);--muxima-danger-light: var(--muxima-danger-light, #FEE2E2);--muxima-info: var(--muxima-info, #06B6D4);--muxima-info-dark: var(--muxima-info-dark, #0891B2);--muxima-info-light: var(--muxima-info-light, #CFFAFE);--muxima-purple: #8B5CF6;--muxima-purple-dark: #7C3AED;--muxima-purple-light: #EDE9FE;--muxima-pink: #EC4899;--muxima-pink-dark: #DB2777;--muxima-pink-light: #FCE7F3;--muxima-gray-100: #F3F4F6;--muxima-gray-200: #E5E7EB;--muxima-gray-300: #D1D5DB;--muxima-gray-400: #9CA3AF;--muxima-gray-500: #6B7280;--muxima-gray-600: #4B5563;--muxima-gray-700: #374151;--muxima-gray-900: #111827;display:inline-block}.muxima-radio-wrapper{position:relative;display:inline-flex;align-items:flex-start;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}.muxima-radio-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.muxima-radio-wrapper--card{flex-direction:column;padding:1.5rem;border:2px solid var(--muxima-gray-200);border-radius:12px;background:var(--muxima-white);transition:all .3s cubic-bezier(.4,0,.2,1);min-width:200px}.muxima-radio-wrapper--card:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.muxima-radio-wrapper--card.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary-light);box-shadow:0 4px 16px #3b82f633}.muxima-radio-wrapper--button{padding:.75rem 1.5rem;border:2px solid var(--muxima-gray-300);border-radius:8px;background:var(--muxima-white);transition:all .2s ease;justify-content:center;min-width:120px}.muxima-radio-wrapper--button:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);background:var(--muxima-gray-100)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary);color:var(--muxima-white)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked .muxima-radio-label{color:var(--muxima-white);font-weight:600}.muxima-radio-wrapper--button .muxima-radio{display:none}.muxima-radio-wrapper--tile{flex-direction:column;align-items:center;padding:2rem 1.5rem;border:2px solid var(--muxima-gray-200);border-radius:16px;background:var(--muxima-white);transition:all .3s ease;min-width:150px;text-align:center}.muxima-radio-wrapper--tile:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 8px 24px #3b82f61f;transform:scale(1.02)}.muxima-radio-wrapper--tile.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:linear-gradient(135deg,var(--muxima-primary-light) 0%,var(--muxima-white) 100%);box-shadow:0 8px 24px #3b82f633}.muxima-radio-wrapper--tile .muxima-radio{order:-1;margin-bottom:1rem}.muxima-radio-wrapper--minimal{gap:.5rem}.muxima-radio-wrapper--minimal .muxima-radio-outer{border-width:1px}.muxima-radio-wrapper--glow.muxima-radio-wrapper--checked{filter:drop-shadow(0 0 12px rgba(59,130,246,.6))}.muxima-radio-wrapper--no-border{border:none!important}.muxima-radio-wrapper--square{border-radius:0!important}.muxima-radio-wrapper--error .muxima-radio-outer,.muxima-radio-wrapper--error.muxima-radio-wrapper--card,.muxima-radio-wrapper--error.muxima-radio-wrapper--tile{border-color:var(--muxima-danger)!important}.muxima-radio-badge{position:absolute;top:-8px;right:-8px;padding:.25rem .5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);color:var(--muxima-white);font-size:.625rem;font-weight:700;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #3b82f666;z-index:10}.muxima-radio-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--muxima-gray-100);border-radius:12px;margin-bottom:.75rem}.muxima-radio-icon-content{font-size:1.5rem}.muxima-radio-wrapper--checked .muxima-radio-icon{background:var(--muxima-primary-light)}.muxima-radio{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;outline:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.muxima-radio:focus-visible{box-shadow:0 0 0 3px #3b82f64d;border-radius:50%}.muxima-radio-outer{width:20px;height:20px;border:2px solid var(--muxima-gray-400);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--muxima-white);box-shadow:inset 0 1px 2px #0000000d}.muxima-radio:hover:not(.muxima-radio--disabled) .muxima-radio-outer{border-color:var(--muxima-primary);box-shadow:0 0 0 4px #3b82f61a}.muxima-radio-inner{width:10px;height:10px;border-radius:50%;animation:radioAppear .2s ease;box-shadow:0 2px 4px #0003}@keyframes radioAppear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.muxima-radio-check-icon{position:absolute;width:16px;height:16px;color:var(--muxima-white);animation:checkAppear .2s ease}@keyframes checkAppear{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio--primary.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-primary);background:var(--muxima-white)}.muxima-radio--primary.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%)}.muxima-radio--success.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-success)}.muxima-radio--success.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-success) 0%,var(--muxima-success-dark) 100%)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-warning)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-warning) 0%,var(--muxima-warning-dark) 100%)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-danger)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-danger) 0%,var(--muxima-danger-dark) 100%)}.muxima-radio--info.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-info)}.muxima-radio--info.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-info) 0%,var(--muxima-info-dark) 100%)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-purple)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-purple) 0%,var(--muxima-purple-dark) 100%)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-pink)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-pink) 0%,var(--muxima-pink-dark) 100%)}.muxima-radio--xs .muxima-radio-outer{width:14px;height:14px}.muxima-radio--xs .muxima-radio-inner{width:6px;height:6px}.muxima-radio--sm .muxima-radio-outer{width:16px;height:16px}.muxima-radio--sm .muxima-radio-inner{width:8px;height:8px}.muxima-radio--md .muxima-radio-outer{width:20px;height:20px}.muxima-radio--md .muxima-radio-inner{width:10px;height:10px}.muxima-radio--lg .muxima-radio-outer{width:24px;height:24px}.muxima-radio--lg .muxima-radio-inner{width:12px;height:12px}.muxima-radio--xl .muxima-radio-outer{width:28px;height:28px}.muxima-radio--xl .muxima-radio-inner{width:14px;height:14px}.muxima-radio-wrapper--xs{gap:.375rem}.muxima-radio-wrapper--sm{gap:.5rem}.muxima-radio-wrapper--md{gap:.75rem}.muxima-radio-wrapper--lg{gap:1rem}.muxima-radio-wrapper--xl{gap:1.25rem}.muxima-radio-content{display:flex;flex-direction:column;gap:.25rem;flex:1}.muxima-radio-label{font-size:.9375rem;font-weight:500;color:var(--muxima-gray-900);line-height:1.5}.muxima-radio-label--disabled{color:var(--muxima-gray-400)}.muxima-radio-subtitle{font-size:.8125rem;font-weight:500;color:var(--muxima-gray-600);line-height:1.4}.muxima-radio-description{font-size:.875rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-required{color:var(--muxima-danger);margin-left:.25rem}.muxima-radio-price{font-size:1.875rem;font-weight:700;color:var(--muxima-primary);margin-bottom:.5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muxima-radio-selected-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--muxima-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #3b82f666;animation:indicatorAppear .3s ease}.muxima-radio-selected-indicator svg{width:14px;height:14px;color:var(--muxima-white)}@keyframes indicatorAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio-helper{margin-top:.375rem;font-size:.8125rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-error-text{color:var(--muxima-danger);font-weight:500}.muxima-radio-label--xs{font-size:.8125rem}.muxima-radio-label--sm{font-size:.875rem}.muxima-radio-label--md{font-size:.9375rem}.muxima-radio-label--lg{font-size:1rem}.muxima-radio-label--xl{font-size:1.125rem}@media (max-width: 640px){.muxima-radio-wrapper--card,.muxima-radio-wrapper--tile{min-width:100%}.muxima-radio-wrapper--button{min-width:100px;padding:.625rem 1rem}.muxima-radio-price{font-size:1.5rem}}\n"] }]
|
|
122
|
+
}], propDecorators: { value: [{
|
|
123
|
+
type: Input
|
|
124
|
+
}], name: [{
|
|
125
|
+
type: Input
|
|
126
|
+
}], label: [{
|
|
127
|
+
type: Input
|
|
128
|
+
}], description: [{
|
|
129
|
+
type: Input
|
|
130
|
+
}], icon: [{
|
|
131
|
+
type: Input
|
|
132
|
+
}], badge: [{
|
|
133
|
+
type: Input
|
|
134
|
+
}], price: [{
|
|
135
|
+
type: Input
|
|
136
|
+
}], subtitle: [{
|
|
137
|
+
type: Input
|
|
138
|
+
}], disabled: [{
|
|
139
|
+
type: Input
|
|
140
|
+
}], size: [{
|
|
141
|
+
type: Input
|
|
142
|
+
}], color: [{
|
|
143
|
+
type: Input
|
|
144
|
+
}], variant: [{
|
|
145
|
+
type: Input
|
|
146
|
+
}], required: [{
|
|
147
|
+
type: Input
|
|
148
|
+
}], error: [{
|
|
149
|
+
type: Input
|
|
150
|
+
}], helperText: [{
|
|
151
|
+
type: Input
|
|
152
|
+
}], showCheckIcon: [{
|
|
153
|
+
type: Input
|
|
154
|
+
}], glow: [{
|
|
155
|
+
type: Input
|
|
156
|
+
}], bordered: [{
|
|
157
|
+
type: Input
|
|
158
|
+
}], rounded: [{
|
|
159
|
+
type: Input
|
|
160
|
+
}], valueChange: [{
|
|
161
|
+
type: Output
|
|
162
|
+
}], radioChange: [{
|
|
163
|
+
type: Output
|
|
164
|
+
}] } });
|
|
165
|
+
|
|
166
|
+
/**
|
|
167
|
+
* Generated bundle index. Do not edit.
|
|
168
|
+
*/
|
|
169
|
+
|
|
170
|
+
export { RadioButtonComponent };
|
|
171
|
+
//# sourceMappingURL=muxima-ui-radio-button.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"muxima-ui-radio-button.mjs","sources":["../../../../form/radio-button/src/lib/radio-button/radio-button.component.ts","../../../../form/radio-button/src/lib/radio-button/radio-button.component.html","../../../../form/radio-button/src/muxima-ui-radio-button.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter, forwardRef } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\ntype RadioSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\r\ntype RadioColor = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'purple' | 'pink';\r\ntype RadioVariant = 'default' | 'card' | 'button' | 'tile' | 'minimal';\r\n\r\n@Component({\r\n selector: 'muxima-radio-button',\r\n standalone: true,\r\n imports: [CommonModule],\r\n templateUrl: './radio-button.component.html',\r\n styleUrls: ['./radio-button.component.css'],\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => RadioButtonComponent),\r\n multi: true\r\n }\r\n ]\r\n})\r\nexport class RadioButtonComponent implements ControlValueAccessor {\r\n @Input() value: any;\r\n @Input() name: string = '';\r\n @Input() label: string = '';\r\n @Input() description: string = '';\r\n @Input() icon: string = ''; // Icon or emoji\r\n @Input() badge: string = ''; // Badge text (e.g., \"New\", \"Popular\")\r\n @Input() price: string = ''; // For pricing cards\r\n @Input() subtitle: string = ''; // Additional subtitle\r\n @Input() disabled: boolean = false;\r\n @Input() size: RadioSize = 'md';\r\n @Input() color: RadioColor = 'primary';\r\n @Input() variant: RadioVariant = 'default';\r\n @Input() required: boolean = false;\r\n @Input() error: boolean = false;\r\n @Input() helperText: string = '';\r\n @Input() showCheckIcon: boolean = false; // Show checkmark when selected\r\n @Input() glow: boolean = false; // Glow effect when selected\r\n @Input() bordered: boolean = true; // Show border\r\n @Input() rounded: boolean = true; // Rounded corners\r\n \r\n @Output() valueChange = new EventEmitter<any>();\r\n @Output() radioChange = new EventEmitter<any>();\r\n\r\n private selectedValue: any;\r\n private onChange: (value: any) => void = () => {};\r\n private onTouched: () => void = () => {};\r\n\r\n get isChecked(): boolean {\r\n return this.selectedValue === this.value;\r\n }\r\n\r\n selectRadio(event?: Event): void {\r\n if (this.disabled) {\r\n event?.preventDefault();\r\n return;\r\n }\r\n \r\n this.selectedValue = this.value;\r\n this.valueChange.emit(this.value);\r\n this.radioChange.emit({\r\n value: this.value,\r\n label: this.label\r\n });\r\n this.onChange(this.value);\r\n this.onTouched();\r\n }\r\n\r\n // ControlValueAccessor methods\r\n writeValue(value: any): void {\r\n this.selectedValue = value;\r\n }\r\n\r\n registerOnChange(fn: any): void {\r\n this.onChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: any): void {\r\n this.onTouched = fn;\r\n }\r\n\r\n setDisabledState(isDisabled: boolean): void {\r\n this.disabled = isDisabled;\r\n }\r\n\r\n getWrapperClasses(): string[] {\r\n const classes = ['muxima-radio-wrapper'];\r\n \r\n if (this.disabled) classes.push('muxima-radio-wrapper--disabled');\r\n if (this.size) classes.push(`muxima-radio-wrapper--${this.size}`);\r\n if (this.variant) classes.push(`muxima-radio-wrapper--${this.variant}`);\r\n if (this.isChecked) classes.push('muxima-radio-wrapper--checked');\r\n if (this.error) classes.push('muxima-radio-wrapper--error');\r\n if (this.glow && this.isChecked) classes.push('muxima-radio-wrapper--glow');\r\n if (!this.bordered) classes.push('muxima-radio-wrapper--no-border');\r\n if (!this.rounded) classes.push('muxima-radio-wrapper--square');\r\n \r\n return classes;\r\n }\r\n\r\n getRadioClasses(): string[] {\r\n const classes = ['muxima-radio'];\r\n \r\n if (this.isChecked) classes.push('muxima-radio--checked');\r\n if (this.disabled) classes.push('muxima-radio--disabled');\r\n if (this.size) classes.push(`muxima-radio--${this.size}`);\r\n if (this.color) classes.push(`muxima-radio--${this.color}`);\r\n if (this.error) classes.push('muxima-radio--error');\r\n \r\n return classes;\r\n }\r\n\r\n getLabelClasses(): string[] {\r\n const classes = ['muxima-radio-label'];\r\n \r\n if (this.disabled) classes.push('muxima-radio-label--disabled');\r\n if (this.size) classes.push(`muxima-radio-label--${this.size}`);\r\n \r\n return classes;\r\n }\r\n}\r\n\r\n","<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAsBa,oBAAoB,CAAA;AAdjC,IAAA,WAAA,GAAA;AAgBW,QAAA,IAAI,CAAA,IAAA,GAAW,EAAE,CAAC;AAClB,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE,CAAC;AACnB,QAAA,IAAW,CAAA,WAAA,GAAW,EAAE,CAAC;AACzB,QAAA,IAAA,CAAA,IAAI,GAAW,EAAE,CAAC;AAClB,QAAA,IAAA,CAAA,KAAK,GAAW,EAAE,CAAC;AACnB,QAAA,IAAA,CAAA,KAAK,GAAW,EAAE,CAAC;AACnB,QAAA,IAAA,CAAA,QAAQ,GAAW,EAAE,CAAC;AACtB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK,CAAC;AAC1B,QAAA,IAAI,CAAA,IAAA,GAAc,IAAI,CAAC;AACvB,QAAA,IAAK,CAAA,KAAA,GAAe,SAAS,CAAC;AAC9B,QAAA,IAAO,CAAA,OAAA,GAAiB,SAAS,CAAC;AAClC,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK,CAAC;AAC1B,QAAA,IAAK,CAAA,KAAA,GAAY,KAAK,CAAC;AACvB,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE,CAAC;AACxB,QAAA,IAAA,CAAA,aAAa,GAAY,KAAK,CAAC;AAC/B,QAAA,IAAA,CAAA,IAAI,GAAY,KAAK,CAAC;AACtB,QAAA,IAAA,CAAA,QAAQ,GAAY,IAAI,CAAC;AACzB,QAAA,IAAA,CAAA,OAAO,GAAY,IAAI,CAAC;AAEvB,QAAA,IAAA,CAAA,WAAW,GAAG,IAAI,YAAY,EAAO,CAAC;AACtC,QAAA,IAAA,CAAA,WAAW,GAAG,IAAI,YAAY,EAAO,CAAC;AAGxC,QAAA,IAAA,CAAA,QAAQ,GAAyB,MAAK,GAAG,CAAC;AAC1C,QAAA,IAAA,CAAA,SAAS,GAAe,MAAK,GAAG,CAAC;KA0E1C;AAxEC,IAAA,IAAI,SAAS,GAAA;AACX,QAAA,OAAO,IAAI,CAAC,aAAa,KAAK,IAAI,CAAC,KAAK,CAAC;KAC1C;AAED,IAAA,WAAW,CAAC,KAAa,EAAA;QACvB,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,KAAK,aAAL,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAL,KAAK,CAAE,cAAc,EAAE,CAAC;YACxB,OAAO;AACR,SAAA;AAED,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;QAChC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AAClC,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;YACpB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,KAAK,EAAE,IAAI,CAAC,KAAK;AAClB,SAAA,CAAC,CAAC;AACH,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;;AAGD,IAAA,UAAU,CAAC,KAAU,EAAA;AACnB,QAAA,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;KAC5B;AAED,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;KACpB;AAED,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;KACrB;AAED,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAClC,QAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;KAC5B;IAED,iBAAiB,GAAA;AACf,QAAA,MAAM,OAAO,GAAG,CAAC,sBAAsB,CAAC,CAAC;QAEzC,IAAI,IAAI,CAAC,QAAQ;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,gCAAgC,CAAC,CAAC;QAClE,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,CAAA,sBAAA,EAAyB,IAAI,CAAC,IAAI,CAAE,CAAA,CAAC,CAAC;QAClE,IAAI,IAAI,CAAC,OAAO;YAAE,OAAO,CAAC,IAAI,CAAC,CAAA,sBAAA,EAAyB,IAAI,CAAC,OAAO,CAAE,CAAA,CAAC,CAAC;QACxE,IAAI,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,+BAA+B,CAAC,CAAC;QAClE,IAAI,IAAI,CAAC,KAAK;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,6BAA6B,CAAC,CAAC;AAC5D,QAAA,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,4BAA4B,CAAC,CAAC;QAC5E,IAAI,CAAC,IAAI,CAAC,QAAQ;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,iCAAiC,CAAC,CAAC;QACpE,IAAI,CAAC,IAAI,CAAC,OAAO;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,8BAA8B,CAAC,CAAC;AAEhE,QAAA,OAAO,OAAO,CAAC;KAChB;IAED,eAAe,GAAA;AACb,QAAA,MAAM,OAAO,GAAG,CAAC,cAAc,CAAC,CAAC;QAEjC,IAAI,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;QAC1D,IAAI,IAAI,CAAC,QAAQ;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC1D,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,CAAA,cAAA,EAAiB,IAAI,CAAC,IAAI,CAAE,CAAA,CAAC,CAAC;QAC1D,IAAI,IAAI,CAAC,KAAK;YAAE,OAAO,CAAC,IAAI,CAAC,CAAA,cAAA,EAAiB,IAAI,CAAC,KAAK,CAAE,CAAA,CAAC,CAAC;QAC5D,IAAI,IAAI,CAAC,KAAK;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;AAEpD,QAAA,OAAO,OAAO,CAAC;KAChB;IAED,eAAe,GAAA;AACb,QAAA,MAAM,OAAO,GAAG,CAAC,oBAAoB,CAAC,CAAC;QAEvC,IAAI,IAAI,CAAC,QAAQ;AAAE,YAAA,OAAO,CAAC,IAAI,CAAC,8BAA8B,CAAC,CAAC;QAChE,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,CAAA,oBAAA,EAAuB,IAAI,CAAC,IAAI,CAAE,CAAA,CAAC,CAAC;AAEhE,QAAA,OAAO,OAAO,CAAC;KAChB;;kHAnGU,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,oBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,EARpB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,WAAA,EAAA,aAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,UAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,UAAA,EAAA,KAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,aAAA,EAAA,eAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,SAAA,EAAA;AACT,QAAA;AACE,YAAA,OAAO,EAAE,iBAAiB;AAC1B,YAAA,WAAW,EAAE,UAAU,CAAC,MAAM,oBAAoB,CAAC;AACnD,YAAA,KAAK,EAAE,IAAI;AACZ,SAAA;AACF,KAAA,ECpBH,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,42EAmEA,o4TDxDY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;4FAWX,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAdhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,qBAAqB,cACnB,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,CAAC,EAGZ,SAAA,EAAA;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,0BAA0B,CAAC;AACnD,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;qBACF,EAAA,QAAA,EAAA,42EAAA,EAAA,MAAA,EAAA,CAAA,60TAAA,CAAA,EAAA,CAAA;8BAGQ,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBACG,aAAa,EAAA,CAAA;sBAArB,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBAEI,WAAW,EAAA,CAAA;sBAApB,MAAM;gBACG,WAAW,EAAA,CAAA;sBAApB,MAAM;;;AE5CT;;AAEG;;;;"}
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { EventEmitter, forwardRef, Component, Input, Output } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/common';
|
|
4
|
+
import { CommonModule } from '@angular/common';
|
|
5
|
+
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
6
|
+
|
|
7
|
+
class RadioButtonComponent {
|
|
8
|
+
constructor() {
|
|
9
|
+
this.name = '';
|
|
10
|
+
this.label = '';
|
|
11
|
+
this.description = '';
|
|
12
|
+
this.icon = ''; // Icon or emoji
|
|
13
|
+
this.badge = ''; // Badge text (e.g., "New", "Popular")
|
|
14
|
+
this.price = ''; // For pricing cards
|
|
15
|
+
this.subtitle = ''; // Additional subtitle
|
|
16
|
+
this.disabled = false;
|
|
17
|
+
this.size = 'md';
|
|
18
|
+
this.color = 'primary';
|
|
19
|
+
this.variant = 'default';
|
|
20
|
+
this.required = false;
|
|
21
|
+
this.error = false;
|
|
22
|
+
this.helperText = '';
|
|
23
|
+
this.showCheckIcon = false; // Show checkmark when selected
|
|
24
|
+
this.glow = false; // Glow effect when selected
|
|
25
|
+
this.bordered = true; // Show border
|
|
26
|
+
this.rounded = true; // Rounded corners
|
|
27
|
+
this.valueChange = new EventEmitter();
|
|
28
|
+
this.radioChange = new EventEmitter();
|
|
29
|
+
this.onChange = () => { };
|
|
30
|
+
this.onTouched = () => { };
|
|
31
|
+
}
|
|
32
|
+
get isChecked() {
|
|
33
|
+
return this.selectedValue === this.value;
|
|
34
|
+
}
|
|
35
|
+
selectRadio(event) {
|
|
36
|
+
if (this.disabled) {
|
|
37
|
+
event?.preventDefault();
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
this.selectedValue = this.value;
|
|
41
|
+
this.valueChange.emit(this.value);
|
|
42
|
+
this.radioChange.emit({
|
|
43
|
+
value: this.value,
|
|
44
|
+
label: this.label
|
|
45
|
+
});
|
|
46
|
+
this.onChange(this.value);
|
|
47
|
+
this.onTouched();
|
|
48
|
+
}
|
|
49
|
+
// ControlValueAccessor methods
|
|
50
|
+
writeValue(value) {
|
|
51
|
+
this.selectedValue = value;
|
|
52
|
+
}
|
|
53
|
+
registerOnChange(fn) {
|
|
54
|
+
this.onChange = fn;
|
|
55
|
+
}
|
|
56
|
+
registerOnTouched(fn) {
|
|
57
|
+
this.onTouched = fn;
|
|
58
|
+
}
|
|
59
|
+
setDisabledState(isDisabled) {
|
|
60
|
+
this.disabled = isDisabled;
|
|
61
|
+
}
|
|
62
|
+
getWrapperClasses() {
|
|
63
|
+
const classes = ['muxima-radio-wrapper'];
|
|
64
|
+
if (this.disabled)
|
|
65
|
+
classes.push('muxima-radio-wrapper--disabled');
|
|
66
|
+
if (this.size)
|
|
67
|
+
classes.push(`muxima-radio-wrapper--${this.size}`);
|
|
68
|
+
if (this.variant)
|
|
69
|
+
classes.push(`muxima-radio-wrapper--${this.variant}`);
|
|
70
|
+
if (this.isChecked)
|
|
71
|
+
classes.push('muxima-radio-wrapper--checked');
|
|
72
|
+
if (this.error)
|
|
73
|
+
classes.push('muxima-radio-wrapper--error');
|
|
74
|
+
if (this.glow && this.isChecked)
|
|
75
|
+
classes.push('muxima-radio-wrapper--glow');
|
|
76
|
+
if (!this.bordered)
|
|
77
|
+
classes.push('muxima-radio-wrapper--no-border');
|
|
78
|
+
if (!this.rounded)
|
|
79
|
+
classes.push('muxima-radio-wrapper--square');
|
|
80
|
+
return classes;
|
|
81
|
+
}
|
|
82
|
+
getRadioClasses() {
|
|
83
|
+
const classes = ['muxima-radio'];
|
|
84
|
+
if (this.isChecked)
|
|
85
|
+
classes.push('muxima-radio--checked');
|
|
86
|
+
if (this.disabled)
|
|
87
|
+
classes.push('muxima-radio--disabled');
|
|
88
|
+
if (this.size)
|
|
89
|
+
classes.push(`muxima-radio--${this.size}`);
|
|
90
|
+
if (this.color)
|
|
91
|
+
classes.push(`muxima-radio--${this.color}`);
|
|
92
|
+
if (this.error)
|
|
93
|
+
classes.push('muxima-radio--error');
|
|
94
|
+
return classes;
|
|
95
|
+
}
|
|
96
|
+
getLabelClasses() {
|
|
97
|
+
const classes = ['muxima-radio-label'];
|
|
98
|
+
if (this.disabled)
|
|
99
|
+
classes.push('muxima-radio-label--disabled');
|
|
100
|
+
if (this.size)
|
|
101
|
+
classes.push(`muxima-radio-label--${this.size}`);
|
|
102
|
+
return classes;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
RadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
106
|
+
RadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: RadioButtonComponent, isStandalone: true, selector: "muxima-radio-button", inputs: { value: "value", name: "name", label: "label", description: "description", icon: "icon", badge: "badge", price: "price", subtitle: "subtitle", disabled: "disabled", size: "size", color: "color", variant: "variant", required: "required", error: "error", helperText: "helperText", showCheckIcon: "showCheckIcon", glow: "glow", bordered: "bordered", rounded: "rounded" }, outputs: { valueChange: "valueChange", radioChange: "radioChange" }, providers: [
|
|
107
|
+
{
|
|
108
|
+
provide: NG_VALUE_ACCESSOR,
|
|
109
|
+
useExisting: forwardRef(() => RadioButtonComponent),
|
|
110
|
+
multi: true
|
|
111
|
+
}
|
|
112
|
+
], ngImport: i0, template: "<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n", styles: [":host{--muxima-white: #FFFFFF;--muxima-primary: var(--muxima-primary, #3B82F6);--muxima-primary-dark: var(--muxima-primary-dark, #2563EB);--muxima-primary-light: var(--muxima-primary-light, #DBEAFE);--muxima-success: var(--muxima-success, #10B981);--muxima-success-dark: var(--muxima-success-dark, #059669);--muxima-success-light: var(--muxima-success-light, #D1FAE5);--muxima-warning: var(--muxima-warning, #F59E0B);--muxima-warning-dark: var(--muxima-warning-dark, #D97706);--muxima-warning-light: var(--muxima-warning-light, #FEF3C7);--muxima-danger: var(--muxima-danger, #EF4444);--muxima-danger-dark: var(--muxima-danger-dark, #DC2626);--muxima-danger-light: var(--muxima-danger-light, #FEE2E2);--muxima-info: var(--muxima-info, #06B6D4);--muxima-info-dark: var(--muxima-info-dark, #0891B2);--muxima-info-light: var(--muxima-info-light, #CFFAFE);--muxima-purple: #8B5CF6;--muxima-purple-dark: #7C3AED;--muxima-purple-light: #EDE9FE;--muxima-pink: #EC4899;--muxima-pink-dark: #DB2777;--muxima-pink-light: #FCE7F3;--muxima-gray-100: #F3F4F6;--muxima-gray-200: #E5E7EB;--muxima-gray-300: #D1D5DB;--muxima-gray-400: #9CA3AF;--muxima-gray-500: #6B7280;--muxima-gray-600: #4B5563;--muxima-gray-700: #374151;--muxima-gray-900: #111827;display:inline-block}.muxima-radio-wrapper{position:relative;display:inline-flex;align-items:flex-start;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}.muxima-radio-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.muxima-radio-wrapper--card{flex-direction:column;padding:1.5rem;border:2px solid var(--muxima-gray-200);border-radius:12px;background:var(--muxima-white);transition:all .3s cubic-bezier(.4,0,.2,1);min-width:200px}.muxima-radio-wrapper--card:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.muxima-radio-wrapper--card.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary-light);box-shadow:0 4px 16px #3b82f633}.muxima-radio-wrapper--button{padding:.75rem 1.5rem;border:2px solid var(--muxima-gray-300);border-radius:8px;background:var(--muxima-white);transition:all .2s ease;justify-content:center;min-width:120px}.muxima-radio-wrapper--button:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);background:var(--muxima-gray-100)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary);color:var(--muxima-white)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked .muxima-radio-label{color:var(--muxima-white);font-weight:600}.muxima-radio-wrapper--button .muxima-radio{display:none}.muxima-radio-wrapper--tile{flex-direction:column;align-items:center;padding:2rem 1.5rem;border:2px solid var(--muxima-gray-200);border-radius:16px;background:var(--muxima-white);transition:all .3s ease;min-width:150px;text-align:center}.muxima-radio-wrapper--tile:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 8px 24px #3b82f61f;transform:scale(1.02)}.muxima-radio-wrapper--tile.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:linear-gradient(135deg,var(--muxima-primary-light) 0%,var(--muxima-white) 100%);box-shadow:0 8px 24px #3b82f633}.muxima-radio-wrapper--tile .muxima-radio{order:-1;margin-bottom:1rem}.muxima-radio-wrapper--minimal{gap:.5rem}.muxima-radio-wrapper--minimal .muxima-radio-outer{border-width:1px}.muxima-radio-wrapper--glow.muxima-radio-wrapper--checked{filter:drop-shadow(0 0 12px rgba(59,130,246,.6))}.muxima-radio-wrapper--no-border{border:none!important}.muxima-radio-wrapper--square{border-radius:0!important}.muxima-radio-wrapper--error .muxima-radio-outer,.muxima-radio-wrapper--error.muxima-radio-wrapper--card,.muxima-radio-wrapper--error.muxima-radio-wrapper--tile{border-color:var(--muxima-danger)!important}.muxima-radio-badge{position:absolute;top:-8px;right:-8px;padding:.25rem .5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);color:var(--muxima-white);font-size:.625rem;font-weight:700;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #3b82f666;z-index:10}.muxima-radio-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--muxima-gray-100);border-radius:12px;margin-bottom:.75rem}.muxima-radio-icon-content{font-size:1.5rem}.muxima-radio-wrapper--checked .muxima-radio-icon{background:var(--muxima-primary-light)}.muxima-radio{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;outline:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.muxima-radio:focus-visible{box-shadow:0 0 0 3px #3b82f64d;border-radius:50%}.muxima-radio-outer{width:20px;height:20px;border:2px solid var(--muxima-gray-400);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--muxima-white);box-shadow:inset 0 1px 2px #0000000d}.muxima-radio:hover:not(.muxima-radio--disabled) .muxima-radio-outer{border-color:var(--muxima-primary);box-shadow:0 0 0 4px #3b82f61a}.muxima-radio-inner{width:10px;height:10px;border-radius:50%;animation:radioAppear .2s ease;box-shadow:0 2px 4px #0003}@keyframes radioAppear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.muxima-radio-check-icon{position:absolute;width:16px;height:16px;color:var(--muxima-white);animation:checkAppear .2s ease}@keyframes checkAppear{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio--primary.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-primary);background:var(--muxima-white)}.muxima-radio--primary.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%)}.muxima-radio--success.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-success)}.muxima-radio--success.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-success) 0%,var(--muxima-success-dark) 100%)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-warning)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-warning) 0%,var(--muxima-warning-dark) 100%)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-danger)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-danger) 0%,var(--muxima-danger-dark) 100%)}.muxima-radio--info.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-info)}.muxima-radio--info.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-info) 0%,var(--muxima-info-dark) 100%)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-purple)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-purple) 0%,var(--muxima-purple-dark) 100%)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-pink)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-pink) 0%,var(--muxima-pink-dark) 100%)}.muxima-radio--xs .muxima-radio-outer{width:14px;height:14px}.muxima-radio--xs .muxima-radio-inner{width:6px;height:6px}.muxima-radio--sm .muxima-radio-outer{width:16px;height:16px}.muxima-radio--sm .muxima-radio-inner{width:8px;height:8px}.muxima-radio--md .muxima-radio-outer{width:20px;height:20px}.muxima-radio--md .muxima-radio-inner{width:10px;height:10px}.muxima-radio--lg .muxima-radio-outer{width:24px;height:24px}.muxima-radio--lg .muxima-radio-inner{width:12px;height:12px}.muxima-radio--xl .muxima-radio-outer{width:28px;height:28px}.muxima-radio--xl .muxima-radio-inner{width:14px;height:14px}.muxima-radio-wrapper--xs{gap:.375rem}.muxima-radio-wrapper--sm{gap:.5rem}.muxima-radio-wrapper--md{gap:.75rem}.muxima-radio-wrapper--lg{gap:1rem}.muxima-radio-wrapper--xl{gap:1.25rem}.muxima-radio-content{display:flex;flex-direction:column;gap:.25rem;flex:1}.muxima-radio-label{font-size:.9375rem;font-weight:500;color:var(--muxima-gray-900);line-height:1.5}.muxima-radio-label--disabled{color:var(--muxima-gray-400)}.muxima-radio-subtitle{font-size:.8125rem;font-weight:500;color:var(--muxima-gray-600);line-height:1.4}.muxima-radio-description{font-size:.875rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-required{color:var(--muxima-danger);margin-left:.25rem}.muxima-radio-price{font-size:1.875rem;font-weight:700;color:var(--muxima-primary);margin-bottom:.5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muxima-radio-selected-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--muxima-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #3b82f666;animation:indicatorAppear .3s ease}.muxima-radio-selected-indicator svg{width:14px;height:14px;color:var(--muxima-white)}@keyframes indicatorAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio-helper{margin-top:.375rem;font-size:.8125rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-error-text{color:var(--muxima-danger);font-weight:500}.muxima-radio-label--xs{font-size:.8125rem}.muxima-radio-label--sm{font-size:.875rem}.muxima-radio-label--md{font-size:.9375rem}.muxima-radio-label--lg{font-size:1rem}.muxima-radio-label--xl{font-size:1.125rem}@media (max-width: 640px){.muxima-radio-wrapper--card,.muxima-radio-wrapper--tile{min-width:100%}.muxima-radio-wrapper--button{min-width:100px;padding:.625rem 1rem}.muxima-radio-price{font-size:1.5rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
113
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RadioButtonComponent, decorators: [{
|
|
114
|
+
type: Component,
|
|
115
|
+
args: [{ selector: 'muxima-radio-button', standalone: true, imports: [CommonModule], providers: [
|
|
116
|
+
{
|
|
117
|
+
provide: NG_VALUE_ACCESSOR,
|
|
118
|
+
useExisting: forwardRef(() => RadioButtonComponent),
|
|
119
|
+
multi: true
|
|
120
|
+
}
|
|
121
|
+
], template: "<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n", styles: [":host{--muxima-white: #FFFFFF;--muxima-primary: var(--muxima-primary, #3B82F6);--muxima-primary-dark: var(--muxima-primary-dark, #2563EB);--muxima-primary-light: var(--muxima-primary-light, #DBEAFE);--muxima-success: var(--muxima-success, #10B981);--muxima-success-dark: var(--muxima-success-dark, #059669);--muxima-success-light: var(--muxima-success-light, #D1FAE5);--muxima-warning: var(--muxima-warning, #F59E0B);--muxima-warning-dark: var(--muxima-warning-dark, #D97706);--muxima-warning-light: var(--muxima-warning-light, #FEF3C7);--muxima-danger: var(--muxima-danger, #EF4444);--muxima-danger-dark: var(--muxima-danger-dark, #DC2626);--muxima-danger-light: var(--muxima-danger-light, #FEE2E2);--muxima-info: var(--muxima-info, #06B6D4);--muxima-info-dark: var(--muxima-info-dark, #0891B2);--muxima-info-light: var(--muxima-info-light, #CFFAFE);--muxima-purple: #8B5CF6;--muxima-purple-dark: #7C3AED;--muxima-purple-light: #EDE9FE;--muxima-pink: #EC4899;--muxima-pink-dark: #DB2777;--muxima-pink-light: #FCE7F3;--muxima-gray-100: #F3F4F6;--muxima-gray-200: #E5E7EB;--muxima-gray-300: #D1D5DB;--muxima-gray-400: #9CA3AF;--muxima-gray-500: #6B7280;--muxima-gray-600: #4B5563;--muxima-gray-700: #374151;--muxima-gray-900: #111827;display:inline-block}.muxima-radio-wrapper{position:relative;display:inline-flex;align-items:flex-start;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}.muxima-radio-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.muxima-radio-wrapper--card{flex-direction:column;padding:1.5rem;border:2px solid var(--muxima-gray-200);border-radius:12px;background:var(--muxima-white);transition:all .3s cubic-bezier(.4,0,.2,1);min-width:200px}.muxima-radio-wrapper--card:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.muxima-radio-wrapper--card.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary-light);box-shadow:0 4px 16px #3b82f633}.muxima-radio-wrapper--button{padding:.75rem 1.5rem;border:2px solid var(--muxima-gray-300);border-radius:8px;background:var(--muxima-white);transition:all .2s ease;justify-content:center;min-width:120px}.muxima-radio-wrapper--button:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);background:var(--muxima-gray-100)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:var(--muxima-primary);color:var(--muxima-white)}.muxima-radio-wrapper--button.muxima-radio-wrapper--checked .muxima-radio-label{color:var(--muxima-white);font-weight:600}.muxima-radio-wrapper--button .muxima-radio{display:none}.muxima-radio-wrapper--tile{flex-direction:column;align-items:center;padding:2rem 1.5rem;border:2px solid var(--muxima-gray-200);border-radius:16px;background:var(--muxima-white);transition:all .3s ease;min-width:150px;text-align:center}.muxima-radio-wrapper--tile:hover:not(.muxima-radio-wrapper--disabled){border-color:var(--muxima-primary);box-shadow:0 8px 24px #3b82f61f;transform:scale(1.02)}.muxima-radio-wrapper--tile.muxima-radio-wrapper--checked{border-color:var(--muxima-primary);background:linear-gradient(135deg,var(--muxima-primary-light) 0%,var(--muxima-white) 100%);box-shadow:0 8px 24px #3b82f633}.muxima-radio-wrapper--tile .muxima-radio{order:-1;margin-bottom:1rem}.muxima-radio-wrapper--minimal{gap:.5rem}.muxima-radio-wrapper--minimal .muxima-radio-outer{border-width:1px}.muxima-radio-wrapper--glow.muxima-radio-wrapper--checked{filter:drop-shadow(0 0 12px rgba(59,130,246,.6))}.muxima-radio-wrapper--no-border{border:none!important}.muxima-radio-wrapper--square{border-radius:0!important}.muxima-radio-wrapper--error .muxima-radio-outer,.muxima-radio-wrapper--error.muxima-radio-wrapper--card,.muxima-radio-wrapper--error.muxima-radio-wrapper--tile{border-color:var(--muxima-danger)!important}.muxima-radio-badge{position:absolute;top:-8px;right:-8px;padding:.25rem .5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);color:var(--muxima-white);font-size:.625rem;font-weight:700;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #3b82f666;z-index:10}.muxima-radio-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--muxima-gray-100);border-radius:12px;margin-bottom:.75rem}.muxima-radio-icon-content{font-size:1.5rem}.muxima-radio-wrapper--checked .muxima-radio-icon{background:var(--muxima-primary-light)}.muxima-radio{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;outline:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.muxima-radio:focus-visible{box-shadow:0 0 0 3px #3b82f64d;border-radius:50%}.muxima-radio-outer{width:20px;height:20px;border:2px solid var(--muxima-gray-400);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--muxima-white);box-shadow:inset 0 1px 2px #0000000d}.muxima-radio:hover:not(.muxima-radio--disabled) .muxima-radio-outer{border-color:var(--muxima-primary);box-shadow:0 0 0 4px #3b82f61a}.muxima-radio-inner{width:10px;height:10px;border-radius:50%;animation:radioAppear .2s ease;box-shadow:0 2px 4px #0003}@keyframes radioAppear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.muxima-radio-check-icon{position:absolute;width:16px;height:16px;color:var(--muxima-white);animation:checkAppear .2s ease}@keyframes checkAppear{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio--primary.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-primary);background:var(--muxima-white)}.muxima-radio--primary.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%)}.muxima-radio--success.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-success)}.muxima-radio--success.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-success) 0%,var(--muxima-success-dark) 100%)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-warning)}.muxima-radio--warning.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-warning) 0%,var(--muxima-warning-dark) 100%)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-danger)}.muxima-radio--danger.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-danger) 0%,var(--muxima-danger-dark) 100%)}.muxima-radio--info.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-info)}.muxima-radio--info.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-info) 0%,var(--muxima-info-dark) 100%)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-purple)}.muxima-radio--purple.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-purple) 0%,var(--muxima-purple-dark) 100%)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-outer{border-color:var(--muxima-pink)}.muxima-radio--pink.muxima-radio--checked .muxima-radio-inner{background:linear-gradient(135deg,var(--muxima-pink) 0%,var(--muxima-pink-dark) 100%)}.muxima-radio--xs .muxima-radio-outer{width:14px;height:14px}.muxima-radio--xs .muxima-radio-inner{width:6px;height:6px}.muxima-radio--sm .muxima-radio-outer{width:16px;height:16px}.muxima-radio--sm .muxima-radio-inner{width:8px;height:8px}.muxima-radio--md .muxima-radio-outer{width:20px;height:20px}.muxima-radio--md .muxima-radio-inner{width:10px;height:10px}.muxima-radio--lg .muxima-radio-outer{width:24px;height:24px}.muxima-radio--lg .muxima-radio-inner{width:12px;height:12px}.muxima-radio--xl .muxima-radio-outer{width:28px;height:28px}.muxima-radio--xl .muxima-radio-inner{width:14px;height:14px}.muxima-radio-wrapper--xs{gap:.375rem}.muxima-radio-wrapper--sm{gap:.5rem}.muxima-radio-wrapper--md{gap:.75rem}.muxima-radio-wrapper--lg{gap:1rem}.muxima-radio-wrapper--xl{gap:1.25rem}.muxima-radio-content{display:flex;flex-direction:column;gap:.25rem;flex:1}.muxima-radio-label{font-size:.9375rem;font-weight:500;color:var(--muxima-gray-900);line-height:1.5}.muxima-radio-label--disabled{color:var(--muxima-gray-400)}.muxima-radio-subtitle{font-size:.8125rem;font-weight:500;color:var(--muxima-gray-600);line-height:1.4}.muxima-radio-description{font-size:.875rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-required{color:var(--muxima-danger);margin-left:.25rem}.muxima-radio-price{font-size:1.875rem;font-weight:700;color:var(--muxima-primary);margin-bottom:.5rem;background:linear-gradient(135deg,var(--muxima-primary) 0%,var(--muxima-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muxima-radio-selected-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--muxima-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #3b82f666;animation:indicatorAppear .3s ease}.muxima-radio-selected-indicator svg{width:14px;height:14px;color:var(--muxima-white)}@keyframes indicatorAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.muxima-radio-helper{margin-top:.375rem;font-size:.8125rem;color:var(--muxima-gray-500);line-height:1.4}.muxima-radio-error-text{color:var(--muxima-danger);font-weight:500}.muxima-radio-label--xs{font-size:.8125rem}.muxima-radio-label--sm{font-size:.875rem}.muxima-radio-label--md{font-size:.9375rem}.muxima-radio-label--lg{font-size:1rem}.muxima-radio-label--xl{font-size:1.125rem}@media (max-width: 640px){.muxima-radio-wrapper--card,.muxima-radio-wrapper--tile{min-width:100%}.muxima-radio-wrapper--button{min-width:100px;padding:.625rem 1rem}.muxima-radio-price{font-size:1.5rem}}\n"] }]
|
|
122
|
+
}], propDecorators: { value: [{
|
|
123
|
+
type: Input
|
|
124
|
+
}], name: [{
|
|
125
|
+
type: Input
|
|
126
|
+
}], label: [{
|
|
127
|
+
type: Input
|
|
128
|
+
}], description: [{
|
|
129
|
+
type: Input
|
|
130
|
+
}], icon: [{
|
|
131
|
+
type: Input
|
|
132
|
+
}], badge: [{
|
|
133
|
+
type: Input
|
|
134
|
+
}], price: [{
|
|
135
|
+
type: Input
|
|
136
|
+
}], subtitle: [{
|
|
137
|
+
type: Input
|
|
138
|
+
}], disabled: [{
|
|
139
|
+
type: Input
|
|
140
|
+
}], size: [{
|
|
141
|
+
type: Input
|
|
142
|
+
}], color: [{
|
|
143
|
+
type: Input
|
|
144
|
+
}], variant: [{
|
|
145
|
+
type: Input
|
|
146
|
+
}], required: [{
|
|
147
|
+
type: Input
|
|
148
|
+
}], error: [{
|
|
149
|
+
type: Input
|
|
150
|
+
}], helperText: [{
|
|
151
|
+
type: Input
|
|
152
|
+
}], showCheckIcon: [{
|
|
153
|
+
type: Input
|
|
154
|
+
}], glow: [{
|
|
155
|
+
type: Input
|
|
156
|
+
}], bordered: [{
|
|
157
|
+
type: Input
|
|
158
|
+
}], rounded: [{
|
|
159
|
+
type: Input
|
|
160
|
+
}], valueChange: [{
|
|
161
|
+
type: Output
|
|
162
|
+
}], radioChange: [{
|
|
163
|
+
type: Output
|
|
164
|
+
}] } });
|
|
165
|
+
|
|
166
|
+
/**
|
|
167
|
+
* Generated bundle index. Do not edit.
|
|
168
|
+
*/
|
|
169
|
+
|
|
170
|
+
export { RadioButtonComponent };
|
|
171
|
+
//# sourceMappingURL=muxima-ui-radio-button.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"muxima-ui-radio-button.mjs","sources":["../../../../form/radio-button/src/lib/radio-button/radio-button.component.ts","../../../../form/radio-button/src/lib/radio-button/radio-button.component.html","../../../../form/radio-button/src/muxima-ui-radio-button.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter, forwardRef } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\ntype RadioSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\r\ntype RadioColor = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'purple' | 'pink';\r\ntype RadioVariant = 'default' | 'card' | 'button' | 'tile' | 'minimal';\r\n\r\n@Component({\r\n selector: 'muxima-radio-button',\r\n standalone: true,\r\n imports: [CommonModule],\r\n templateUrl: './radio-button.component.html',\r\n styleUrls: ['./radio-button.component.css'],\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => RadioButtonComponent),\r\n multi: true\r\n }\r\n ]\r\n})\r\nexport class RadioButtonComponent implements ControlValueAccessor {\r\n @Input() value: any;\r\n @Input() name: string = '';\r\n @Input() label: string = '';\r\n @Input() description: string = '';\r\n @Input() icon: string = ''; // Icon or emoji\r\n @Input() badge: string = ''; // Badge text (e.g., \"New\", \"Popular\")\r\n @Input() price: string = ''; // For pricing cards\r\n @Input() subtitle: string = ''; // Additional subtitle\r\n @Input() disabled: boolean = false;\r\n @Input() size: RadioSize = 'md';\r\n @Input() color: RadioColor = 'primary';\r\n @Input() variant: RadioVariant = 'default';\r\n @Input() required: boolean = false;\r\n @Input() error: boolean = false;\r\n @Input() helperText: string = '';\r\n @Input() showCheckIcon: boolean = false; // Show checkmark when selected\r\n @Input() glow: boolean = false; // Glow effect when selected\r\n @Input() bordered: boolean = true; // Show border\r\n @Input() rounded: boolean = true; // Rounded corners\r\n \r\n @Output() valueChange = new EventEmitter<any>();\r\n @Output() radioChange = new EventEmitter<any>();\r\n\r\n private selectedValue: any;\r\n private onChange: (value: any) => void = () => {};\r\n private onTouched: () => void = () => {};\r\n\r\n get isChecked(): boolean {\r\n return this.selectedValue === this.value;\r\n }\r\n\r\n selectRadio(event?: Event): void {\r\n if (this.disabled) {\r\n event?.preventDefault();\r\n return;\r\n }\r\n \r\n this.selectedValue = this.value;\r\n this.valueChange.emit(this.value);\r\n this.radioChange.emit({\r\n value: this.value,\r\n label: this.label\r\n });\r\n this.onChange(this.value);\r\n this.onTouched();\r\n }\r\n\r\n // ControlValueAccessor methods\r\n writeValue(value: any): void {\r\n this.selectedValue = value;\r\n }\r\n\r\n registerOnChange(fn: any): void {\r\n this.onChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: any): void {\r\n this.onTouched = fn;\r\n }\r\n\r\n setDisabledState(isDisabled: boolean): void {\r\n this.disabled = isDisabled;\r\n }\r\n\r\n getWrapperClasses(): string[] {\r\n const classes = ['muxima-radio-wrapper'];\r\n \r\n if (this.disabled) classes.push('muxima-radio-wrapper--disabled');\r\n if (this.size) classes.push(`muxima-radio-wrapper--${this.size}`);\r\n if (this.variant) classes.push(`muxima-radio-wrapper--${this.variant}`);\r\n if (this.isChecked) classes.push('muxima-radio-wrapper--checked');\r\n if (this.error) classes.push('muxima-radio-wrapper--error');\r\n if (this.glow && this.isChecked) classes.push('muxima-radio-wrapper--glow');\r\n if (!this.bordered) classes.push('muxima-radio-wrapper--no-border');\r\n if (!this.rounded) classes.push('muxima-radio-wrapper--square');\r\n \r\n return classes;\r\n }\r\n\r\n getRadioClasses(): string[] {\r\n const classes = ['muxima-radio'];\r\n \r\n if (this.isChecked) classes.push('muxima-radio--checked');\r\n if (this.disabled) classes.push('muxima-radio--disabled');\r\n if (this.size) classes.push(`muxima-radio--${this.size}`);\r\n if (this.color) classes.push(`muxima-radio--${this.color}`);\r\n if (this.error) classes.push('muxima-radio--error');\r\n \r\n return classes;\r\n }\r\n\r\n getLabelClasses(): string[] {\r\n const classes = ['muxima-radio-label'];\r\n \r\n if (this.disabled) classes.push('muxima-radio-label--disabled');\r\n if (this.size) classes.push(`muxima-radio-label--${this.size}`);\r\n \r\n return classes;\r\n }\r\n}\r\n\r\n","<label [ngClass]=\"getWrapperClasses()\" (click)=\"selectRadio($event)\">\n <!-- Badge (New, Popular, etc) -->\n <div class=\"muxima-radio-badge\" *ngIf=\"badge && !disabled\">\n {{ badge }}\n </div>\n\n <!-- Icon (for card/tile variants) -->\n <div class=\"muxima-radio-icon\" *ngIf=\"icon\">\n <span class=\"muxima-radio-icon-content\">{{ icon }}</span>\n </div>\n\n <!-- Radio Circle -->\n <div \n [ngClass]=\"getRadioClasses()\"\n [attr.aria-checked]=\"isChecked\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"disabled ? -1 : 0\"\n role=\"radio\"\n (keydown.space)=\"$event.preventDefault(); selectRadio($event)\"\n (keydown.enter)=\"$event.preventDefault(); selectRadio($event)\">\n <div class=\"muxima-radio-outer\">\n <div class=\"muxima-radio-inner\" *ngIf=\"isChecked\"></div>\n </div>\n \n <!-- Check Icon (alternative to dot) -->\n <svg *ngIf=\"showCheckIcon && isChecked\" \n class=\"muxima-radio-check-icon\" \n viewBox=\"0 0 24 24\" \n fill=\"none\" \n stroke=\"currentColor\" \n stroke-width=\"3\">\n <polyline points=\"20 6 9 17 4 12\"></polyline>\n </svg>\n </div>\n \n <!-- Content -->\n <div class=\"muxima-radio-content\" *ngIf=\"label || description || subtitle || price\">\n <!-- Price (for pricing cards) -->\n <div class=\"muxima-radio-price\" *ngIf=\"price\">\n {{ price }}\n </div>\n \n <!-- Label -->\n <span [ngClass]=\"getLabelClasses()\" *ngIf=\"label\">\n {{ label }}\n <span class=\"muxima-radio-required\" *ngIf=\"required\">*</span>\n </span>\n \n <!-- Subtitle -->\n <span class=\"muxima-radio-subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n \n <!-- Description -->\n <span class=\"muxima-radio-description\" *ngIf=\"description\">{{ description }}</span>\n </div>\n \n <!-- Selected Indicator (for button/tile variants) -->\n <div class=\"muxima-radio-selected-indicator\" *ngIf=\"isChecked && (variant === 'card' || variant === 'tile')\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"/>\n </svg>\n </div>\n</label>\n\n<!-- Helper Text / Error Message -->\n<div class=\"muxima-radio-helper\" *ngIf=\"helperText && !variant\">\n <span [class.muxima-radio-error-text]=\"error\">{{ helperText }}</span>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './lib/radio-button/radio-button.component';
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
|
2
|
+
import { ControlValueAccessor } from '@angular/forms';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
type RadioSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
5
|
+
type RadioColor = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'purple' | 'pink';
|
|
6
|
+
type RadioVariant = 'default' | 'card' | 'button' | 'tile' | 'minimal';
|
|
7
|
+
export declare class RadioButtonComponent implements ControlValueAccessor {
|
|
8
|
+
value: any;
|
|
9
|
+
name: string;
|
|
10
|
+
label: string;
|
|
11
|
+
description: string;
|
|
12
|
+
icon: string;
|
|
13
|
+
badge: string;
|
|
14
|
+
price: string;
|
|
15
|
+
subtitle: string;
|
|
16
|
+
disabled: boolean;
|
|
17
|
+
size: RadioSize;
|
|
18
|
+
color: RadioColor;
|
|
19
|
+
variant: RadioVariant;
|
|
20
|
+
required: boolean;
|
|
21
|
+
error: boolean;
|
|
22
|
+
helperText: string;
|
|
23
|
+
showCheckIcon: boolean;
|
|
24
|
+
glow: boolean;
|
|
25
|
+
bordered: boolean;
|
|
26
|
+
rounded: boolean;
|
|
27
|
+
valueChange: EventEmitter<any>;
|
|
28
|
+
radioChange: EventEmitter<any>;
|
|
29
|
+
private selectedValue;
|
|
30
|
+
private onChange;
|
|
31
|
+
private onTouched;
|
|
32
|
+
get isChecked(): boolean;
|
|
33
|
+
selectRadio(event?: Event): void;
|
|
34
|
+
writeValue(value: any): void;
|
|
35
|
+
registerOnChange(fn: any): void;
|
|
36
|
+
registerOnTouched(fn: any): void;
|
|
37
|
+
setDisabledState(isDisabled: boolean): void;
|
|
38
|
+
getWrapperClasses(): string[];
|
|
39
|
+
getRadioClasses(): string[];
|
|
40
|
+
getLabelClasses(): string[];
|
|
41
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RadioButtonComponent, never>;
|
|
42
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<RadioButtonComponent, "muxima-radio-button", never, { "value": "value"; "name": "name"; "label": "label"; "description": "description"; "icon": "icon"; "badge": "badge"; "price": "price"; "subtitle": "subtitle"; "disabled": "disabled"; "size": "size"; "color": "color"; "variant": "variant"; "required": "required"; "error": "error"; "helperText": "helperText"; "showCheckIcon": "showCheckIcon"; "glow": "glow"; "bordered": "bordered"; "rounded": "rounded"; }, { "valueChange": "valueChange"; "radioChange": "radioChange"; }, never, never, true, never>;
|
|
43
|
+
}
|
|
44
|
+
export {};
|
package/package.json
ADDED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@muxima-ui/radio-button",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Radio button component for Angular 18+ - Muxima UI",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"angular",
|
|
7
|
+
"radio",
|
|
8
|
+
"radio-button",
|
|
9
|
+
"form",
|
|
10
|
+
"input",
|
|
11
|
+
"muxima-ui"
|
|
12
|
+
],
|
|
13
|
+
"author": "Muxima UI Team (jokerscript)",
|
|
14
|
+
"license": "MIT",
|
|
15
|
+
"repository": {
|
|
16
|
+
"type": "git",
|
|
17
|
+
"url": "https://github.com/Aldemiro20/muxima-ui.git",
|
|
18
|
+
"directory": "packages/form/radio-button"
|
|
19
|
+
},
|
|
20
|
+
"homepage": "https://muxima-ui.vercel.app/components/radio-button",
|
|
21
|
+
"bugs": {
|
|
22
|
+
"url": "https://github.com/Aldemiro20/muxima-ui/issues"
|
|
23
|
+
},
|
|
24
|
+
"documentation": "https://muxima-ui.vercel.app",
|
|
25
|
+
"publishConfig": {
|
|
26
|
+
"access": "public"
|
|
27
|
+
},
|
|
28
|
+
"peerDependencies": {
|
|
29
|
+
"@angular/common": "^18.0.0",
|
|
30
|
+
"@angular/core": "^18.0.0",
|
|
31
|
+
"@angular/forms": "^18.0.0"
|
|
32
|
+
},
|
|
33
|
+
"dependencies": {
|
|
34
|
+
"tslib": "^2.3.0"
|
|
35
|
+
},
|
|
36
|
+
"sideEffects": false,
|
|
37
|
+
"module": "fesm2015/muxima-ui-radio-button.mjs",
|
|
38
|
+
"es2020": "fesm2020/muxima-ui-radio-button.mjs",
|
|
39
|
+
"esm2020": "esm2020/muxima-ui-radio-button.mjs",
|
|
40
|
+
"fesm2020": "fesm2020/muxima-ui-radio-button.mjs",
|
|
41
|
+
"fesm2015": "fesm2015/muxima-ui-radio-button.mjs",
|
|
42
|
+
"typings": "index.d.ts",
|
|
43
|
+
"exports": {
|
|
44
|
+
"./package.json": {
|
|
45
|
+
"default": "./package.json"
|
|
46
|
+
},
|
|
47
|
+
".": {
|
|
48
|
+
"types": "./index.d.ts",
|
|
49
|
+
"esm2020": "./esm2020/muxima-ui-radio-button.mjs",
|
|
50
|
+
"es2020": "./fesm2020/muxima-ui-radio-button.mjs",
|
|
51
|
+
"es2015": "./fesm2015/muxima-ui-radio-button.mjs",
|
|
52
|
+
"node": "./fesm2015/muxima-ui-radio-button.mjs",
|
|
53
|
+
"default": "./fesm2020/muxima-ui-radio-button.mjs"
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|