@egose/shadcn-theme-ng-tw 0.0.14
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 +2 -0
- package/accordion/README.md +64 -0
- package/accordion/fesm2022/accordion.mjs +155 -0
- package/accordion/fesm2022/accordion.mjs.map +1 -0
- package/accordion/index.d.ts +49 -0
- package/alert/README.md +64 -0
- package/alert/fesm2022/alert.mjs +189 -0
- package/alert/fesm2022/alert.mjs.map +1 -0
- package/alert/index.d.ts +49 -0
- package/autocomplete/README.md +64 -0
- package/autocomplete/fesm2022/autocomplete.mjs +543 -0
- package/autocomplete/fesm2022/autocomplete.mjs.map +1 -0
- package/autocomplete/index.d.ts +162 -0
- package/badge/README.md +64 -0
- package/badge/fesm2022/badge.mjs +137 -0
- package/badge/fesm2022/badge.mjs.map +1 -0
- package/badge/index.d.ts +33 -0
- package/basic-alert/README.md +64 -0
- package/basic-alert/fesm2022/basic-alert.mjs +103 -0
- package/basic-alert/fesm2022/basic-alert.mjs.map +1 -0
- package/basic-alert/index.d.ts +14 -0
- package/button/README.md +64 -0
- package/button/fesm2022/button.mjs +282 -0
- package/button/fesm2022/button.mjs.map +1 -0
- package/button/index.d.ts +52 -0
- package/calendar/README.md +64 -0
- package/calendar/fesm2022/calendar.mjs +637 -0
- package/calendar/fesm2022/calendar.mjs.map +1 -0
- package/calendar/index.d.ts +111 -0
- package/confirmation-dialog/README.md +64 -0
- package/confirmation-dialog/fesm2022/confirmation-dialog.mjs +93 -0
- package/confirmation-dialog/fesm2022/confirmation-dialog.mjs.map +1 -0
- package/confirmation-dialog/index.d.ts +24 -0
- package/date-picker/README.md +64 -0
- package/date-picker/fesm2022/date-picker.mjs +599 -0
- package/date-picker/fesm2022/date-picker.mjs.map +1 -0
- package/date-picker/index.d.ts +227 -0
- package/dialog/README.md +64 -0
- package/dialog/fesm2022/dialog.mjs +278 -0
- package/dialog/fesm2022/dialog.mjs.map +1 -0
- package/dialog/index.d.ts +89 -0
- package/exports.json +1 -0
- package/form-date-picker/README.md +64 -0
- package/form-date-picker/fesm2022/form-date-picker.mjs +146 -0
- package/form-date-picker/fesm2022/form-date-picker.mjs.map +1 -0
- package/form-date-picker/index.d.ts +32 -0
- package/form-field/README.md +64 -0
- package/form-field/fesm2022/form-field.mjs +112 -0
- package/form-field/fesm2022/form-field.mjs.map +1 -0
- package/form-field/index.d.ts +37 -0
- package/form-searchable-multiselect/README.md +64 -0
- package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs +124 -0
- package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs.map +1 -0
- package/form-searchable-multiselect/index.d.ts +28 -0
- package/form-select/README.md +64 -0
- package/form-select/fesm2022/form-select.mjs +165 -0
- package/form-select/fesm2022/form-select.mjs.map +1 -0
- package/form-select/index.d.ts +33 -0
- package/form-text-input/README.md +64 -0
- package/form-text-input/fesm2022/form-text-input.mjs +197 -0
- package/form-text-input/fesm2022/form-text-input.mjs.map +1 -0
- package/form-text-input/index.d.ts +47 -0
- package/form-textarea/README.md +64 -0
- package/form-textarea/fesm2022/form-textarea.mjs +156 -0
- package/form-textarea/fesm2022/form-textarea.mjs.map +1 -0
- package/form-textarea/index.d.ts +33 -0
- package/icon/README.md +64 -0
- package/icon/fesm2022/icon.mjs +71 -0
- package/icon/fesm2022/icon.mjs.map +1 -0
- package/icon/index.d.ts +27 -0
- package/input/README.md +64 -0
- package/input/fesm2022/input.mjs +97 -0
- package/input/fesm2022/input.mjs.map +1 -0
- package/input/index.d.ts +41 -0
- package/label/README.md +64 -0
- package/label/fesm2022/label.mjs +51 -0
- package/label/fesm2022/label.mjs.map +1 -0
- package/label/index.d.ts +19 -0
- package/package.json +139 -0
- package/popover/README.md +64 -0
- package/popover/fesm2022/popover.mjs +69 -0
- package/popover/fesm2022/popover.mjs.map +1 -0
- package/popover/index.d.ts +30 -0
- package/radio-group/README.md +64 -0
- package/radio-group/fesm2022/radio-group.mjs +170 -0
- package/radio-group/fesm2022/radio-group.mjs.map +1 -0
- package/radio-group/index.d.ts +63 -0
- package/searchable-multiselect/README.md +64 -0
- package/searchable-multiselect/fesm2022/searchable-multiselect.mjs +221 -0
- package/searchable-multiselect/fesm2022/searchable-multiselect.mjs.map +1 -0
- package/searchable-multiselect/index.d.ts +50 -0
- package/select/README.md +64 -0
- package/select/fesm2022/select.mjs +281 -0
- package/select/fesm2022/select.mjs.map +1 -0
- package/select/index.d.ts +92 -0
- package/separator/README.md +64 -0
- package/separator/fesm2022/separator.mjs +46 -0
- package/separator/fesm2022/separator.mjs.map +1 -0
- package/separator/index.d.ts +19 -0
- package/sonner/README.md +64 -0
- package/sonner/fesm2022/sonner.mjs +110 -0
- package/sonner/fesm2022/sonner.mjs.map +1 -0
- package/sonner/index.d.ts +32 -0
- package/spinner/README.md +64 -0
- package/spinner/fesm2022/spinner.mjs +67 -0
- package/spinner/fesm2022/spinner.mjs.map +1 -0
- package/spinner/index.d.ts +25 -0
- package/switch/README.md +64 -0
- package/switch/fesm2022/switch.mjs +139 -0
- package/switch/fesm2022/switch.mjs.map +1 -0
- package/switch/index.d.ts +56 -0
- package/tabs/README.md +64 -0
- package/tabs/fesm2022/tabs.mjs +258 -0
- package/tabs/fesm2022/tabs.mjs.map +1 -0
- package/tabs/index.d.ts +71 -0
- package/tooltip/README.md +64 -0
- package/tooltip/fesm2022/tooltip.mjs +93 -0
- package/tooltip/fesm2022/tooltip.mjs.map +1 -0
- package/tooltip/index.d.ts +21 -0
- package/utils/README.md +64 -0
- package/utils/fesm2022/utils.mjs +17 -0
- package/utils/fesm2022/utils.mjs.map +1 -0
- package/utils/index.d.ts +5 -0
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { OnChanges, ElementRef, Renderer2 } from '@angular/core';
|
|
3
|
+
import { ClassValue } from 'clsx';
|
|
4
|
+
|
|
5
|
+
declare class SpreadAttrsDirective implements OnChanges {
|
|
6
|
+
private el;
|
|
7
|
+
private renderer;
|
|
8
|
+
attrs: _angular_core.InputSignal<Record<string, any>>;
|
|
9
|
+
constructor(el: ElementRef, renderer: Renderer2);
|
|
10
|
+
ngOnChanges(): void;
|
|
11
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SpreadAttrsDirective, never>;
|
|
12
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SpreadAttrsDirective, "[spreadAttrs]", never, { "attrs": { "alias": "attrs"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
13
|
+
}
|
|
14
|
+
declare class EgFormTextInput {
|
|
15
|
+
label: _angular_core.InputSignal<string | undefined>;
|
|
16
|
+
controlName: _angular_core.InputSignal<string>;
|
|
17
|
+
error: _angular_core.InputSignal<string | undefined>;
|
|
18
|
+
hint: _angular_core.InputSignal<string | undefined>;
|
|
19
|
+
id: _angular_core.InputSignal<string>;
|
|
20
|
+
name: _angular_core.InputSignal<string | undefined>;
|
|
21
|
+
type: _angular_core.InputSignal<string>;
|
|
22
|
+
placeholder: _angular_core.InputSignal<string>;
|
|
23
|
+
readonly: _angular_core.InputSignal<boolean>;
|
|
24
|
+
disabled: _angular_core.InputSignal<boolean>;
|
|
25
|
+
maxlength: _angular_core.InputSignal<string | number | null>;
|
|
26
|
+
minlength: _angular_core.InputSignal<string | number | null>;
|
|
27
|
+
max: _angular_core.InputSignal<string | number | null>;
|
|
28
|
+
min: _angular_core.InputSignal<string | number | null>;
|
|
29
|
+
pattern: _angular_core.InputSignal<string | RegExp>;
|
|
30
|
+
autocomplete: _angular_core.InputSignal<string | undefined>;
|
|
31
|
+
autofocus: _angular_core.InputSignal<boolean>;
|
|
32
|
+
required: _angular_core.InputSignal<boolean>;
|
|
33
|
+
userClass: _angular_core.InputSignal<ClassValue>;
|
|
34
|
+
labelClass: _angular_core.InputSignal<string>;
|
|
35
|
+
inputClass: _angular_core.InputSignal<string>;
|
|
36
|
+
errorClass: _angular_core.InputSignal<string>;
|
|
37
|
+
hintClass: _angular_core.InputSignal<string>;
|
|
38
|
+
$userClass: _angular_core.Signal<string>;
|
|
39
|
+
$labelClass: _angular_core.Signal<string>;
|
|
40
|
+
$inputClass: _angular_core.Signal<string>;
|
|
41
|
+
$errorClass: _angular_core.Signal<string>;
|
|
42
|
+
$hintClass: _angular_core.Signal<string>;
|
|
43
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgFormTextInput, never>;
|
|
44
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgFormTextInput, "eg-form-text-input", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "controlName": { "alias": "controlName"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "minlength": { "alias": "minlength"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "pattern": { "alias": "pattern"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "autofocus": { "alias": "autofocus"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "inputClass": { "alias": "inputClass"; "required": false; "isSignal": true; }; "errorClass": { "alias": "errorClass"; "required": false; "isSignal": true; }; "hintClass": { "alias": "hintClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
export { EgFormTextInput, SpreadAttrsDirective };
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
# FormTextarea
|
|
2
|
+
|
|
3
|
+
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.3.0.
|
|
4
|
+
|
|
5
|
+
## Code scaffolding
|
|
6
|
+
|
|
7
|
+
Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
ng generate component component-name
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
ng generate --help
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Building
|
|
20
|
+
|
|
21
|
+
To build the library, run:
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
ng build form-textarea
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
|
|
28
|
+
|
|
29
|
+
### Publishing the Library
|
|
30
|
+
|
|
31
|
+
Once the project is built, you can publish your library by following these steps:
|
|
32
|
+
|
|
33
|
+
1. Navigate to the `dist` directory:
|
|
34
|
+
|
|
35
|
+
```bash
|
|
36
|
+
cd dist/form-textarea
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
2. Run the `npm publish` command to publish your library to the npm registry:
|
|
40
|
+
```bash
|
|
41
|
+
npm publish
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Running unit tests
|
|
45
|
+
|
|
46
|
+
To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
ng test
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Running end-to-end tests
|
|
53
|
+
|
|
54
|
+
For end-to-end (e2e) testing, run:
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
ng e2e
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
|
|
61
|
+
|
|
62
|
+
## Additional Resources
|
|
63
|
+
|
|
64
|
+
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, computed, Component } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/forms';
|
|
4
|
+
import { ReactiveFormsModule, FormGroupDirective, ControlContainer } from '@angular/forms';
|
|
5
|
+
import { HlmFormField, HlmError, HlmHint } from '@egose/shadcn-theme-ng/form-field';
|
|
6
|
+
import { HlmLabel } from '@egose/shadcn-theme-ng/label';
|
|
7
|
+
import { HlmInput } from '@egose/shadcn-theme-ng/input';
|
|
8
|
+
import { hlm } from '@egose/shadcn-theme-ng/utils';
|
|
9
|
+
|
|
10
|
+
let nextId = 0;
|
|
11
|
+
class EgFormTextarea {
|
|
12
|
+
// General props
|
|
13
|
+
label = input(undefined, ...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
14
|
+
controlName = input('', ...(ngDevMode ? [{ debugName: "controlName" }] : []));
|
|
15
|
+
error = input(undefined, ...(ngDevMode ? [{ debugName: "error" }] : []));
|
|
16
|
+
hint = input(undefined, ...(ngDevMode ? [{ debugName: "hint" }] : []));
|
|
17
|
+
// HTML/textarea attributes
|
|
18
|
+
id = input(crypto.randomUUID(), ...(ngDevMode ? [{ debugName: "id" }] : []));
|
|
19
|
+
// id = input<string>(`eg-form-text-input-${nextId++}`);
|
|
20
|
+
name = input(undefined, ...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
21
|
+
placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
22
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
23
|
+
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
24
|
+
maxlength = input(null, ...(ngDevMode ? [{ debugName: "maxlength" }] : []));
|
|
25
|
+
minlength = input(null, ...(ngDevMode ? [{ debugName: "minlength" }] : []));
|
|
26
|
+
required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
|
|
27
|
+
rows = input(3, ...(ngDevMode ? [{ debugName: "rows" }] : []));
|
|
28
|
+
cols = input(undefined, ...(ngDevMode ? [{ debugName: "cols" }] : []));
|
|
29
|
+
// Styling classes
|
|
30
|
+
userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
|
|
31
|
+
labelClass = input('', ...(ngDevMode ? [{ debugName: "labelClass" }] : []));
|
|
32
|
+
textareaClass = input('', ...(ngDevMode ? [{ debugName: "textareaClass" }] : []));
|
|
33
|
+
errorClass = input('', ...(ngDevMode ? [{ debugName: "errorClass" }] : []));
|
|
34
|
+
hintClass = input('', ...(ngDevMode ? [{ debugName: "hintClass" }] : []));
|
|
35
|
+
// Computed class bindings
|
|
36
|
+
$userClass = computed(() => hlm('tw:flex tw:flex-col', this.userClass()), ...(ngDevMode ? [{ debugName: "$userClass" }] : []));
|
|
37
|
+
$labelClass = computed(() => hlm('tw:mb-1 tw:gap-0', this.labelClass()), ...(ngDevMode ? [{ debugName: "$labelClass" }] : []));
|
|
38
|
+
$textareaClass = computed(() => hlm('tw:mb-1', this.textareaClass()), ...(ngDevMode ? [{ debugName: "$textareaClass" }] : []));
|
|
39
|
+
$errorClass = computed(() => hlm('tw:mt-0', this.errorClass()), ...(ngDevMode ? [{ debugName: "$errorClass" }] : []));
|
|
40
|
+
$hintClass = computed(() => hlm('tw:mt-0', this.hintClass()), ...(ngDevMode ? [{ debugName: "$hintClass" }] : []));
|
|
41
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: EgFormTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: EgFormTextarea, isStandalone: true, selector: "eg-form-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, minlength: { classPropertyName: "minlength", publicName: "minlength", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, cols: { classPropertyName: "cols", publicName: "cols", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, textareaClass: { classPropertyName: "textareaClass", publicName: "textareaClass", isSignal: true, isRequired: false, transformFunction: null }, errorClass: { classPropertyName: "errorClass", publicName: "errorClass", isSignal: true, isRequired: false, transformFunction: null }, hintClass: { classPropertyName: "hintClass", publicName: "hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "tw:w-full" }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: `
|
|
43
|
+
@let lbl = label();
|
|
44
|
+
@let nm = controlName();
|
|
45
|
+
@let err = error();
|
|
46
|
+
@let hnt = hint();
|
|
47
|
+
@let rqrd = required();
|
|
48
|
+
|
|
49
|
+
<hlm-form-field>
|
|
50
|
+
@if (lbl) {
|
|
51
|
+
<span hlmLabel [class]="$labelClass()">{{ lbl }}
|
|
52
|
+
@if (rqrd) {
|
|
53
|
+
<span class="tw:text-red-500">*</span>
|
|
54
|
+
}
|
|
55
|
+
</span>
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
<textarea
|
|
59
|
+
hlmInput
|
|
60
|
+
[attr.aria-label]="lbl"
|
|
61
|
+
[id]="id()"
|
|
62
|
+
[name]="nm || name()"
|
|
63
|
+
[formControlName]="nm"
|
|
64
|
+
[class]="$textareaClass()"
|
|
65
|
+
[placeholder]="placeholder()"
|
|
66
|
+
[readonly]="readonly()"
|
|
67
|
+
[maxlength]="maxlength()"
|
|
68
|
+
[minlength]="minlength()"
|
|
69
|
+
[required]="rqrd"
|
|
70
|
+
[rows]="rows()"
|
|
71
|
+
[cols]="cols()"
|
|
72
|
+
></textarea>
|
|
73
|
+
|
|
74
|
+
@if (err) {
|
|
75
|
+
<hlm-error [class]="$errorClass()">
|
|
76
|
+
{{ err }}
|
|
77
|
+
</hlm-error>
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
@if (hnt) {
|
|
81
|
+
<hlm-hint [class]="$hintClass()">
|
|
82
|
+
{{ hnt }}
|
|
83
|
+
</hlm-hint>
|
|
84
|
+
}
|
|
85
|
+
</hlm-form-field>
|
|
86
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: HlmFormField, selector: "hlm-form-field", inputs: ["class"] }, { kind: "directive", type: HlmError, selector: "hlm-error", inputs: ["class"] }, { kind: "directive", type: HlmHint, selector: "hlm-hint", inputs: ["class"] }, { kind: "directive", type: HlmLabel, selector: "[hlmLabel]", inputs: ["class"] }, { kind: "directive", type: HlmInput, selector: "[hlmInput]", inputs: ["error", "class"] }] });
|
|
87
|
+
}
|
|
88
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: EgFormTextarea, decorators: [{
|
|
89
|
+
type: Component,
|
|
90
|
+
args: [{
|
|
91
|
+
selector: 'eg-form-textarea',
|
|
92
|
+
standalone: true,
|
|
93
|
+
host: {
|
|
94
|
+
class: 'tw:w-full',
|
|
95
|
+
},
|
|
96
|
+
imports: [ReactiveFormsModule, HlmFormField, HlmError, HlmHint, HlmLabel, HlmInput],
|
|
97
|
+
providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }],
|
|
98
|
+
// prettier-ignore
|
|
99
|
+
template: `
|
|
100
|
+
@let lbl = label();
|
|
101
|
+
@let nm = controlName();
|
|
102
|
+
@let err = error();
|
|
103
|
+
@let hnt = hint();
|
|
104
|
+
@let rqrd = required();
|
|
105
|
+
|
|
106
|
+
<hlm-form-field>
|
|
107
|
+
@if (lbl) {
|
|
108
|
+
<span hlmLabel [class]="$labelClass()">{{ lbl }}
|
|
109
|
+
@if (rqrd) {
|
|
110
|
+
<span class="tw:text-red-500">*</span>
|
|
111
|
+
}
|
|
112
|
+
</span>
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
<textarea
|
|
116
|
+
hlmInput
|
|
117
|
+
[attr.aria-label]="lbl"
|
|
118
|
+
[id]="id()"
|
|
119
|
+
[name]="nm || name()"
|
|
120
|
+
[formControlName]="nm"
|
|
121
|
+
[class]="$textareaClass()"
|
|
122
|
+
[placeholder]="placeholder()"
|
|
123
|
+
[readonly]="readonly()"
|
|
124
|
+
[maxlength]="maxlength()"
|
|
125
|
+
[minlength]="minlength()"
|
|
126
|
+
[required]="rqrd"
|
|
127
|
+
[rows]="rows()"
|
|
128
|
+
[cols]="cols()"
|
|
129
|
+
></textarea>
|
|
130
|
+
|
|
131
|
+
@if (err) {
|
|
132
|
+
<hlm-error [class]="$errorClass()">
|
|
133
|
+
{{ err }}
|
|
134
|
+
</hlm-error>
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
@if (hnt) {
|
|
138
|
+
<hlm-hint [class]="$hintClass()">
|
|
139
|
+
{{ hnt }}
|
|
140
|
+
</hlm-hint>
|
|
141
|
+
}
|
|
142
|
+
</hlm-form-field>
|
|
143
|
+
`,
|
|
144
|
+
}]
|
|
145
|
+
}] });
|
|
146
|
+
|
|
147
|
+
/*
|
|
148
|
+
* Public API Surface of form-textarea
|
|
149
|
+
*/
|
|
150
|
+
|
|
151
|
+
/**
|
|
152
|
+
* Generated bundle index. Do not edit.
|
|
153
|
+
*/
|
|
154
|
+
|
|
155
|
+
export { EgFormTextarea };
|
|
156
|
+
//# sourceMappingURL=form-textarea.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"form-textarea.mjs","sources":["../../../projects/form-textarea/src/lib/form-textarea.ts","../../../projects/form-textarea/src/public-api.ts","../../../projects/form-textarea/src/form-textarea.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\nimport { ControlContainer, FormGroupDirective, ReactiveFormsModule } from '@angular/forms';\nimport { HlmFormField, HlmError, HlmHint } from '@egose/shadcn-theme-ng/form-field';\nimport { HlmLabel } from '@egose/shadcn-theme-ng/label';\nimport { HlmInput } from '@egose/shadcn-theme-ng/input';\nimport { hlm } from '@egose/shadcn-theme-ng/utils';\nimport { ClassValue } from 'clsx';\n\nlet nextId = 0;\n\n@Component({\n selector: 'eg-form-textarea',\n standalone: true,\n host: {\n class: 'tw:w-full',\n },\n imports: [ReactiveFormsModule, HlmFormField, HlmError, HlmHint, HlmLabel, HlmInput],\n providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }],\n // prettier-ignore\n template: `\n @let lbl = label();\n @let nm = controlName();\n @let err = error();\n @let hnt = hint();\n @let rqrd = required();\n\n <hlm-form-field>\n @if (lbl) {\n <span hlmLabel [class]=\"$labelClass()\">{{ lbl }}\n @if (rqrd) {\n <span class=\"tw:text-red-500\">*</span>\n }\n </span>\n }\n\n <textarea\n hlmInput\n [attr.aria-label]=\"lbl\"\n [id]=\"id()\"\n [name]=\"nm || name()\"\n [formControlName]=\"nm\"\n [class]=\"$textareaClass()\"\n [placeholder]=\"placeholder()\"\n [readonly]=\"readonly()\"\n [maxlength]=\"maxlength()\"\n [minlength]=\"minlength()\"\n [required]=\"rqrd\"\n [rows]=\"rows()\"\n [cols]=\"cols()\"\n ></textarea>\n\n @if (err) {\n <hlm-error [class]=\"$errorClass()\">\n {{ err }}\n </hlm-error>\n }\n\n @if (hnt) {\n <hlm-hint [class]=\"$hintClass()\">\n {{ hnt }}\n </hlm-hint>\n }\n </hlm-form-field>\n `,\n})\nexport class EgFormTextarea {\n // General props\n label = input<string | undefined>(undefined);\n controlName = input<string>('');\n error = input<string | undefined>(undefined);\n hint = input<string | undefined>(undefined);\n\n // HTML/textarea attributes\n id = input<string>(crypto.randomUUID());\n // id = input<string>(`eg-form-text-input-${nextId++}`);\n\n name = input<string | undefined>(undefined);\n placeholder = input<string>('');\n readonly = input<boolean>(false);\n disabled = input<boolean>(false);\n maxlength = input<string | number | null>(null);\n minlength = input<string | number | null>(null);\n required = input<boolean>(false);\n rows = input<string | number | undefined>(3);\n cols = input<string | number | undefined>(undefined);\n\n // Styling classes\n userClass = input<ClassValue>('', { alias: 'class' });\n labelClass = input<string>('');\n textareaClass = input<string>('');\n errorClass = input<string>('');\n hintClass = input<string>('');\n\n // Computed class bindings\n $userClass = computed(() => hlm('tw:flex tw:flex-col', this.userClass()));\n $labelClass = computed(() => hlm('tw:mb-1 tw:gap-0', this.labelClass()));\n $textareaClass = computed(() => hlm('tw:mb-1', this.textareaClass()));\n $errorClass = computed(() => hlm('tw:mt-0', this.errorClass()));\n $hintClass = computed(() => hlm('tw:mt-0', this.hintClass()));\n}\n","/*\n * Public API Surface of form-textarea\n */\n\nexport * from './lib/form-textarea';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { ClassValue } from 'clsx';
|
|
3
|
+
|
|
4
|
+
declare class EgFormTextarea {
|
|
5
|
+
label: _angular_core.InputSignal<string | undefined>;
|
|
6
|
+
controlName: _angular_core.InputSignal<string>;
|
|
7
|
+
error: _angular_core.InputSignal<string | undefined>;
|
|
8
|
+
hint: _angular_core.InputSignal<string | undefined>;
|
|
9
|
+
id: _angular_core.InputSignal<string>;
|
|
10
|
+
name: _angular_core.InputSignal<string | undefined>;
|
|
11
|
+
placeholder: _angular_core.InputSignal<string>;
|
|
12
|
+
readonly: _angular_core.InputSignal<boolean>;
|
|
13
|
+
disabled: _angular_core.InputSignal<boolean>;
|
|
14
|
+
maxlength: _angular_core.InputSignal<string | number | null>;
|
|
15
|
+
minlength: _angular_core.InputSignal<string | number | null>;
|
|
16
|
+
required: _angular_core.InputSignal<boolean>;
|
|
17
|
+
rows: _angular_core.InputSignal<string | number | undefined>;
|
|
18
|
+
cols: _angular_core.InputSignal<string | number | undefined>;
|
|
19
|
+
userClass: _angular_core.InputSignal<ClassValue>;
|
|
20
|
+
labelClass: _angular_core.InputSignal<string>;
|
|
21
|
+
textareaClass: _angular_core.InputSignal<string>;
|
|
22
|
+
errorClass: _angular_core.InputSignal<string>;
|
|
23
|
+
hintClass: _angular_core.InputSignal<string>;
|
|
24
|
+
$userClass: _angular_core.Signal<string>;
|
|
25
|
+
$labelClass: _angular_core.Signal<string>;
|
|
26
|
+
$textareaClass: _angular_core.Signal<string>;
|
|
27
|
+
$errorClass: _angular_core.Signal<string>;
|
|
28
|
+
$hintClass: _angular_core.Signal<string>;
|
|
29
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgFormTextarea, never>;
|
|
30
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgFormTextarea, "eg-form-textarea", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "controlName": { "alias": "controlName"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "minlength": { "alias": "minlength"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "cols": { "alias": "cols"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "textareaClass": { "alias": "textareaClass"; "required": false; "isSignal": true; }; "errorClass": { "alias": "errorClass"; "required": false; "isSignal": true; }; "hintClass": { "alias": "hintClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export { EgFormTextarea };
|
package/icon/README.md
ADDED
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
# Icon
|
|
2
|
+
|
|
3
|
+
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.2.0.
|
|
4
|
+
|
|
5
|
+
## Code scaffolding
|
|
6
|
+
|
|
7
|
+
Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
ng generate component component-name
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
ng generate --help
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Building
|
|
20
|
+
|
|
21
|
+
To build the library, run:
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
ng build icon
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
|
|
28
|
+
|
|
29
|
+
### Publishing the Library
|
|
30
|
+
|
|
31
|
+
Once the project is built, you can publish your library by following these steps:
|
|
32
|
+
|
|
33
|
+
1. Navigate to the `dist` directory:
|
|
34
|
+
|
|
35
|
+
```bash
|
|
36
|
+
cd dist/icon
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
2. Run the `npm publish` command to publish your library to the npm registry:
|
|
40
|
+
```bash
|
|
41
|
+
npm publish
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Running unit tests
|
|
45
|
+
|
|
46
|
+
To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
ng test
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Running end-to-end tests
|
|
53
|
+
|
|
54
|
+
For end-to-end (e2e) testing, run:
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
ng e2e
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
|
|
61
|
+
|
|
62
|
+
## Additional Resources
|
|
63
|
+
|
|
64
|
+
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { InjectionToken, inject, input, computed, Directive, NgModule } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
const defaultConfig = {
|
|
5
|
+
size: 'base',
|
|
6
|
+
};
|
|
7
|
+
const HlmIconConfigToken = new InjectionToken('HlmIconConfig');
|
|
8
|
+
function provideHlmIconConfig(config) {
|
|
9
|
+
return { provide: HlmIconConfigToken, useValue: { ...defaultConfig, ...config } };
|
|
10
|
+
}
|
|
11
|
+
function injectHlmIconConfig() {
|
|
12
|
+
return inject(HlmIconConfigToken, { optional: true }) ?? defaultConfig;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
class HlmIcon {
|
|
16
|
+
_config = injectHlmIconConfig();
|
|
17
|
+
size = input(this._config.size, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
18
|
+
_computedSize = computed(() => {
|
|
19
|
+
const size = this.size();
|
|
20
|
+
switch (size) {
|
|
21
|
+
case 'xs':
|
|
22
|
+
return '12px';
|
|
23
|
+
case 'sm':
|
|
24
|
+
return '16px';
|
|
25
|
+
case 'base':
|
|
26
|
+
return '24px';
|
|
27
|
+
case 'lg':
|
|
28
|
+
return '32px';
|
|
29
|
+
case 'xl':
|
|
30
|
+
return '48px';
|
|
31
|
+
default: {
|
|
32
|
+
return size;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}, ...(ngDevMode ? [{ debugName: "_computedSize" }] : []));
|
|
36
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
37
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.1", type: HlmIcon, isStandalone: true, selector: "ng-icon[hlm]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.--ng-icon__size": "_computedSize()" } }, ngImport: i0 });
|
|
38
|
+
}
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmIcon, decorators: [{
|
|
40
|
+
type: Directive,
|
|
41
|
+
args: [{
|
|
42
|
+
selector: 'ng-icon[hlm]',
|
|
43
|
+
host: {
|
|
44
|
+
'[style.--ng-icon__size]': '_computedSize()',
|
|
45
|
+
},
|
|
46
|
+
}]
|
|
47
|
+
}] });
|
|
48
|
+
|
|
49
|
+
/*
|
|
50
|
+
* Public API Surface of icon
|
|
51
|
+
*/
|
|
52
|
+
const HlmIconImports = [HlmIcon];
|
|
53
|
+
class HlmIconModule {
|
|
54
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
55
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.1", ngImport: i0, type: HlmIconModule, imports: [HlmIcon], exports: [HlmIcon] });
|
|
56
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmIconModule });
|
|
57
|
+
}
|
|
58
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmIconModule, decorators: [{
|
|
59
|
+
type: NgModule,
|
|
60
|
+
args: [{
|
|
61
|
+
imports: [...HlmIconImports],
|
|
62
|
+
exports: [...HlmIconImports],
|
|
63
|
+
}]
|
|
64
|
+
}] });
|
|
65
|
+
|
|
66
|
+
/**
|
|
67
|
+
* Generated bundle index. Do not edit.
|
|
68
|
+
*/
|
|
69
|
+
|
|
70
|
+
export { HlmIcon, HlmIconImports, HlmIconModule, injectHlmIconConfig, provideHlmIconConfig };
|
|
71
|
+
//# sourceMappingURL=icon.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon.mjs","sources":["../../../projects/icon/src/lib/icon.token.ts","../../../projects/icon/src/lib/icon.ts","../../../projects/icon/src/public-api.ts","../../../projects/icon/src/icon.ts"],"sourcesContent":["import { InjectionToken, ValueProvider, inject } from '@angular/core';\nimport type { IconSize } from './icon';\n\nexport interface HlmIconConfig {\n size: IconSize;\n}\n\nconst defaultConfig: HlmIconConfig = {\n size: 'base',\n};\n\nconst HlmIconConfigToken = new InjectionToken<HlmIconConfig>('HlmIconConfig');\n\nexport function provideHlmIconConfig(config: Partial<HlmIconConfig>): ValueProvider {\n return { provide: HlmIconConfigToken, useValue: { ...defaultConfig, ...config } };\n}\n\nexport function injectHlmIconConfig(): HlmIconConfig {\n return inject(HlmIconConfigToken, { optional: true }) ?? defaultConfig;\n}\n","import { Directive, computed, input } from '@angular/core';\nimport { injectHlmIconConfig } from './icon.token';\n\nexport type IconSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | 'none' | (Record<never, never> & string);\n\n@Directive({\n selector: 'ng-icon[hlm]',\n host: {\n '[style.--ng-icon__size]': '_computedSize()',\n },\n})\nexport class HlmIcon {\n private readonly _config = injectHlmIconConfig();\n public readonly size = input<IconSize>(this._config.size);\n\n protected readonly _computedSize = computed(() => {\n const size = this.size();\n\n switch (size) {\n case 'xs':\n return '12px';\n case 'sm':\n return '16px';\n case 'base':\n return '24px';\n case 'lg':\n return '32px';\n case 'xl':\n return '48px';\n default: {\n return size;\n }\n }\n });\n}\n","/*\n * Public API Surface of icon\n */\n\nimport { NgModule } from '@angular/core';\nimport { HlmIcon } from './lib/icon';\n\nexport * from './lib/icon';\nexport * from './lib/icon.token';\n\nexport const HlmIconImports = [HlmIcon] as const;\n\n@NgModule({\n imports: [...HlmIconImports],\n exports: [...HlmIconImports],\n})\nexport class HlmIconModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;AAOA,MAAM,aAAa,GAAkB;AACnC,IAAA,IAAI,EAAE,MAAM;CACb;AAED,MAAM,kBAAkB,GAAG,IAAI,cAAc,CAAgB,eAAe,CAAC;AAEvE,SAAU,oBAAoB,CAAC,MAA8B,EAAA;AACjE,IAAA,OAAO,EAAE,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAAE,EAAE,GAAG,aAAa,EAAE,GAAG,MAAM,EAAE,EAAE;AACnF;SAEgB,mBAAmB,GAAA;AACjC,IAAA,OAAO,MAAM,CAAC,kBAAkB,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,IAAI,aAAa;AACxE;;MCRa,OAAO,CAAA;IACD,OAAO,GAAG,mBAAmB,EAAE;IAChC,IAAI,GAAG,KAAK,CAAW,IAAI,CAAC,OAAO,CAAC,IAAI,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAEtC,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;QAExB,QAAQ,IAAI;AACV,YAAA,KAAK,IAAI;AACP,gBAAA,OAAO,MAAM;AACf,YAAA,KAAK,IAAI;AACP,gBAAA,OAAO,MAAM;AACf,YAAA,KAAK,MAAM;AACT,gBAAA,OAAO,MAAM;AACf,YAAA,KAAK,IAAI;AACP,gBAAA,OAAO,MAAM;AACf,YAAA,KAAK,IAAI;AACP,gBAAA,OAAO,MAAM;YACf,SAAS;AACP,gBAAA,OAAO,IAAI;YACb;;AAEJ,IAAA,CAAC,yDAAC;uGAtBS,OAAO,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAP,OAAO,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAP,OAAO,EAAA,UAAA,EAAA,CAAA;kBANnB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,cAAc;AACxB,oBAAA,IAAI,EAAE;AACJ,wBAAA,yBAAyB,EAAE,iBAAiB;AAC7C,qBAAA;AACF,iBAAA;;;ACVD;;AAEG;AAQI,MAAM,cAAc,GAAG,CAAC,OAAO;MAMzB,aAAa,CAAA;uGAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;wGAAb,aAAa,EAAA,OAAA,EAAA,CANK,OAAO,CAAA,EAAA,OAAA,EAAA,CAAP,OAAO,CAAA,EAAA,CAAA;wGAMzB,aAAa,EAAA,CAAA;;2FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBAJzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE,CAAC,GAAG,cAAc,CAAC;AAC5B,oBAAA,OAAO,EAAE,CAAC,GAAG,cAAc,CAAC;AAC7B,iBAAA;;;ACfD;;AAEG;;;;"}
|
package/icon/index.d.ts
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ValueProvider } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
type IconSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | 'none' | (Record<never, never> & string);
|
|
5
|
+
declare class HlmIcon {
|
|
6
|
+
private readonly _config;
|
|
7
|
+
readonly size: i0.InputSignal<IconSize>;
|
|
8
|
+
protected readonly _computedSize: i0.Signal<"none" | (Record<never, never> & string) | "12px" | "16px" | "24px" | "32px" | "48px">;
|
|
9
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<HlmIcon, never>;
|
|
10
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<HlmIcon, "ng-icon[hlm]", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
interface HlmIconConfig {
|
|
14
|
+
size: IconSize;
|
|
15
|
+
}
|
|
16
|
+
declare function provideHlmIconConfig(config: Partial<HlmIconConfig>): ValueProvider;
|
|
17
|
+
declare function injectHlmIconConfig(): HlmIconConfig;
|
|
18
|
+
|
|
19
|
+
declare const HlmIconImports: readonly [typeof HlmIcon];
|
|
20
|
+
declare class HlmIconModule {
|
|
21
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<HlmIconModule, never>;
|
|
22
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<HlmIconModule, never, [typeof HlmIcon], [typeof HlmIcon]>;
|
|
23
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<HlmIconModule>;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
export { HlmIcon, HlmIconImports, HlmIconModule, injectHlmIconConfig, provideHlmIconConfig };
|
|
27
|
+
export type { HlmIconConfig, IconSize };
|
package/input/README.md
ADDED
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
# Input
|
|
2
|
+
|
|
3
|
+
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.2.0.
|
|
4
|
+
|
|
5
|
+
## Code scaffolding
|
|
6
|
+
|
|
7
|
+
Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
ng generate component component-name
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
ng generate --help
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Building
|
|
20
|
+
|
|
21
|
+
To build the library, run:
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
ng build input
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
|
|
28
|
+
|
|
29
|
+
### Publishing the Library
|
|
30
|
+
|
|
31
|
+
Once the project is built, you can publish your library by following these steps:
|
|
32
|
+
|
|
33
|
+
1. Navigate to the `dist` directory:
|
|
34
|
+
|
|
35
|
+
```bash
|
|
36
|
+
cd dist/input
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
2. Run the `npm publish` command to publish your library to the npm registry:
|
|
40
|
+
```bash
|
|
41
|
+
npm publish
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Running unit tests
|
|
45
|
+
|
|
46
|
+
To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
ng test
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Running end-to-end tests
|
|
53
|
+
|
|
54
|
+
For end-to-end (e2e) testing, run:
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
ng e2e
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
|
|
61
|
+
|
|
62
|
+
## Additional Resources
|
|
63
|
+
|
|
64
|
+
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|