@compsych-ui-components/angular 4.0.0 → 4.0.7

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/esm2022/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { NgModule } from '@angular/core';
2
- import { ButtonComponent } from './lib/button.component';
2
+ import { ButtonComponent } from './lib/button/button';
3
3
  import * as i0 from "@angular/core";
4
- export { ButtonComponent } from './lib/button.component';
4
+ export { ButtonComponent } from './lib/button/button';
5
5
  export class CompsychAngularModule {
6
6
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: CompsychAngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
7
7
  static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.14", ngImport: i0, type: CompsychAngularModule, imports: [ButtonComponent], exports: [ButtonComponent] });
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;;AAEzD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAMzD,MAAM,OAAO,qBAAqB;wGAArB,qBAAqB;yGAArB,qBAAqB,YAHtB,eAAe,aACf,eAAe;yGAEd,qBAAqB;;4FAArB,qBAAqB;kBAJjC,QAAQ;mBAAC;oBACR,OAAO,EAAE,CAAC,eAAe,CAAC;oBAC1B,OAAO,EAAE,CAAC,eAAe,CAAC;iBAC3B","sourcesContent":["import { NgModule } from '@angular/core';\nimport { ButtonComponent } from './lib/button.component';\n\nexport { ButtonComponent } from './lib/button.component';\n\n@NgModule({\n imports: [ButtonComponent],\n exports: [ButtonComponent],\n})\nexport class CompsychAngularModule {}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAMtD,MAAM,OAAO,qBAAqB;wGAArB,qBAAqB;yGAArB,qBAAqB,YAHtB,eAAe,aACf,eAAe;yGAEd,qBAAqB;;4FAArB,qBAAqB;kBAJjC,QAAQ;mBAAC;oBACR,OAAO,EAAE,CAAC,eAAe,CAAC;oBAC1B,OAAO,EAAE,CAAC,eAAe,CAAC;iBAC3B","sourcesContent":["import { NgModule } from '@angular/core';\r\nimport { ButtonComponent } from './lib/button/button';\r\n\r\nexport { ButtonComponent } from './lib/button/button';\r\n\r\n@NgModule({\r\n imports: [ButtonComponent],\r\n exports: [ButtonComponent],\r\n})\r\nexport class CompsychAngularModule {}\r\n\r\n"]}
@@ -0,0 +1,72 @@
1
+ import { Component, HostBinding, Input, ElementRef, inject, } from '@angular/core';
2
+ import { NgIf } from '@angular/common';
3
+ import { FocusMonitor } from '@angular/cdk/a11y';
4
+ import { coerceBooleanProperty } from '@angular/cdk/coercion';
5
+ import * as i0 from "@angular/core";
6
+ export class ButtonComponent {
7
+ focusMonitor = inject(FocusMonitor);
8
+ elementRef = inject((ElementRef));
9
+ label = '';
10
+ variant = 'filled';
11
+ size = 'small';
12
+ icon;
13
+ get iconOnly() { return this._iconOnly; }
14
+ set iconOnly(value) { this._iconOnly = coerceBooleanProperty(value); }
15
+ _iconOnly = false;
16
+ get disabled() { return this._disabled; }
17
+ set disabled(value) { this._disabled = coerceBooleanProperty(value); }
18
+ _disabled = false;
19
+ _focused = false;
20
+ _focusOrigin = null;
21
+ get hostClass() {
22
+ return [
23
+ this.variant,
24
+ this.size,
25
+ this._iconOnly ? 'icon-only' : '',
26
+ this._focused && this._focusOrigin === 'keyboard' ? 'focus-keyboard' : '',
27
+ ].filter(Boolean).join(' ');
28
+ }
29
+ get attrDisabled() {
30
+ return this._disabled ? '' : null;
31
+ }
32
+ ngAfterViewInit() {
33
+ this.focusMonitor.monitor(this.elementRef).subscribe(origin => {
34
+ this._focused = !!origin;
35
+ this._focusOrigin = origin;
36
+ });
37
+ }
38
+ ngOnDestroy() {
39
+ this.focusMonitor.stopMonitoring(this.elementRef);
40
+ }
41
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
42
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.14", type: ButtonComponent, isStandalone: true, selector: "compsych-button", inputs: { label: "label", variant: "variant", size: "size", icon: "icon", iconOnly: "iconOnly", disabled: "disabled" }, host: { properties: { "class": "this.hostClass", "attr.disabled": "this.attrDisabled" } }, ngImport: i0, template: `
43
+ <span *ngIf="icon" class="icon material-symbols-rounded" aria-hidden="true">{{ icon }}</span>
44
+ <span class="label">{{ label }}</span>
45
+ `, isInline: true, styles: [":host{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--dimensions-border-radius-sys-radius-full);border:none;cursor:pointer;white-space:nowrap;position:relative;overflow:hidden}:host:before{content:\"\";position:absolute;inset:0;border-radius:inherit;background-color:currentColor;opacity:0;transition:opacity .15s ease;pointer-events:none}:host(:hover):before{opacity:.08}:host(:active):before{opacity:.1}:host(.focus-keyboard):before{opacity:.12}:host(.focus-keyboard){outline:var(--dimensions-border-width-sys-stroke-thick) solid var(--color-roles-add-on-primary-fixed-sys-on-primary-fixed-variant);outline-offset:var(--dimensions-border-width-sys-stroke-thick)}:host:disabled,:host([disabled]){cursor:not-allowed;opacity:.38;pointer-events:none}.icon{font-size:inherit;line-height:1;-webkit-user-select:none;user-select:none}:host(.icon-only){padding:0;aspect-ratio:1}:host(.icon-only.small){width:2rem}:host(.icon-only.medium){width:2.5rem}:host(.icon-only.large){width:3rem}:host(.icon-only.xlarge){width:3.5rem}:host(.small){gap:var(--dimensions-spacing-padding-sys-padding-4);height:2rem;padding:var(--dimensions-spacing-padding-sys-padding-4) var(--dimensions-spacing-padding-sys-padding-12);font-family:var(--type-scale-label-small-sys-font-family);font-size:var(--type-scale-label-small-sys-font-size);font-weight:var(--type-scale-label-small-sys-font-weight-emphasized);line-height:var(--type-scale-label-small-sys-line-height);letter-spacing:var(--type-scale-label-small-sys-tracking)}:host(.medium){gap:var(--dimensions-spacing-padding-sys-padding-8);height:2.5rem;padding:var(--dimensions-spacing-padding-sys-padding-8) var(--dimensions-spacing-padding-sys-padding-16);font-family:var(--type-scale-label-medium-sys-font-family);font-size:var(--type-scale-label-medium-sys-font-size);font-weight:var(--type-scale-label-medium-sys-font-weight-emphasized);line-height:var(--type-scale-label-medium-sys-line-height);letter-spacing:var(--type-scale-label-medium-sys-tracking)}:host(.large){gap:var(--dimensions-spacing-padding-sys-padding-8);height:3rem;padding:var(--dimensions-spacing-padding-sys-padding-8) var(--dimensions-spacing-padding-sys-padding-24);font-family:var(--type-scale-label-large-sys-font-family);font-size:var(--type-scale-label-large-sys-font-size);font-weight:var(--type-scale-label-large-sys-font-weight-emphasized);line-height:var(--type-scale-label-large-sys-line-height);letter-spacing:var(--type-scale-label-large-sys-tracking)}:host(.xlarge){gap:var(--dimensions-spacing-padding-sys-padding-12);height:3.5rem;padding:var(--dimensions-spacing-padding-sys-padding-8) var(--dimensions-spacing-padding-sys-padding-24);font-family:var(--type-scale-label-large-sys-font-family);font-size:var(--type-scale-label-large-sys-font-size);font-weight:var(--type-scale-label-large-sys-font-weight-emphasized);line-height:var(--type-scale-label-large-sys-line-height);letter-spacing:var(--type-scale-label-large-sys-tracking)}:host(.filled){background-color:var(--color-roles-accent-primary-sys-primary);color:var(--color-roles-accent-primary-sys-on-primary)}:host(.tonal){background-color:var(--color-roles-add-on-primary-fixed-sys-primary-fixed-dim);color:var(--color-roles-add-on-primary-fixed-sys-on-primary-fixed)}:host(.outlined){background-color:transparent;color:var(--color-roles-surface-surface-sys-on-surface);border:var(--dimensions-border-width-sys-stroke-thin) solid var(--color-roles-outline-sys-outline)}:host(.elevated){background-color:var(--color-roles-surface-surface-container-sys-surface-container-lowest);color:var(--color-roles-surface-surface-sys-on-surface);box-shadow:0 .125rem .25rem #00000014,0 .25rem 1rem var(--color-roles-transparent-neutral-sys-black-10)}:host(.text){background-color:transparent;color:var(--color-roles-surface-surface-sys-on-surface);padding-inline:0}:host(.danger){background-color:var(--color-roles-error-sys-error);color:var(--color-roles-error-sys-on-error)}:host(.danger-outlined){background-color:transparent;color:var(--color-roles-error-sys-error);border:var(--dimensions-border-width-sys-stroke-thin) solid var(--color-roles-error-sys-error-container)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
46
+ }
47
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ButtonComponent, decorators: [{
48
+ type: Component,
49
+ args: [{ selector: 'compsych-button', standalone: true, imports: [NgIf], template: `
50
+ <span *ngIf="icon" class="icon material-symbols-rounded" aria-hidden="true">{{ icon }}</span>
51
+ <span class="label">{{ label }}</span>
52
+ `, styles: [":host{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--dimensions-border-radius-sys-radius-full);border:none;cursor:pointer;white-space:nowrap;position:relative;overflow:hidden}:host:before{content:\"\";position:absolute;inset:0;border-radius:inherit;background-color:currentColor;opacity:0;transition:opacity .15s ease;pointer-events:none}:host(:hover):before{opacity:.08}:host(:active):before{opacity:.1}:host(.focus-keyboard):before{opacity:.12}:host(.focus-keyboard){outline:var(--dimensions-border-width-sys-stroke-thick) solid var(--color-roles-add-on-primary-fixed-sys-on-primary-fixed-variant);outline-offset:var(--dimensions-border-width-sys-stroke-thick)}:host:disabled,:host([disabled]){cursor:not-allowed;opacity:.38;pointer-events:none}.icon{font-size:inherit;line-height:1;-webkit-user-select:none;user-select:none}:host(.icon-only){padding:0;aspect-ratio:1}:host(.icon-only.small){width:2rem}:host(.icon-only.medium){width:2.5rem}:host(.icon-only.large){width:3rem}:host(.icon-only.xlarge){width:3.5rem}:host(.small){gap:var(--dimensions-spacing-padding-sys-padding-4);height:2rem;padding:var(--dimensions-spacing-padding-sys-padding-4) var(--dimensions-spacing-padding-sys-padding-12);font-family:var(--type-scale-label-small-sys-font-family);font-size:var(--type-scale-label-small-sys-font-size);font-weight:var(--type-scale-label-small-sys-font-weight-emphasized);line-height:var(--type-scale-label-small-sys-line-height);letter-spacing:var(--type-scale-label-small-sys-tracking)}:host(.medium){gap:var(--dimensions-spacing-padding-sys-padding-8);height:2.5rem;padding:var(--dimensions-spacing-padding-sys-padding-8) var(--dimensions-spacing-padding-sys-padding-16);font-family:var(--type-scale-label-medium-sys-font-family);font-size:var(--type-scale-label-medium-sys-font-size);font-weight:var(--type-scale-label-medium-sys-font-weight-emphasized);line-height:var(--type-scale-label-medium-sys-line-height);letter-spacing:var(--type-scale-label-medium-sys-tracking)}:host(.large){gap:var(--dimensions-spacing-padding-sys-padding-8);height:3rem;padding:var(--dimensions-spacing-padding-sys-padding-8) var(--dimensions-spacing-padding-sys-padding-24);font-family:var(--type-scale-label-large-sys-font-family);font-size:var(--type-scale-label-large-sys-font-size);font-weight:var(--type-scale-label-large-sys-font-weight-emphasized);line-height:var(--type-scale-label-large-sys-line-height);letter-spacing:var(--type-scale-label-large-sys-tracking)}:host(.xlarge){gap:var(--dimensions-spacing-padding-sys-padding-12);height:3.5rem;padding:var(--dimensions-spacing-padding-sys-padding-8) var(--dimensions-spacing-padding-sys-padding-24);font-family:var(--type-scale-label-large-sys-font-family);font-size:var(--type-scale-label-large-sys-font-size);font-weight:var(--type-scale-label-large-sys-font-weight-emphasized);line-height:var(--type-scale-label-large-sys-line-height);letter-spacing:var(--type-scale-label-large-sys-tracking)}:host(.filled){background-color:var(--color-roles-accent-primary-sys-primary);color:var(--color-roles-accent-primary-sys-on-primary)}:host(.tonal){background-color:var(--color-roles-add-on-primary-fixed-sys-primary-fixed-dim);color:var(--color-roles-add-on-primary-fixed-sys-on-primary-fixed)}:host(.outlined){background-color:transparent;color:var(--color-roles-surface-surface-sys-on-surface);border:var(--dimensions-border-width-sys-stroke-thin) solid var(--color-roles-outline-sys-outline)}:host(.elevated){background-color:var(--color-roles-surface-surface-container-sys-surface-container-lowest);color:var(--color-roles-surface-surface-sys-on-surface);box-shadow:0 .125rem .25rem #00000014,0 .25rem 1rem var(--color-roles-transparent-neutral-sys-black-10)}:host(.text){background-color:transparent;color:var(--color-roles-surface-surface-sys-on-surface);padding-inline:0}:host(.danger){background-color:var(--color-roles-error-sys-error);color:var(--color-roles-error-sys-on-error)}:host(.danger-outlined){background-color:transparent;color:var(--color-roles-error-sys-error);border:var(--dimensions-border-width-sys-stroke-thin) solid var(--color-roles-error-sys-error-container)}\n"] }]
53
+ }], propDecorators: { label: [{
54
+ type: Input
55
+ }], variant: [{
56
+ type: Input
57
+ }], size: [{
58
+ type: Input
59
+ }], icon: [{
60
+ type: Input
61
+ }], iconOnly: [{
62
+ type: Input
63
+ }], disabled: [{
64
+ type: Input
65
+ }], hostClass: [{
66
+ type: HostBinding,
67
+ args: ['class']
68
+ }], attrDisabled: [{
69
+ type: HostBinding,
70
+ args: ['attr.disabled']
71
+ }] } });
72
+ //# sourceMappingURL=button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../../../packages/angular/src/lib/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,WAAW,EACX,KAAK,EACL,UAAU,EAGV,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,YAAY,EAAe,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAgB,MAAM,uBAAuB,CAAC;;AAY5E,MAAM,OAAO,eAAe;IACT,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;IACpC,UAAU,GAAG,MAAM,CAAC,CAAA,UAAuB,CAAA,CAAC,CAAC;IAErD,KAAK,GAAG,EAAE,CAAC;IACX,OAAO,GAAyF,QAAQ,CAAC;IACzG,IAAI,GAA4C,OAAO,CAAC;IACxD,IAAI,CAAU;IAEvB,IACI,QAAQ,KAAc,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;IAClD,IAAI,QAAQ,CAAC,KAAmB,IAAI,IAAI,CAAC,SAAS,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAC5E,SAAS,GAAG,KAAK,CAAC;IAE1B,IACI,QAAQ,KAAc,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;IAClD,IAAI,QAAQ,CAAC,KAAmB,IAAI,IAAI,CAAC,SAAS,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAC5E,SAAS,GAAG,KAAK,CAAC;IAEhB,QAAQ,GAAG,KAAK,CAAC;IACjB,YAAY,GAAgB,IAAI,CAAC;IAE3C,IAA0B,SAAS;QACjC,OAAO;YACL,IAAI,CAAC,OAAO;YACZ,IAAI,CAAC,IAAI;YACT,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE;YACjC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,KAAK,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE;SAC1E,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAED,IAAkC,YAAY;QAC5C,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IACpC,CAAC;IAED,eAAe;QACb,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE;YAC5D,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC;YACzB,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC;QAC7B,CAAC,CAAC,CAAC;IACL,CAAC;IAED,WAAW;QACT,IAAI,CAAC,YAAY,CAAC,cAAc,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACpD,CAAC;wGA5CU,eAAe;4FAAf,eAAe,8RANhB;;;GAGT,spIAJS,IAAI;;4FAOH,eAAe;kBAV3B,SAAS;+BACE,iBAAiB,cACf,IAAI,WACP,CAAC,IAAI,CAAC,YACL;;;GAGT;;sBAOA,KAAK;;sBACL,KAAK;;sBACL,KAAK;;sBACL,KAAK;;sBAEL,KAAK;;sBAKL,KAAK;;sBAQL,WAAW;uBAAC,OAAO;;sBASnB,WAAW;uBAAC,eAAe","sourcesContent":["import {\r\n Component,\r\n HostBinding,\r\n Input,\r\n ElementRef,\r\n AfterViewInit,\r\n OnDestroy,\r\n inject,\r\n} from '@angular/core';\r\nimport { NgIf } from '@angular/common';\r\nimport { FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';\r\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\r\n\r\n@Component({\r\n selector: 'compsych-button',\r\n standalone: true,\r\n imports: [NgIf],\r\n template: `\r\n <span *ngIf=\"icon\" class=\"icon material-symbols-rounded\" aria-hidden=\"true\">{{ icon }}</span>\r\n <span class=\"label\">{{ label }}</span>\r\n `,\r\n styleUrl: './button.css',\r\n})\r\nexport class ButtonComponent implements AfterViewInit, OnDestroy {\r\n private readonly focusMonitor = inject(FocusMonitor);\r\n private readonly elementRef = inject(ElementRef<HTMLElement>);\r\n\r\n @Input() label = '';\r\n @Input() variant: 'filled' | 'tonal' | 'outlined' | 'elevated' | 'text' | 'danger' | 'danger-outlined' = 'filled';\r\n @Input() size: 'small' | 'medium' | 'large' | 'xlarge' = 'small';\r\n @Input() icon?: string;\r\n\r\n @Input()\r\n get iconOnly(): boolean { return this._iconOnly; }\r\n set iconOnly(value: BooleanInput) { this._iconOnly = coerceBooleanProperty(value); }\r\n private _iconOnly = false;\r\n\r\n @Input()\r\n get disabled(): boolean { return this._disabled; }\r\n set disabled(value: BooleanInput) { this._disabled = coerceBooleanProperty(value); }\r\n private _disabled = false;\r\n\r\n protected _focused = false;\r\n protected _focusOrigin: FocusOrigin = null;\r\n\r\n @HostBinding('class') get hostClass(): string {\r\n return [\r\n this.variant,\r\n this.size,\r\n this._iconOnly ? 'icon-only' : '',\r\n this._focused && this._focusOrigin === 'keyboard' ? 'focus-keyboard' : '',\r\n ].filter(Boolean).join(' ');\r\n }\r\n\r\n @HostBinding('attr.disabled') get attrDisabled(): '' | null {\r\n return this._disabled ? '' : null;\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n this.focusMonitor.monitor(this.elementRef).subscribe(origin => {\r\n this._focused = !!origin;\r\n this._focusOrigin = origin;\r\n });\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this.focusMonitor.stopMonitoring(this.elementRef);\r\n }\r\n}\r\n"]}
package/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as i0 from "@angular/core";
2
- import * as i1 from "./lib/button.component";
3
- export { ButtonComponent } from './lib/button.component';
2
+ import * as i1 from "./lib/button/button";
3
+ export { ButtonComponent } from './lib/button/button';
4
4
  export declare class CompsychAngularModule {
5
5
  static ɵfac: i0.ɵɵFactoryDeclaration<CompsychAngularModule, never>;
6
6
  static ɵmod: i0.ɵɵNgModuleDeclaration<CompsychAngularModule, never, [typeof i1.ButtonComponent], [typeof i1.ButtonComponent]>;
@@ -0,0 +1,26 @@
1
+ import { AfterViewInit, OnDestroy } from '@angular/core';
2
+ import { FocusOrigin } from '@angular/cdk/a11y';
3
+ import { BooleanInput } from '@angular/cdk/coercion';
4
+ import * as i0 from "@angular/core";
5
+ export declare class ButtonComponent implements AfterViewInit, OnDestroy {
6
+ private readonly focusMonitor;
7
+ private readonly elementRef;
8
+ label: string;
9
+ variant: 'filled' | 'tonal' | 'outlined' | 'elevated' | 'text' | 'danger' | 'danger-outlined';
10
+ size: 'small' | 'medium' | 'large' | 'xlarge';
11
+ icon?: string;
12
+ get iconOnly(): boolean;
13
+ set iconOnly(value: BooleanInput);
14
+ private _iconOnly;
15
+ get disabled(): boolean;
16
+ set disabled(value: BooleanInput);
17
+ private _disabled;
18
+ protected _focused: boolean;
19
+ protected _focusOrigin: FocusOrigin;
20
+ get hostClass(): string;
21
+ get attrDisabled(): '' | null;
22
+ ngAfterViewInit(): void;
23
+ ngOnDestroy(): void;
24
+ static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
25
+ static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "compsych-button", never, { "label": { "alias": "label"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "iconOnly": { "alias": "iconOnly"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
26
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@compsych-ui-components/angular",
3
- "version": "4.0.0",
3
+ "version": "4.0.7",
4
4
  "description": "Angular UI components for compsych",
5
5
  "publishConfig": {
6
6
  "access": "public",
@@ -1,29 +0,0 @@
1
- import { Component, Input } from '@angular/core';
2
- import { showAlert } from '@compsych-ui-components/shared';
3
- import * as i0 from "@angular/core";
4
- export class ButtonComponent {
5
- label = 'Click me';
6
- alertMessage = 'Hello from @compsych-ui-components/angular!';
7
- handleClick() {
8
- showAlert(this.alertMessage);
9
- }
10
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
11
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.14", type: ButtonComponent, isStandalone: true, selector: "compsych-button", inputs: { label: "label", alertMessage: "alertMessage" }, ngImport: i0, template: `
12
- <button class="compsych-button" (click)="handleClick()">
13
- {{ label }}
14
- </button>
15
- `, isInline: true, styles: [".compsych-button{padding:8px 16px;background-color:#1976d2;color:#fff;border:none;border-radius:4px;font-size:14px;cursor:pointer}.compsych-button:hover{background-color:#1565c0}\n"] });
16
- }
17
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ButtonComponent, decorators: [{
18
- type: Component,
19
- args: [{ selector: 'compsych-button', standalone: true, template: `
20
- <button class="compsych-button" (click)="handleClick()">
21
- {{ label }}
22
- </button>
23
- `, styles: [".compsych-button{padding:8px 16px;background-color:#1976d2;color:#fff;border:none;border-radius:4px;font-size:14px;cursor:pointer}.compsych-button:hover{background-color:#1565c0}\n"] }]
24
- }], propDecorators: { label: [{
25
- type: Input
26
- }], alertMessage: [{
27
- type: Input
28
- }] } });
29
- //# sourceMappingURL=button.component.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"button.component.js","sourceRoot":"","sources":["../../../../../packages/angular/src/lib/button.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;;AAyB3D,MAAM,OAAO,eAAe;IACjB,KAAK,GAAG,UAAU,CAAC;IACnB,YAAY,GAAG,6CAA6C,CAAC;IAEtE,WAAW;QACT,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC/B,CAAC;wGANU,eAAe;4FAAf,eAAe,qIApBhB;;;;GAIT;;4FAgBU,eAAe;kBAvB3B,SAAS;+BACE,iBAAiB,cACf,IAAI,YACN;;;;GAIT;;sBAiBA,KAAK;;sBACL,KAAK","sourcesContent":["import { Component, Input } from '@angular/core';\nimport { showAlert } from '@compsych-ui-components/shared';\n\n@Component({\n selector: 'compsych-button',\n standalone: true,\n template: `\n <button class=\"compsych-button\" (click)=\"handleClick()\">\n {{ label }}\n </button>\n `,\n styles: [`\n .compsych-button {\n padding: 8px 16px;\n background-color: #1976d2;\n color: white;\n border: none;\n border-radius: 4px;\n font-size: 14px;\n cursor: pointer;\n }\n .compsych-button:hover {\n background-color: #1565c0;\n }\n `],\n})\nexport class ButtonComponent {\n @Input() label = 'Click me';\n @Input() alertMessage = 'Hello from @compsych-ui-components/angular!';\n\n handleClick(): void {\n showAlert(this.alertMessage);\n }\n}\n"]}
@@ -1,8 +0,0 @@
1
- import * as i0 from "@angular/core";
2
- export declare class ButtonComponent {
3
- label: string;
4
- alertMessage: string;
5
- handleClick(): void;
6
- static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
7
- static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "compsych-button", never, { "label": { "alias": "label"; "required": false; }; "alertMessage": { "alias": "alertMessage"; "required": false; }; }, {}, never, never, true, never>;
8
- }