@masterteam/components 0.0.18 → 0.0.19

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/assets/common.css CHANGED
@@ -1,25 +1,25 @@
1
1
  @import "tailwindcss";
2
2
  @plugin "tailwindcss-primeui";
3
3
 
4
- @source inline("{dark:,}bg-primary-{50,{100..900..100},950}");
5
- @source inline("bg-teal-{50,{100..900..100},550}");
6
- @source inline("bg-violet-{50,{100..900..100},550}");
7
- @source inline("bg-red-{50,{100..900..100},550}");
8
-
9
- @source inline("border-primary-{50,{100..500..100},550}");
10
- @source inline("border-teal-{50,{100..500..100},550}");
11
- @source inline("border-violet-{50,{100..500..100},550}");
12
- @source inline("border-red-{50,{100..500..100},550}");
13
-
14
- @source inline("ring-primary-{50,{100..500..100},550}");
15
- @source inline("ring-teal-{50,{100..500..100},550}");
16
- @source inline("ring-violet-{50,{100..500..100},550}");
17
- @source inline("ring-red-{50,{100..500..100},550}");
18
-
19
- @source inline("text-primary-{50,{100..500..100},550}");
20
- @source inline("text-teal-{50,{100..500..100},550}");
21
- @source inline("text-violet-{50,{100..500..100},550}");
22
- @source inline("text-red-{50,{100..500..100},550}");
4
+ /* @source inline("{dark:,}bg-primary-{50,{100..900..100},950}"); */
5
+ /* @source inline("bg-teal-{50,{100..900..100},550}"); */
6
+ /* @source inline("bg-violet-{50,{100..900..100},550}"); */
7
+ /* @source inline("bg-red-{50,{100..900..100},550}"); */
8
+ /**/
9
+ /* @source inline("border-primary-{50,{100..500..100},550}"); */
10
+ /* @source inline("border-teal-{50,{100..500..100},550}"); */
11
+ /* @source inline("border-violet-{50,{100..500..100},550}"); */
12
+ /* @source inline("border-red-{50,{100..500..100},550}"); */
13
+ /**/
14
+ /* @source inline("ring-primary-{50,{100..500..100},550}"); */
15
+ /* @source inline("ring-teal-{50,{100..500..100},550}"); */
16
+ /* @source inline("ring-violet-{50,{100..500..100},550}"); */
17
+ /* @source inline("ring-red-{50,{100..500..100},550}"); */
18
+ /**/
19
+ /* @source inline("text-primary-{50,{100..500..100},550}"); */
20
+ /* @source inline("text-teal-{50,{100..500..100},550}"); */
21
+ /* @source inline("text-violet-{50,{100..500..100},550}"); */
22
+ /* @source inline("text-red-{50,{100..500..100},550}"); */
23
23
 
24
24
  @custom-variant dark (&:where(.dark, .dark *));
25
25
 
@@ -1,57 +1,19 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, booleanAttribute, computed, model, output, contentChild, TemplateRef, effect, ChangeDetectionStrategy, Component } from '@angular/core';
2
+ import { input, booleanAttribute, computed, model, output, contentChild, TemplateRef, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
  import { Avatar } from '@masterteam/components/avatar';
4
4
  import { NgTemplateOutlet } from '@angular/common';
5
5
 
6
6
  class RadioCards {
7
7
  circle = input(false, ...(ngDevMode ? [{ debugName: "circle", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
8
- color = input('primary', ...(ngDevMode ? [{ debugName: "color", transform: (value) => {
9
- if (value) {
10
- return value;
11
- }
12
- return 'primary';
13
- } }] : [{
14
- transform: (value) => {
15
- if (value) {
16
- return value;
17
- }
18
- return 'primary';
19
- },
20
- }]));
21
- size = input('medium', ...(ngDevMode ? [{ debugName: "size", transform: (value) => {
22
- if (value) {
23
- switch (value) {
24
- case 'small':
25
- return 'xs';
26
- case 'medium':
27
- return 'base';
28
- case 'large':
29
- return '2xl';
30
- }
31
- }
32
- return 'base';
33
- } }] : [{
34
- transform: (value) => {
35
- if (value) {
36
- switch (value) {
37
- case 'small':
38
- return 'xs';
39
- case 'medium':
40
- return 'base';
41
- case 'large':
42
- return '2xl';
43
- }
44
- }
45
- return 'base';
46
- },
47
- }]));
8
+ color = input('primary', ...(ngDevMode ? [{ debugName: "color" }] : []));
9
+ size = input('medium', ...(ngDevMode ? [{ debugName: "size" }] : []));
48
10
  avatarSize = computed(() => {
49
11
  switch (this.size()) {
50
- case 'xs':
12
+ case 'small':
51
13
  return 'normal';
52
- case 'base':
14
+ case 'medium':
53
15
  return 'large';
54
- case '2xl':
16
+ case 'large':
55
17
  return 'xlarge';
56
18
  default:
57
19
  return 'normal';
@@ -62,51 +24,38 @@ class RadioCards {
62
24
  selectionChange = output();
63
25
  itemTemplate = input(null, ...(ngDevMode ? [{ debugName: "itemTemplate" }] : []));
64
26
  itemTemplateContent = contentChild('option', ...(ngDevMode ? [{ debugName: "itemTemplateContent", read: TemplateRef }] : [{ read: TemplateRef }]));
65
- /**
66
- * A computed signal that generates the dynamic Tailwind CSS classes
67
- * for the active state based on the color input.
68
- */
27
+ textSizeClass = computed(() => {
28
+ switch (this.size()) {
29
+ case 'small':
30
+ return 'text-xs';
31
+ case 'large':
32
+ return 'text-2xl';
33
+ default:
34
+ return 'text-base';
35
+ }
36
+ }, ...(ngDevMode ? [{ debugName: "textSizeClass" }] : []));
37
+ classes = computed(() => { }, ...(ngDevMode ? [{ debugName: "classes" }] : []));
69
38
  activeColorClasses = computed(() => {
70
- const color = this.color();
71
- return {
72
- [`bg-${color}-50`]: true,
73
- [`dark:bg-${color}-800`]: true,
74
- [`border-${color}-400`]: true,
75
- [`ring-${color}-200`]: true,
76
- };
39
+ return [
40
+ 'bg-primary-50',
41
+ 'dark:bg-primary-800',
42
+ 'border-primary-400',
43
+ 'ring-primary-200',
44
+ ];
77
45
  }, ...(ngDevMode ? [{ debugName: "activeColorClasses" }] : []));
78
- constructor() {
79
- effect(() => {
80
- const active = this.activeId();
81
- console.log('Active ID changed to:', active);
82
- this.options.update((options) => {
83
- return options.map((option) => {
84
- option.active = option.id === active;
85
- return option;
86
- });
87
- });
88
- });
89
- }
90
46
  selectItem(item) {
91
47
  if (this.activeId() !== item.id) {
92
48
  this.activeId.set(item.id);
93
49
  this.selectionChange.emit(item);
94
50
  }
95
- const options = this.options();
96
- options.map((option) => {
97
- const active = option.id === this.activeId();
98
- option.active = active;
99
- return option;
100
- });
101
- this.options.set(options);
102
51
  }
103
52
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: RadioCards, deps: [], target: i0.ɵɵFactoryTarget.Component });
104
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: RadioCards, isStandalone: true, selector: "mt-radio-cards", inputs: { circle: { classPropertyName: "circle", publicName: "circle", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, activeId: { classPropertyName: "activeId", publicName: "activeId", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { options: "optionsChange", activeId: "activeIdChange", selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplateContent", first: true, predicate: ["option"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n item.active\n ? activeColorClasses()\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100 '\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: item.active,\n color: color(),\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template\n #defaultTemplate\n let-template\n let-active=\"active\"\n let-color=\"color\"\n let-size=\"size\"\n>\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n class=\"font-semibold\"\n [class]=\"\n 'text-' +\n size +\n ' ' +\n (active\n ? 'text-' + color + '-500'\n : 'dark:text-gray-100 text-gray-600 ')\n \"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
53
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: RadioCards, isStandalone: true, selector: "mt-radio-cards", inputs: { circle: { classPropertyName: "circle", publicName: "circle", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, activeId: { classPropertyName: "activeId", publicName: "activeId", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { options: "optionsChange", activeId: "activeIdChange", selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplateContent", first: true, predicate: ["option"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n @let active = item.id === activeId();\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n active\n ? 'bg-primary-50 dark:bg-primary-800 border-primary-400 ring-primary-200'\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100'\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: active,\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template #defaultTemplate let-template let-active=\"active\" let-size=\"size\">\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n [class]=\"[\n 'font-semibold',\n textSizeClass(),\n 'dark:text-gray-100',\n 'text-gray-600',\n ]\"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
105
54
  }
106
55
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: RadioCards, decorators: [{
107
56
  type: Component,
108
- args: [{ selector: 'mt-radio-cards', standalone: true, imports: [NgTemplateOutlet, Avatar], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n item.active\n ? activeColorClasses()\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100 '\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: item.active,\n color: color(),\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template\n #defaultTemplate\n let-template\n let-active=\"active\"\n let-color=\"color\"\n let-size=\"size\"\n>\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n class=\"font-semibold\"\n [class]=\"\n 'text-' +\n size +\n ' ' +\n (active\n ? 'text-' + color + '-500'\n : 'dark:text-gray-100 text-gray-600 ')\n \"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n", styles: [":host{display:block}\n"] }]
109
- }], ctorParameters: () => [] });
57
+ args: [{ selector: 'mt-radio-cards', standalone: true, imports: [NgTemplateOutlet, Avatar], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n @let active = item.id === activeId();\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n active\n ? 'bg-primary-50 dark:bg-primary-800 border-primary-400 ring-primary-200'\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100'\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: active,\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template #defaultTemplate let-template let-active=\"active\" let-size=\"size\">\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n [class]=\"[\n 'font-semibold',\n textSizeClass(),\n 'dark:text-gray-100',\n 'text-gray-600',\n ]\"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n", styles: [":host{display:block}\n"] }]
58
+ }] });
110
59
 
111
60
  /**
112
61
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"masterteam-components-radio-cards.mjs","sources":["../../../../packages/masterteam/components/radio-cards/radio-cards.ts","../../../../packages/masterteam/components/radio-cards/radio-cards.html","../../../../packages/masterteam/components/radio-cards/masterteam-components-radio-cards.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n contentChild,\n input,\n output,\n TemplateRef,\n computed,\n model,\n effect,\n booleanAttribute,\n} from '@angular/core';\nimport { MTIcon } from '@masterteam/icons';\nimport { Avatar } from '@masterteam/components/avatar';\nimport { NgTemplateOutlet } from '@angular/common';\n\nexport interface RadioItem {\n id: string | number;\n name?: string;\n active?: boolean;\n icon?: MTIcon;\n [key: string]: any;\n}\n\n@Component({\n selector: 'mt-radio-cards',\n standalone: true,\n imports: [NgTemplateOutlet, Avatar],\n templateUrl: './radio-cards.html',\n styleUrl: './radio-cards.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class RadioCards {\n circle = input<boolean, unknown>(false, { transform: booleanAttribute });\n color = input('primary', {\n transform: (value: string) => {\n if (value) {\n return value;\n }\n return 'primary';\n },\n });\n size = input('medium', {\n transform: (value: 'small' | 'medium' | 'large') => {\n if (value) {\n switch (value) {\n case 'small':\n return 'xs';\n case 'medium':\n return 'base';\n case 'large':\n return '2xl';\n }\n }\n return 'base';\n },\n });\n avatarSize = computed(() => {\n switch (this.size()) {\n case 'xs':\n return 'normal';\n case 'base':\n return 'large';\n case '2xl':\n return 'xlarge';\n default:\n return 'normal';\n }\n });\n options = model.required<RadioItem[]>();\n activeId = model<string | number>();\n selectionChange = output<RadioItem>();\n\n itemTemplate = input<TemplateRef<any> | null>(null);\n itemTemplateContent = contentChild('option', { read: TemplateRef });\n\n /**\n * A computed signal that generates the dynamic Tailwind CSS classes\n * for the active state based on the color input.\n */\n protected activeColorClasses = computed(() => {\n const color = this.color();\n return {\n [`bg-${color}-50`]: true,\n [`dark:bg-${color}-800`]: true,\n [`border-${color}-400`]: true,\n [`ring-${color}-200`]: true,\n };\n });\n\n constructor() {\n effect(() => {\n const active = this.activeId();\n console.log('Active ID changed to:', active);\n this.options.update((options) => {\n return options.map((option) => {\n option.active = option.id === active;\n return option;\n });\n });\n });\n }\n\n public selectItem(item: RadioItem): void {\n if (this.activeId() !== item.id) {\n this.activeId.set(item.id);\n this.selectionChange.emit(item);\n }\n const options = this.options();\n options.map((option) => {\n const active = option.id === this.activeId();\n option.active = active;\n return option;\n });\n this.options.set(options);\n }\n}\n","<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n item.active\n ? activeColorClasses()\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100 '\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: item.active,\n color: color(),\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template\n #defaultTemplate\n let-template\n let-active=\"active\"\n let-color=\"color\"\n let-size=\"size\"\n>\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n class=\"font-semibold\"\n [class]=\"\n 'text-' +\n size +\n ' ' +\n (active\n ? 'text-' + color + '-500'\n : 'dark:text-gray-100 text-gray-600 ')\n \"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"masterteam-components-radio-cards.mjs","sources":["../../../../packages/masterteam/components/radio-cards/radio-cards.ts","../../../../packages/masterteam/components/radio-cards/radio-cards.html","../../../../packages/masterteam/components/radio-cards/masterteam-components-radio-cards.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n contentChild,\n input,\n output,\n TemplateRef,\n computed,\n model,\n booleanAttribute,\n} from '@angular/core';\nimport { MTIcon } from '@masterteam/icons';\nimport { Avatar } from '@masterteam/components/avatar';\nimport { NgTemplateOutlet } from '@angular/common';\n\nexport interface RadioItem {\n id: string | number;\n name?: string;\n icon?: MTIcon;\n [key: string]: any;\n}\n\n@Component({\n selector: 'mt-radio-cards',\n standalone: true,\n imports: [NgTemplateOutlet, Avatar],\n templateUrl: './radio-cards.html',\n styleUrl: './radio-cards.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class RadioCards {\n circle = input<boolean, unknown>(false, { transform: booleanAttribute });\n color = input<string>('primary');\n size = input<'small' | 'medium' | 'large'>('medium');\n avatarSize = computed(() => {\n switch (this.size()) {\n case 'small':\n return 'normal';\n case 'medium':\n return 'large';\n case 'large':\n return 'xlarge';\n default:\n return 'normal';\n }\n });\n options = model.required<RadioItem[]>();\n activeId = model<string | number>();\n selectionChange = output<RadioItem>();\n\n itemTemplate = input<TemplateRef<any> | null>(null);\n itemTemplateContent = contentChild('option', { read: TemplateRef });\n\n textSizeClass = computed(() => {\n switch (this.size()) {\n case 'small':\n return 'text-xs';\n\n case 'large':\n return 'text-2xl';\n\n default:\n return 'text-base';\n }\n });\n classes = computed(() => {});\n\n protected activeColorClasses = computed(() => {\n return [\n 'bg-primary-50',\n 'dark:bg-primary-800',\n 'border-primary-400',\n 'ring-primary-200',\n ];\n });\n\n public selectItem(item: RadioItem): void {\n if (this.activeId() !== item.id) {\n this.activeId.set(item.id);\n this.selectionChange.emit(item);\n }\n }\n}\n","<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n @let active = item.id === activeId();\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n active\n ? 'bg-primary-50 dark:bg-primary-800 border-primary-400 ring-primary-200'\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100'\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: active,\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template #defaultTemplate let-template let-active=\"active\" let-size=\"size\">\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n [class]=\"[\n 'font-semibold',\n textSizeClass(),\n 'dark:text-gray-100',\n 'text-gray-600',\n ]\"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@masterteam/components",
3
- "version": "0.0.18",
3
+ "version": "0.0.19",
4
4
  "publishConfig": {
5
5
  "directory": ".",
6
6
  "linkDirectory": false,
@@ -38,17 +38,13 @@
38
38
  "types": "./index.d.ts",
39
39
  "default": "./fesm2022/masterteam-components.mjs"
40
40
  },
41
- "./avatar-text": {
42
- "types": "./avatar-text/index.d.ts",
43
- "default": "./fesm2022/masterteam-components-avatar-text.mjs"
44
- },
45
41
  "./avatar": {
46
42
  "types": "./avatar/index.d.ts",
47
43
  "default": "./fesm2022/masterteam-components-avatar.mjs"
48
44
  },
49
- "./breadcrumb": {
50
- "types": "./breadcrumb/index.d.ts",
51
- "default": "./fesm2022/masterteam-components-breadcrumb.mjs"
45
+ "./avatar-text": {
46
+ "types": "./avatar-text/index.d.ts",
47
+ "default": "./fesm2022/masterteam-components-avatar-text.mjs"
52
48
  },
53
49
  "./button": {
54
50
  "types": "./button/index.d.ts",
@@ -62,17 +58,21 @@
62
58
  "types": "./card/index.d.ts",
63
59
  "default": "./fesm2022/masterteam-components-card.mjs"
64
60
  },
65
- "./color-picker-field": {
66
- "types": "./color-picker-field/index.d.ts",
67
- "default": "./fesm2022/masterteam-components-color-picker-field.mjs"
61
+ "./checkbox-field": {
62
+ "types": "./checkbox-field/index.d.ts",
63
+ "default": "./fesm2022/masterteam-components-checkbox-field.mjs"
68
64
  },
69
65
  "./chip": {
70
66
  "types": "./chip/index.d.ts",
71
67
  "default": "./fesm2022/masterteam-components-chip.mjs"
72
68
  },
73
- "./checkbox-field": {
74
- "types": "./checkbox-field/index.d.ts",
75
- "default": "./fesm2022/masterteam-components-checkbox-field.mjs"
69
+ "./breadcrumb": {
70
+ "types": "./breadcrumb/index.d.ts",
71
+ "default": "./fesm2022/masterteam-components-breadcrumb.mjs"
72
+ },
73
+ "./color-picker-field": {
74
+ "types": "./color-picker-field/index.d.ts",
75
+ "default": "./fesm2022/masterteam-components-color-picker-field.mjs"
76
76
  },
77
77
  "./date-field": {
78
78
  "types": "./date-field/index.d.ts",
@@ -82,30 +82,30 @@
82
82
  "types": "./editor-field/index.d.ts",
83
83
  "default": "./fesm2022/masterteam-components-editor-field.mjs"
84
84
  },
85
- "./field-validation": {
86
- "types": "./field-validation/index.d.ts",
87
- "default": "./fesm2022/masterteam-components-field-validation.mjs"
88
- },
89
- "./formula-builder": {
90
- "types": "./formula-builder/index.d.ts",
91
- "default": "./fesm2022/masterteam-components-formula-builder.mjs"
85
+ "./list": {
86
+ "types": "./list/index.d.ts",
87
+ "default": "./fesm2022/masterteam-components-list.mjs"
92
88
  },
93
89
  "./icon-field": {
94
90
  "types": "./icon-field/index.d.ts",
95
91
  "default": "./fesm2022/masterteam-components-icon-field.mjs"
96
92
  },
97
- "./list": {
98
- "types": "./list/index.d.ts",
99
- "default": "./fesm2022/masterteam-components-list.mjs"
93
+ "./formula-builder": {
94
+ "types": "./formula-builder/index.d.ts",
95
+ "default": "./fesm2022/masterteam-components-formula-builder.mjs"
100
96
  },
101
- "./number-field": {
102
- "types": "./number-field/index.d.ts",
103
- "default": "./fesm2022/masterteam-components-number-field.mjs"
97
+ "./field-validation": {
98
+ "types": "./field-validation/index.d.ts",
99
+ "default": "./fesm2022/masterteam-components-field-validation.mjs"
104
100
  },
105
101
  "./multi-select-field": {
106
102
  "types": "./multi-select-field/index.d.ts",
107
103
  "default": "./fesm2022/masterteam-components-multi-select-field.mjs"
108
104
  },
105
+ "./number-field": {
106
+ "types": "./number-field/index.d.ts",
107
+ "default": "./fesm2022/masterteam-components-number-field.mjs"
108
+ },
109
109
  "./paginator": {
110
110
  "types": "./paginator/index.d.ts",
111
111
  "default": "./fesm2022/masterteam-components-paginator.mjs"
@@ -114,21 +114,25 @@
114
114
  "types": "./radio-cards/index.d.ts",
115
115
  "default": "./fesm2022/masterteam-components-radio-cards.mjs"
116
116
  },
117
+ "./radio-cards-field": {
118
+ "types": "./radio-cards-field/index.d.ts",
119
+ "default": "./fesm2022/masterteam-components-radio-cards-field.mjs"
120
+ },
117
121
  "./radio-button-field": {
118
122
  "types": "./radio-button-field/index.d.ts",
119
123
  "default": "./fesm2022/masterteam-components-radio-button-field.mjs"
120
124
  },
121
- "./radio-cards-field": {
122
- "types": "./radio-cards-field/index.d.ts",
123
- "default": "./fesm2022/masterteam-components-radio-cards-field.mjs"
125
+ "./select-field": {
126
+ "types": "./select-field/index.d.ts",
127
+ "default": "./fesm2022/masterteam-components-select-field.mjs"
124
128
  },
125
129
  "./tabs": {
126
130
  "types": "./tabs/index.d.ts",
127
131
  "default": "./fesm2022/masterteam-components-tabs.mjs"
128
132
  },
129
- "./select-field": {
130
- "types": "./select-field/index.d.ts",
131
- "default": "./fesm2022/masterteam-components-select-field.mjs"
133
+ "./text-field": {
134
+ "types": "./text-field/index.d.ts",
135
+ "default": "./fesm2022/masterteam-components-text-field.mjs"
132
136
  },
133
137
  "./slider-field": {
134
138
  "types": "./slider-field/index.d.ts",
@@ -138,17 +142,13 @@
138
142
  "types": "./textarea-field/index.d.ts",
139
143
  "default": "./fesm2022/masterteam-components-textarea-field.mjs"
140
144
  },
141
- "./text-field": {
142
- "types": "./text-field/index.d.ts",
143
- "default": "./fesm2022/masterteam-components-text-field.mjs"
145
+ "./toast": {
146
+ "types": "./toast/index.d.ts",
147
+ "default": "./fesm2022/masterteam-components-toast.mjs"
144
148
  },
145
149
  "./toggle-field": {
146
150
  "types": "./toggle-field/index.d.ts",
147
151
  "default": "./fesm2022/masterteam-components-toggle-field.mjs"
148
- },
149
- "./toast": {
150
- "types": "./toast/index.d.ts",
151
- "default": "./fesm2022/masterteam-components-toast.mjs"
152
152
  }
153
153
  }
154
154
  }
@@ -5,28 +5,22 @@ import { MTIcon } from '@masterteam/icons';
5
5
  interface RadioItem {
6
6
  id: string | number;
7
7
  name?: string;
8
- active?: boolean;
9
8
  icon?: MTIcon;
10
9
  [key: string]: any;
11
10
  }
12
11
  declare class RadioCards {
13
12
  circle: _angular_core.InputSignalWithTransform<boolean, unknown>;
14
- color: _angular_core.InputSignalWithTransform<string, string>;
15
- size: _angular_core.InputSignalWithTransform<"medium" | "xs" | "base" | "2xl", "medium" | "small" | "large">;
13
+ color: _angular_core.InputSignal<string>;
14
+ size: _angular_core.InputSignal<"small" | "medium" | "large">;
16
15
  avatarSize: _angular_core.Signal<"large" | "normal" | "xlarge">;
17
16
  options: _angular_core.ModelSignal<RadioItem[]>;
18
17
  activeId: _angular_core.ModelSignal<string | number | undefined>;
19
18
  selectionChange: _angular_core.OutputEmitterRef<RadioItem>;
20
19
  itemTemplate: _angular_core.InputSignal<TemplateRef<any> | null>;
21
20
  itemTemplateContent: _angular_core.Signal<TemplateRef<any> | undefined>;
22
- /**
23
- * A computed signal that generates the dynamic Tailwind CSS classes
24
- * for the active state based on the color input.
25
- */
26
- protected activeColorClasses: _angular_core.Signal<{
27
- [x: string]: boolean;
28
- }>;
29
- constructor();
21
+ textSizeClass: _angular_core.Signal<"text-xs" | "text-2xl" | "text-base">;
22
+ classes: _angular_core.Signal<void>;
23
+ protected activeColorClasses: _angular_core.Signal<string[]>;
30
24
  selectItem(item: RadioItem): void;
31
25
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadioCards, never>;
32
26
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioCards, "mt-radio-cards", never, { "circle": { "alias": "circle"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "activeId": { "alias": "activeId"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; }, { "options": "optionsChange"; "activeId": "activeIdChange"; "selectionChange": "selectionChange"; }, ["itemTemplateContent"], never, true, never>;