@deay/ui 0.0.6 → 0.0.8

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 CHANGED
@@ -38,6 +38,7 @@ A versatile button component with loading states and multiple sizes.
38
38
  - `size`: `'sm' | 'md' | 'lg'` (default: `'md'`) - Button size
39
39
  - `disabled`: `boolean` (default: `false`) - Disable the button
40
40
  - `loading`: `boolean` (default: `false`) - Show loading spinner
41
+ - `fullWidth`: `boolean` (default: `false`) - Make button span full container width
41
42
 
42
43
  **Usage:**
43
44
 
@@ -61,6 +62,11 @@ A versatile button component with loading states and multiple sizes.
61
62
  <dai-button size="md" [disabled]="true">
62
63
  Button
63
64
  </dai-button>
65
+
66
+ <!-- Full width button -->
67
+ <dai-button size="md" [fullWidth]="true">
68
+ Full Width Button
69
+ </dai-button>
64
70
  ```
65
71
 
66
72
  **Design Specifications:**
@@ -155,6 +161,7 @@ A feature-rich input component with validation states and Angular Forms integrat
155
161
  - Use `size="sm"` for dense UI areas and tables
156
162
  - Use `size="md"` for standard buttons (default)
157
163
  - Use `size="lg"` for prominent call-to-action buttons
164
+ - Use `fullWidth="true"` for buttons that should fill their container width
158
165
  - Loading state automatically disables the button
159
166
  - Always provide accessible button text
160
167
 
@@ -1,14 +1,15 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, computed, Component, model, output, forwardRef } from '@angular/core';
2
+ import { input, computed, HostBinding, Component, model, output, forwardRef } from '@angular/core';
3
3
  import { CommonModule } from '@angular/common';
4
4
  import { NG_VALUE_ACCESSOR } from '@angular/forms';
5
5
 
6
- class DaiButtonComponent {
6
+ class DeayButtonComponent {
7
7
  // Signal Inputs (Angular 19+)
8
8
  variant = input('primary');
9
9
  size = input('md');
10
10
  disabled = input(false);
11
11
  loading = input(false);
12
+ fullWidth = input(false);
12
13
  // Computed properties for dynamic classes
13
14
  computedClasses = computed(() => {
14
15
  const classes = [
@@ -19,12 +20,21 @@ class DaiButtonComponent {
19
20
  if (this.loading()) {
20
21
  classes.push('dai-button-loading');
21
22
  }
23
+ if (this.fullWidth()) {
24
+ classes.push('dai-button-fullwidth');
25
+ }
22
26
  return classes.join(' ');
23
27
  });
24
28
  // Computed disabled state (disabled or loading)
25
29
  isDisabled = computed(() => this.disabled() || this.loading());
26
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DaiButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
27
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: DaiButtonComponent, isStandalone: true, selector: "dai-button", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
30
+ // Host bindings for fullWidth styling
31
+ get hostClasses() {
32
+ return {
33
+ 'dai-button-host-fullwidth': this.fullWidth(),
34
+ };
35
+ }
36
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DeayButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
37
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: DeayButtonComponent, isStandalone: true, selector: "dai-button", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: `
28
38
  <button
29
39
  [class]="computedClasses()"
30
40
  [disabled]="isDisabled()"
@@ -36,9 +46,9 @@ class DaiButtonComponent {
36
46
  }
37
47
  <ng-content />
38
48
  </button>
39
- `, isInline: true, styles: [":host{display:inline-block}button{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;line-height:1.5;border-radius:50px;cursor:pointer;transition:all .15s ease-in-out;border:1px solid transparent;box-sizing:border-box}button:focus-visible{outline:none}button:disabled{cursor:not-allowed;opacity:1}.dai-button-sm{padding:2px 8px;height:24px;font-size:12px;line-height:1.5em}.dai-button-md{padding:6px 12px;height:32px;font-size:14px;line-height:1.4285714285714286em}.dai-button-lg{padding:8px 16px;height:40px;font-size:16px;line-height:1.375em}.dai-button-primary{background-color:#2047f4;color:#fff}.dai-button-primary:hover:not(:disabled){background-color:#5164f7}.dai-button-primary:focus-visible{background-color:#2047f4;border-color:#112eac;box-shadow:0 0 0 1px #112eac}.dai-button-primary:disabled,.dai-button-primary.dai-button-loading{background-color:#9098fa}.dai-button-primary.dai-button-loading{cursor:wait}.dai-button-sm .dai-spinner{width:14px;height:14px}.dai-button-md .dai-spinner{width:16px;height:16px}.dai-button-lg .dai-spinner{width:22px;height:22px}.dai-spinner{display:inline-block;border:2px solid #FFFFFF;border-right-color:transparent;border-radius:50%;animation:dai-spin .6s linear infinite}@keyframes dai-spin{to{transform:rotate(360deg)}}\n"] });
49
+ `, isInline: true, styles: [":host{display:inline-block}:host.dai-button-host-fullwidth{display:block;width:100%}button{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;line-height:1.5;border-radius:50px;cursor:pointer;transition:all .15s ease-in-out;border:1px solid transparent;box-sizing:border-box}button:focus-visible{outline:none}button:disabled{cursor:not-allowed;opacity:1}.dai-button-sm{padding:2px 8px;height:24px;font-size:12px;line-height:1.5em}.dai-button-md{padding:6px 12px;height:32px;font-size:14px;line-height:1.4285714285714286em}.dai-button-lg{padding:8px 16px;height:40px;font-size:16px;line-height:1.375em}.dai-button-primary{background-color:#2047f4;color:#fff}.dai-button-primary:hover:not(:disabled){background-color:#5164f7}.dai-button-primary:focus-visible{background-color:#2047f4;border-color:#112eac;box-shadow:0 0 0 1px #112eac}.dai-button-primary:disabled,.dai-button-primary.dai-button-loading{background-color:#9098fa}.dai-button-primary.dai-button-loading{cursor:wait}.dai-button-sm .dai-spinner{width:14px;height:14px}.dai-button-md .dai-spinner{width:16px;height:16px}.dai-button-lg .dai-spinner{width:22px;height:22px}.dai-spinner{display:inline-block;border:2px solid #FFFFFF;border-right-color:transparent;border-radius:50%;animation:dai-spin .6s linear infinite}.dai-button-fullwidth{width:100%}@keyframes dai-spin{to{transform:rotate(360deg)}}\n"] });
40
50
  }
41
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DaiButtonComponent, decorators: [{
51
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DeayButtonComponent, decorators: [{
42
52
  type: Component,
43
53
  args: [{ selector: 'dai-button', standalone: true, template: `
44
54
  <button
@@ -52,10 +62,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
52
62
  }
53
63
  <ng-content />
54
64
  </button>
55
- `, styles: [":host{display:inline-block}button{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;line-height:1.5;border-radius:50px;cursor:pointer;transition:all .15s ease-in-out;border:1px solid transparent;box-sizing:border-box}button:focus-visible{outline:none}button:disabled{cursor:not-allowed;opacity:1}.dai-button-sm{padding:2px 8px;height:24px;font-size:12px;line-height:1.5em}.dai-button-md{padding:6px 12px;height:32px;font-size:14px;line-height:1.4285714285714286em}.dai-button-lg{padding:8px 16px;height:40px;font-size:16px;line-height:1.375em}.dai-button-primary{background-color:#2047f4;color:#fff}.dai-button-primary:hover:not(:disabled){background-color:#5164f7}.dai-button-primary:focus-visible{background-color:#2047f4;border-color:#112eac;box-shadow:0 0 0 1px #112eac}.dai-button-primary:disabled,.dai-button-primary.dai-button-loading{background-color:#9098fa}.dai-button-primary.dai-button-loading{cursor:wait}.dai-button-sm .dai-spinner{width:14px;height:14px}.dai-button-md .dai-spinner{width:16px;height:16px}.dai-button-lg .dai-spinner{width:22px;height:22px}.dai-spinner{display:inline-block;border:2px solid #FFFFFF;border-right-color:transparent;border-radius:50%;animation:dai-spin .6s linear infinite}@keyframes dai-spin{to{transform:rotate(360deg)}}\n"] }]
56
- }] });
65
+ `, styles: [":host{display:inline-block}:host.dai-button-host-fullwidth{display:block;width:100%}button{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;line-height:1.5;border-radius:50px;cursor:pointer;transition:all .15s ease-in-out;border:1px solid transparent;box-sizing:border-box}button:focus-visible{outline:none}button:disabled{cursor:not-allowed;opacity:1}.dai-button-sm{padding:2px 8px;height:24px;font-size:12px;line-height:1.5em}.dai-button-md{padding:6px 12px;height:32px;font-size:14px;line-height:1.4285714285714286em}.dai-button-lg{padding:8px 16px;height:40px;font-size:16px;line-height:1.375em}.dai-button-primary{background-color:#2047f4;color:#fff}.dai-button-primary:hover:not(:disabled){background-color:#5164f7}.dai-button-primary:focus-visible{background-color:#2047f4;border-color:#112eac;box-shadow:0 0 0 1px #112eac}.dai-button-primary:disabled,.dai-button-primary.dai-button-loading{background-color:#9098fa}.dai-button-primary.dai-button-loading{cursor:wait}.dai-button-sm .dai-spinner{width:14px;height:14px}.dai-button-md .dai-spinner{width:16px;height:16px}.dai-button-lg .dai-spinner{width:22px;height:22px}.dai-spinner{display:inline-block;border:2px solid #FFFFFF;border-right-color:transparent;border-radius:50%;animation:dai-spin .6s linear infinite}.dai-button-fullwidth{width:100%}@keyframes dai-spin{to{transform:rotate(360deg)}}\n"] }]
66
+ }], propDecorators: { hostClasses: [{
67
+ type: HostBinding,
68
+ args: ['class']
69
+ }] } });
57
70
 
58
- class DaiInputComponent {
71
+ class DeayInputComponent {
59
72
  // Signal Inputs
60
73
  label = input('');
61
74
  placeholder = input('Text');
@@ -97,11 +110,11 @@ class DaiInputComponent {
97
110
  setDisabledState(isDisabled) {
98
111
  // Handled through the disabled input signal
99
112
  }
100
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DaiInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
101
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: DaiInputComponent, isStandalone: true, selector: "dai-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChange: "valueChange", blur: "blur" }, providers: [
113
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DeayInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
114
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: DeayInputComponent, isStandalone: true, selector: "dai-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChange: "valueChange", blur: "blur" }, providers: [
102
115
  {
103
116
  provide: NG_VALUE_ACCESSOR,
104
- useExisting: forwardRef(() => DaiInputComponent),
117
+ useExisting: forwardRef(() => DeayInputComponent),
105
118
  multi: true,
106
119
  },
107
120
  ], ngImport: i0, template: `
@@ -134,7 +147,7 @@ class DaiInputComponent {
134
147
  </div>
135
148
  `, isInline: true, styles: [":host{display:block;width:100%}.dai-input-wrapper{display:flex;flex-direction:column;gap:8px;width:100%}.dai-input-label{display:block;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;font-weight:400;line-height:1.5em;color:#000}.dai-input-field{width:100%;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:400;line-height:1.5em;color:#000;background-color:#fff;border:1px solid #E5E0EB;border-radius:50px;box-sizing:border-box;outline:none;transition:all .15s ease-in-out}.dai-input-field::placeholder{color:#aba7af}.dai-input-sm{padding:8px 12px}.dai-input-md{padding:12px;height:44px}.dai-input-lg{padding:14px 12px;height:50px}.dai-input-sm:focus{border-color:#061764;border-width:2px;padding:7px 11px}.dai-input-md:focus,.dai-input-lg:focus{border-color:#112eac;border-width:1px}.dai-input-field:disabled{background-color:#dfdfdf;border-color:#dfdfdf;color:#aba7af;cursor:not-allowed}.dai-input-error .dai-input-field{border-color:#d51a52;border-width:2px}.dai-input-error .dai-input-sm{padding:7px 11px}.dai-input-error .dai-input-md{padding:11px}.dai-input-error .dai-input-lg{padding:13px 11px}.dai-input-error-message{display:block;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:400;line-height:1.5em;color:#d51a52}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
136
149
  }
137
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DaiInputComponent, decorators: [{
150
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DeayInputComponent, decorators: [{
138
151
  type: Component,
139
152
  args: [{ selector: 'dai-input', standalone: true, imports: [CommonModule], template: `
140
153
  <div class="dai-input-wrapper" [class.dai-input-error]="hasError()">
@@ -167,7 +180,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
167
180
  `, providers: [
168
181
  {
169
182
  provide: NG_VALUE_ACCESSOR,
170
- useExisting: forwardRef(() => DaiInputComponent),
183
+ useExisting: forwardRef(() => DeayInputComponent),
171
184
  multi: true,
172
185
  },
173
186
  ], styles: [":host{display:block;width:100%}.dai-input-wrapper{display:flex;flex-direction:column;gap:8px;width:100%}.dai-input-label{display:block;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;font-weight:400;line-height:1.5em;color:#000}.dai-input-field{width:100%;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:400;line-height:1.5em;color:#000;background-color:#fff;border:1px solid #E5E0EB;border-radius:50px;box-sizing:border-box;outline:none;transition:all .15s ease-in-out}.dai-input-field::placeholder{color:#aba7af}.dai-input-sm{padding:8px 12px}.dai-input-md{padding:12px;height:44px}.dai-input-lg{padding:14px 12px;height:50px}.dai-input-sm:focus{border-color:#061764;border-width:2px;padding:7px 11px}.dai-input-md:focus,.dai-input-lg:focus{border-color:#112eac;border-width:1px}.dai-input-field:disabled{background-color:#dfdfdf;border-color:#dfdfdf;color:#aba7af;cursor:not-allowed}.dai-input-error .dai-input-field{border-color:#d51a52;border-width:2px}.dai-input-error .dai-input-sm{padding:7px 11px}.dai-input-error .dai-input-md{padding:11px}.dai-input-error .dai-input-lg{padding:13px 11px}.dai-input-error-message{display:block;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:400;line-height:1.5em;color:#d51a52}\n"] }]
@@ -182,5 +195,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
182
195
  * Generated bundle index. Do not edit.
183
196
  */
184
197
 
185
- export { DaiButtonComponent, DaiInputComponent };
198
+ export { DeayButtonComponent, DeayInputComponent };
186
199
  //# sourceMappingURL=deay-ui.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"deay-ui.mjs","sources":["../../src/lib/button/button.component.ts","../../src/lib/input/input.component.ts","../../src/public-api.ts","../../src/deay-ui.ts"],"sourcesContent":["import { Component, input, computed } from '@angular/core';\nimport type { CvButtonVariant, CvButtonSize } from './button.variants';\n\n@Component({\n selector: 'dai-button',\n standalone: true,\n template: `\n <button\n [class]=\"computedClasses()\"\n [disabled]=\"isDisabled()\"\n [attr.aria-disabled]=\"isDisabled()\"\n [attr.aria-busy]=\"loading()\"\n >\n @if (loading()) {\n <span class=\"dai-spinner\" aria-hidden=\"true\"></span>\n }\n <ng-content />\n </button>\n `,\n styles: [\n `\n :host {\n display: inline-block;\n }\n\n button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-weight: 400;\n line-height: 1.5;\n border-radius: 50px;\n cursor: pointer;\n transition: all 150ms ease-in-out;\n border: 1px solid transparent;\n box-sizing: border-box;\n }\n\n button:focus-visible {\n outline: none;\n }\n\n button:disabled {\n cursor: not-allowed;\n opacity: 1;\n }\n\n /* Sizes */\n .dai-button-sm {\n padding: 2px 8px;\n height: 24px;\n font-size: 12px;\n line-height: 1.5em;\n }\n\n .dai-button-md {\n padding: 6px 12px;\n height: 32px;\n font-size: 14px;\n line-height: 1.4285714285714286em;\n }\n\n .dai-button-lg {\n padding: 8px 16px;\n height: 40px;\n font-size: 16px;\n line-height: 1.375em;\n }\n\n /* Primary Variant - Default State */\n .dai-button-primary {\n background-color: #2047F4;\n color: #FFFFFF;\n }\n\n .dai-button-primary:hover:not(:disabled) {\n background-color: #5164F7;\n }\n\n .dai-button-primary:focus-visible {\n background-color: #2047F4;\n border-color: #112EAC;\n box-shadow: 0 0 0 1px #112EAC;\n }\n\n .dai-button-primary:disabled,\n .dai-button-primary.dai-button-loading {\n background-color: #9098FA;\n }\n\n .dai-button-primary.dai-button-loading {\n cursor: wait;\n }\n\n /* Spinner sizes */\n .dai-button-sm .dai-spinner {\n width: 14px;\n height: 14px;\n }\n\n .dai-button-md .dai-spinner {\n width: 16px;\n height: 16px;\n }\n\n .dai-button-lg .dai-spinner {\n width: 22px;\n height: 22px;\n }\n\n .dai-spinner {\n display: inline-block;\n border: 2px solid #FFFFFF;\n border-right-color: transparent;\n border-radius: 50%;\n animation: dai-spin 0.6s linear infinite;\n }\n\n @keyframes dai-spin {\n to {\n transform: rotate(360deg);\n }\n }\n `,\n ],\n})\nexport class DaiButtonComponent {\n // Signal Inputs (Angular 19+)\n readonly variant = input<CvButtonVariant>('primary');\n readonly size = input<CvButtonSize>('md');\n readonly disabled = input<boolean>(false);\n readonly loading = input<boolean>(false);\n\n // Computed properties for dynamic classes\n protected computedClasses = computed(() => {\n const classes = [\n 'dai-button',\n `dai-button-${this.variant()}`,\n `dai-button-${this.size()}`,\n ];\n\n if (this.loading()) {\n classes.push('dai-button-loading');\n }\n\n return classes.join(' ');\n });\n\n // Computed disabled state (disabled or loading)\n protected isDisabled = computed(() => this.disabled() || this.loading());\n}\n","import { Component, input, output, model, forwardRef, computed } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport {\n type ControlValueAccessor,\n NG_VALUE_ACCESSOR,\n} from '@angular/forms';\n\nexport type CvInputSize = 'sm' | 'md' | 'lg';\n\n@Component({\n selector: 'dai-input',\n standalone: true,\n imports: [CommonModule],\n template: `\n <div class=\"dai-input-wrapper\" [class.dai-input-error]=\"hasError()\">\n <label [for]=\"inputId()\" class=\"dai-input-label\">\n {{ label() }}\n </label>\n\n <input\n [id]=\"inputId()\"\n [type]=\"type()\"\n [placeholder]=\"placeholder()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (blur)=\"onTouched()\"\n [disabled]=\"disabled()\"\n [class.dai-input-field]=\"true\"\n [class.dai-input-sm]=\"size() === 'sm'\"\n [class.dai-input-md]=\"size() === 'md'\"\n [class.dai-input-lg]=\"size() === 'lg'\"\n [attr.aria-invalid]=\"hasError()\"\n [attr.aria-describedby]=\"hasError() ? errorId() : null\"\n />\n\n @if (hasError() && errorMessage()) {\n <span [id]=\"errorId()\" class=\"dai-input-error-message\" role=\"alert\">\n {{ errorMessage() }}\n </span>\n }\n </div>\n `,\n styles: [\n `\n :host {\n display: block;\n width: 100%;\n }\n\n .dai-input-wrapper {\n display: flex;\n flex-direction: column;\n gap: 8px;\n width: 100%;\n }\n\n .dai-input-label {\n display: block;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5em;\n color: #000000;\n }\n\n .dai-input-field {\n width: 100%;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.5em;\n color: #000000;\n background-color: #FFFFFF;\n border: 1px solid #E5E0EB;\n border-radius: 50px;\n box-sizing: border-box;\n outline: none;\n transition: all 150ms ease-in-out;\n }\n\n .dai-input-field::placeholder {\n color: #ABA7AF;\n }\n\n /* Sizes */\n .dai-input-sm {\n padding: 8px 12px;\n }\n\n .dai-input-md {\n padding: 12px;\n height: 44px;\n }\n\n .dai-input-lg {\n padding: 14px 12px;\n height: 50px;\n }\n\n /* Focus State */\n .dai-input-sm:focus {\n border-color: #061764;\n border-width: 2px;\n padding: 7px 11px; /* Adjust for 2px border */\n }\n\n .dai-input-md:focus,\n .dai-input-lg:focus {\n border-color: #112EAC;\n border-width: 1px;\n }\n\n /* Disabled State */\n .dai-input-field:disabled {\n background-color: #DFDFDF;\n border-color: #DFDFDF;\n color: #ABA7AF;\n cursor: not-allowed;\n }\n\n /* Error State */\n .dai-input-error .dai-input-field {\n border-color: #D51A52;\n border-width: 2px;\n }\n\n .dai-input-error .dai-input-sm {\n padding: 7px 11px; /* Adjust for 2px border */\n }\n\n .dai-input-error .dai-input-md {\n padding: 11px; /* Adjust for 2px border */\n }\n\n .dai-input-error .dai-input-lg {\n padding: 13px 11px; /* Adjust for 2px border */\n }\n\n .dai-input-error-message {\n display: block;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.5em;\n color: #D51A52;\n }\n `,\n ],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => DaiInputComponent),\n multi: true,\n },\n ],\n})\nexport class DaiInputComponent implements ControlValueAccessor {\n // Signal Inputs\n readonly label = input<string>('');\n readonly placeholder = input<string>('Text');\n readonly type = input<'text' | 'password' | 'email'>('text');\n readonly disabled = input<boolean>(false);\n readonly errorMessage = input<string>('');\n readonly size = input<CvInputSize>('md');\n readonly inputId = input<string>(`dai-input-${Math.random().toString(36).substr(2, 9)}`);\n\n // Model for two-way binding (Angular 19+)\n readonly value = model<string>('');\n\n // Outputs for custom handling\n readonly valueChange = output<string>();\n readonly blur = output<void>();\n\n // Internal state\n private onChange: (value: string) => void = () => {};\n onTouched: () => void = () => {};\n\n // Computed error state\n protected hasError = computed(() => !!this.errorMessage());\n\n // Unique error message ID\n protected errorId = () => `${this.inputId()}-error`;\n\n // Handle input changes\n protected onInput(event: Event): void {\n const target = event.target as HTMLInputElement;\n const newValue = target.value;\n this.value.set(newValue);\n this.onChange(newValue);\n this.valueChange.emit(newValue);\n }\n\n // ControlValueAccessor implementation\n writeValue(value: string): void {\n this.value.set(value || '');\n }\n\n registerOnChange(fn: (value: string) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n // Handled through the disabled input signal\n }\n}\n","/*\n * Public API Surface of @deay/ui\n */\n\n// Export components\nexport * from './lib/button/button.component';\nexport * from './lib/button/button.variants';\nexport * from './lib/input/input.component';\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":"deay-ui.mjs","sources":["../../src/lib/button/button.component.ts","../../src/lib/input/input.component.ts","../../src/public-api.ts","../../src/deay-ui.ts"],"sourcesContent":["import { Component, input, computed, HostBinding } from '@angular/core';\nimport type { CvButtonVariant, CvButtonSize } from './button.types';\n\n@Component({\n selector: 'dai-button',\n standalone: true,\n template: `\n <button\n [class]=\"computedClasses()\"\n [disabled]=\"isDisabled()\"\n [attr.aria-disabled]=\"isDisabled()\"\n [attr.aria-busy]=\"loading()\"\n >\n @if (loading()) {\n <span class=\"dai-spinner\" aria-hidden=\"true\"></span>\n }\n <ng-content />\n </button>\n `,\n styles: [\n `\n :host {\n display: inline-block;\n }\n\n :host.dai-button-host-fullwidth {\n display: block;\n width: 100%;\n }\n\n button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-weight: 400;\n line-height: 1.5;\n border-radius: 50px;\n cursor: pointer;\n transition: all 150ms ease-in-out;\n border: 1px solid transparent;\n box-sizing: border-box;\n }\n\n button:focus-visible {\n outline: none;\n }\n\n button:disabled {\n cursor: not-allowed;\n opacity: 1;\n }\n\n /* Sizes */\n .dai-button-sm {\n padding: 2px 8px;\n height: 24px;\n font-size: 12px;\n line-height: 1.5em;\n }\n\n .dai-button-md {\n padding: 6px 12px;\n height: 32px;\n font-size: 14px;\n line-height: 1.4285714285714286em;\n }\n\n .dai-button-lg {\n padding: 8px 16px;\n height: 40px;\n font-size: 16px;\n line-height: 1.375em;\n }\n\n /* Primary Variant - Default State */\n .dai-button-primary {\n background-color: #2047F4;\n color: #FFFFFF;\n }\n\n .dai-button-primary:hover:not(:disabled) {\n background-color: #5164F7;\n }\n\n .dai-button-primary:focus-visible {\n background-color: #2047F4;\n border-color: #112EAC;\n box-shadow: 0 0 0 1px #112EAC;\n }\n\n .dai-button-primary:disabled,\n .dai-button-primary.dai-button-loading {\n background-color: #9098FA;\n }\n\n .dai-button-primary.dai-button-loading {\n cursor: wait;\n }\n\n /* Spinner sizes */\n .dai-button-sm .dai-spinner {\n width: 14px;\n height: 14px;\n }\n\n .dai-button-md .dai-spinner {\n width: 16px;\n height: 16px;\n }\n\n .dai-button-lg .dai-spinner {\n width: 22px;\n height: 22px;\n }\n\n .dai-spinner {\n display: inline-block;\n border: 2px solid #FFFFFF;\n border-right-color: transparent;\n border-radius: 50%;\n animation: dai-spin 0.6s linear infinite;\n }\n\n /* Full Width Variant */\n .dai-button-fullwidth {\n width: 100%;\n }\n\n @keyframes dai-spin {\n to {\n transform: rotate(360deg);\n }\n }\n `,\n ],\n})\nexport class DeayButtonComponent {\n // Signal Inputs (Angular 19+)\n readonly variant = input<CvButtonVariant>('primary');\n readonly size = input<CvButtonSize>('md');\n readonly disabled = input<boolean>(false);\n readonly loading = input<boolean>(false);\n readonly fullWidth = input<boolean>(false);\n\n // Computed properties for dynamic classes\n protected computedClasses = computed(() => {\n const classes = [\n 'dai-button',\n `dai-button-${this.variant()}`,\n `dai-button-${this.size()}`,\n ];\n\n if (this.loading()) {\n classes.push('dai-button-loading');\n }\n\n if (this.fullWidth()) {\n classes.push('dai-button-fullwidth');\n }\n\n return classes.join(' ');\n });\n\n // Computed disabled state (disabled or loading)\n protected isDisabled = computed(() => this.disabled() || this.loading());\n\n // Host bindings for fullWidth styling\n @HostBinding('class')\n protected get hostClasses(): Record<string, boolean> {\n return {\n 'dai-button-host-fullwidth': this.fullWidth(),\n };\n }\n}\n","import { Component, input, output, model, forwardRef, computed } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport {\n type ControlValueAccessor,\n NG_VALUE_ACCESSOR,\n} from '@angular/forms';\nimport { CvInputSize, CvInputType } from './input.types';\n\n@Component({\n selector: 'dai-input',\n standalone: true,\n imports: [CommonModule],\n template: `\n <div class=\"dai-input-wrapper\" [class.dai-input-error]=\"hasError()\">\n <label [for]=\"inputId()\" class=\"dai-input-label\">\n {{ label() }}\n </label>\n\n <input\n [id]=\"inputId()\"\n [type]=\"type()\"\n [placeholder]=\"placeholder()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (blur)=\"onTouched()\"\n [disabled]=\"disabled()\"\n [class.dai-input-field]=\"true\"\n [class.dai-input-sm]=\"size() === 'sm'\"\n [class.dai-input-md]=\"size() === 'md'\"\n [class.dai-input-lg]=\"size() === 'lg'\"\n [attr.aria-invalid]=\"hasError()\"\n [attr.aria-describedby]=\"hasError() ? errorId() : null\"\n />\n\n @if (hasError() && errorMessage()) {\n <span [id]=\"errorId()\" class=\"dai-input-error-message\" role=\"alert\">\n {{ errorMessage() }}\n </span>\n }\n </div>\n `,\n styles: [\n `\n :host {\n display: block;\n width: 100%;\n }\n\n .dai-input-wrapper {\n display: flex;\n flex-direction: column;\n gap: 8px;\n width: 100%;\n }\n\n .dai-input-label {\n display: block;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5em;\n color: #000000;\n }\n\n .dai-input-field {\n width: 100%;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.5em;\n color: #000000;\n background-color: #FFFFFF;\n border: 1px solid #E5E0EB;\n border-radius: 50px;\n box-sizing: border-box;\n outline: none;\n transition: all 150ms ease-in-out;\n }\n\n .dai-input-field::placeholder {\n color: #ABA7AF;\n }\n\n /* Sizes */\n .dai-input-sm {\n padding: 8px 12px;\n }\n\n .dai-input-md {\n padding: 12px;\n height: 44px;\n }\n\n .dai-input-lg {\n padding: 14px 12px;\n height: 50px;\n }\n\n /* Focus State */\n .dai-input-sm:focus {\n border-color: #061764;\n border-width: 2px;\n padding: 7px 11px; /* Adjust for 2px border */\n }\n\n .dai-input-md:focus,\n .dai-input-lg:focus {\n border-color: #112EAC;\n border-width: 1px;\n }\n\n /* Disabled State */\n .dai-input-field:disabled {\n background-color: #DFDFDF;\n border-color: #DFDFDF;\n color: #ABA7AF;\n cursor: not-allowed;\n }\n\n /* Error State */\n .dai-input-error .dai-input-field {\n border-color: #D51A52;\n border-width: 2px;\n }\n\n .dai-input-error .dai-input-sm {\n padding: 7px 11px; /* Adjust for 2px border */\n }\n\n .dai-input-error .dai-input-md {\n padding: 11px; /* Adjust for 2px border */\n }\n\n .dai-input-error .dai-input-lg {\n padding: 13px 11px; /* Adjust for 2px border */\n }\n\n .dai-input-error-message {\n display: block;\n font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.5em;\n color: #D51A52;\n }\n `,\n ],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => DeayInputComponent),\n multi: true,\n },\n ],\n})\nexport class DeayInputComponent implements ControlValueAccessor {\n // Signal Inputs\n readonly label = input<string>('');\n readonly placeholder = input<string>('Text');\n readonly type = input<CvInputType>('text');\n readonly disabled = input<boolean>(false);\n readonly errorMessage = input<string>('');\n readonly size = input<CvInputSize>('md');\n readonly inputId = input<string>(`dai-input-${Math.random().toString(36).substr(2, 9)}`);\n\n // Model for two-way binding (Angular 19+)\n readonly value = model<string>('');\n\n // Outputs for custom handling\n readonly valueChange = output<string>();\n readonly blur = output<void>();\n\n // Internal state\n private onChange: (value: string) => void = () => {};\n onTouched: () => void = () => {};\n\n // Computed error state\n protected hasError = computed(() => !!this.errorMessage());\n\n // Unique error message ID\n protected errorId = () => `${this.inputId()}-error`;\n\n // Handle input changes\n protected onInput(event: Event): void {\n const target = event.target as HTMLInputElement;\n const newValue = target.value;\n this.value.set(newValue);\n this.onChange(newValue);\n this.valueChange.emit(newValue);\n }\n\n // ControlValueAccessor implementation\n writeValue(value: string): void {\n this.value.set(value || '');\n }\n\n registerOnChange(fn: (value: string) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n // Handled through the disabled input signal\n }\n}\n","/*\n * Public API Surface of @deay/ui\n */\n\n// Export components\nexport * from './lib/button/button.component';\nexport * from './lib/button/button.types';\nexport * from './lib/input/input.component';\nexport * from './lib/input/input.types';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -1,12 +1,14 @@
1
- import type { CvButtonSize } from './button.variants';
1
+ import type { CvButtonSize } from './button.types';
2
2
  import * as i0 from "@angular/core";
3
- export declare class DaiButtonComponent {
3
+ export declare class DeayButtonComponent {
4
4
  readonly variant: import("@angular/core").InputSignal<"primary">;
5
5
  readonly size: import("@angular/core").InputSignal<CvButtonSize>;
6
6
  readonly disabled: import("@angular/core").InputSignal<boolean>;
7
7
  readonly loading: import("@angular/core").InputSignal<boolean>;
8
+ readonly fullWidth: import("@angular/core").InputSignal<boolean>;
8
9
  protected computedClasses: import("@angular/core").Signal<string>;
9
10
  protected isDisabled: import("@angular/core").Signal<boolean>;
10
- static ɵfac: i0.ɵɵFactoryDeclaration<DaiButtonComponent, never>;
11
- static ɵcmp: i0.ɵɵComponentDeclaration<DaiButtonComponent, "dai-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
11
+ protected get hostClasses(): Record<string, boolean>;
12
+ static ɵfac: i0.ɵɵFactoryDeclaration<DeayButtonComponent, never>;
13
+ static ɵcmp: i0.ɵɵComponentDeclaration<DeayButtonComponent, "dai-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
12
14
  }
@@ -1,10 +1,10 @@
1
1
  import { type ControlValueAccessor } from '@angular/forms';
2
+ import { CvInputSize, CvInputType } from './input.types';
2
3
  import * as i0 from "@angular/core";
3
- export type CvInputSize = 'sm' | 'md' | 'lg';
4
- export declare class DaiInputComponent implements ControlValueAccessor {
4
+ export declare class DeayInputComponent implements ControlValueAccessor {
5
5
  readonly label: import("@angular/core").InputSignal<string>;
6
6
  readonly placeholder: import("@angular/core").InputSignal<string>;
7
- readonly type: import("@angular/core").InputSignal<"text" | "password" | "email">;
7
+ readonly type: import("@angular/core").InputSignal<CvInputType>;
8
8
  readonly disabled: import("@angular/core").InputSignal<boolean>;
9
9
  readonly errorMessage: import("@angular/core").InputSignal<string>;
10
10
  readonly size: import("@angular/core").InputSignal<CvInputSize>;
@@ -21,6 +21,6 @@ export declare class DaiInputComponent implements ControlValueAccessor {
21
21
  registerOnChange(fn: (value: string) => void): void;
22
22
  registerOnTouched(fn: () => void): void;
23
23
  setDisabledState(isDisabled: boolean): void;
24
- static ɵfac: i0.ɵɵFactoryDeclaration<DaiInputComponent, never>;
25
- static ɵcmp: i0.ɵɵComponentDeclaration<DaiInputComponent, "dai-input", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "valueChange": "valueChange"; "blur": "blur"; }, never, never, true, never>;
24
+ static ɵfac: i0.ɵɵFactoryDeclaration<DeayInputComponent, never>;
25
+ static ɵcmp: i0.ɵɵComponentDeclaration<DeayInputComponent, "dai-input", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "valueChange": "valueChange"; "blur": "blur"; }, never, never, true, never>;
26
26
  }
@@ -0,0 +1,2 @@
1
+ export type CvInputSize = 'sm' | 'md' | 'lg';
2
+ export type CvInputType = 'text' | 'password' | 'email';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deay/ui",
3
- "version": "0.0.6",
3
+ "version": "0.0.8",
4
4
  "type": "module",
5
5
  "peerDependencies": {
6
6
  "@angular/core": "19.2.17",
package/public-api.d.ts CHANGED
@@ -1,3 +1,4 @@
1
1
  export * from './lib/button/button.component';
2
- export * from './lib/button/button.variants';
2
+ export * from './lib/button/button.types';
3
3
  export * from './lib/input/input.component';
4
+ export * from './lib/input/input.types';