@onemrvapublic/design-system-demos 21.6.0 → 21.7.0-develop.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/json/avatar.json +1 -1
- package/assets/json/chips.json +1 -1
- package/assets/json/file-panel.json +1 -1
- package/main.js +5 -5
- package/package.json +1 -1
package/assets/json/avatar.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"demo-avatar.component.html":"<onemrva-mat-avatar\n [initials]=\"initials()\"\n [text]=\"text()\"\n [size]=\"size()\"\n [src]=\"src()\"\n [icon]=\"icon()\"\n [color]=\"color()\"\n/>\n","demo-avatar.component.ts":"import { Component, ViewEncapsulation, input } from '@angular/core';\nimport { OnemRvaSizeDirective } from '@onemrvapublic/design-system/shared';\nimport { OnemrvaMatAvatarModule } from '@onemrvapublic/design-system/mat-avatar';\nimport { OnemRvaColorDirective } from '@onemrvapublic/design-system/shared';\nimport { OnemrvaMatColor } from '@onemrvapublic/design-system/utils';\nimport { DemoComponentBase } from '../../_demo/demo-component-base';\n\n@Component({\n selector: 'app-demo-avatar',\n templateUrl: 'demo-avatar.component.html',\n standalone: true,\n imports: [\n OnemrvaMatAvatarModule,\n OnemRvaColorDirective,\n OnemRvaSizeDirective,\n ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class DemoAvatarComponent extends DemoComponentBase {\n readonly initials = input('TC');\n readonly text = input('');\n readonly size = input<'
|
|
1
|
+
{"demo-avatar.component.html":"<onemrva-mat-avatar\n [initials]=\"initials()\"\n [text]=\"text()\"\n [size]=\"size()\"\n [src]=\"src()\"\n [icon]=\"icon()\"\n [color]=\"color()\"\n/>\n","demo-avatar.component.ts":"import { Component, ViewEncapsulation, input } from '@angular/core';\nimport { OnemRvaSizeDirective } from '@onemrvapublic/design-system/shared';\nimport { OnemrvaMatAvatarModule } from '@onemrvapublic/design-system/mat-avatar';\nimport { OnemRvaColorDirective } from '@onemrvapublic/design-system/shared';\nimport { OnemrvaMatColor } from '@onemrvapublic/design-system/utils';\nimport { DemoComponentBase } from '../../_demo/demo-component-base';\n\n@Component({\n selector: 'app-demo-avatar',\n templateUrl: 'demo-avatar.component.html',\n standalone: true,\n imports: [\n OnemrvaMatAvatarModule,\n OnemRvaColorDirective,\n OnemRvaSizeDirective,\n ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class DemoAvatarComponent extends DemoComponentBase {\n readonly initials = input('TC');\n readonly text = input('');\n readonly size = input<'large' | 'medium' | 'small' | 'xsmall'>('medium');\n readonly src = input('');\n readonly icon = input('');\n readonly color = input<OnemrvaMatColor>('accent');\n}\n"}
|
package/assets/json/chips.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"demo-chips.component.html":"<mat-chip-set aria-label=\"Chips\">\n <mat-chip [color]=\"color()\" [disabled]=\"disabled()\"
|
|
1
|
+
{"demo-chips.component.html":"<mat-chip-set aria-label=\"Chips\">\n @for (chip of [1, 2]; track $index) {\n <mat-chip [color]=\"color()\" [disabled]=\"disabled()\">\n chip {{ chip }}\n\n @if (!disabled()) {\n <button matChipRemove [attr.aria-label]=\"`remove item ${chip}`\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-chip>\n }\n</mat-chip-set>\n","demo-chips.component.ts":"import { Component, ViewEncapsulation, input } from '@angular/core';\nimport { MatChipsModule } from '@angular/material/chips';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\n\nimport { FormsModule } from '@angular/forms';\nimport { DemoComponentBase } from '../../_demo/demo-component-base';\nimport { OnemrvaMatColor } from '@onemrvapublic/design-system/utils';\nimport { OnemRvaColorDirective } from '@onemrvapublic/design-system/shared';\nimport { MatIcon } from '@angular/material/icon';\n\nexport interface Fruit {\n name: string;\n}\n@Component({\n selector: 'app-demo-chips',\n standalone: true,\n imports: [\n FormsModule,\n MatChipsModule,\n DragDropModule,\n OnemRvaColorDirective,\n MatIcon,\n ],\n templateUrl: './demo-chips.component.html',\n\n encapsulation: ViewEncapsulation.None,\n})\nexport class DemoChipsComponent extends DemoComponentBase {\n readonly color = input<OnemrvaMatColor>('');\n\n readonly disabled = input(false);\n}\n"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"demo-file-panel.component.html":"<file-panel
|
|
1
|
+
{"demo-file-panel.component.html":"<file-panel\n [file]=\"getFile()\"\n [actions]=\"actions()\"\n (panelClick)=\"onPanelClick()\"\n [disabled]=\"disabled()\"\n [displayDate]=\"'02/06/22 07:51 PM'\"\n/>\n","demo-file-panel.component.ts":"import { Component, ViewEncapsulation, input } from '@angular/core';\n\nimport { MatButtonModule } from '@angular/material/button';\nimport {\n convertToReferencedProgressFile,\n ReferencedProgressFile,\n OnemrvaMatFileUploadModule,\n ActionConfig,\n} from '@onemrvapublic/design-system/mat-file-upload';\nimport { DemoComponentBase } from '../../_demo/demo-component-base';\n\nexport interface Annex {\n /**\n * Document reference in document service\n */\n documentId?: string;\n /**\n * Name of the document\n */\n name?: string;\n}\n\n@Component({\n selector: 'app-demo-file-panel',\n templateUrl: 'demo-file-panel.component.html',\n\n standalone: true,\n imports: [MatButtonModule, OnemrvaMatFileUploadModule],\n encapsulation: ViewEncapsulation.None,\n})\nexport class DemoFilePanelComponent extends DemoComponentBase {\n readonly color = input<'' | 'warn' | 'success' | 'error'>('');\n\n readonly disabled = input<boolean>(false);\n\n testFile: Annex = {\n documentId: '1',\n name: 'archives.doc',\n };\n\n successFile: ReferencedProgressFile = {\n ref: Symbol('1'),\n enableProgressBar: false,\n id: '1',\n message: '',\n progress: 50,\n size: 100,\n type: '',\n url: null,\n name: 'Success',\n file: undefined,\n color: 'success',\n maxSize: 100,\n };\n\n errorFile: ReferencedProgressFile = {\n ref: Symbol('2'),\n enableProgressBar: false,\n id: '2',\n message: 'This is how an error file will look like',\n progress: 50,\n size: 100,\n type: '',\n url: null,\n name: 'Error',\n file: undefined,\n color: 'error',\n maxSize: 100,\n };\n\n warnFile: ReferencedProgressFile = {\n ref: Symbol('3'),\n enableProgressBar: false,\n id: '3',\n message: 'This is how a warn file will look like',\n progress: 50,\n size: 100,\n type: '',\n url: null,\n name: 'Warn',\n file: undefined,\n color: 'warn',\n maxSize: 100,\n };\n\n convertToProgressFile(annex: Annex) {\n return convertToReferencedProgressFile(annex.documentId!, annex.name!);\n }\n\n getFile() {\n switch (this.color()) {\n case 'success':\n return this.successFile;\n case 'error':\n return this.errorFile;\n case 'warn':\n return this.warnFile;\n default:\n return this.convertToProgressFile(this.testFile);\n }\n }\n\n onPanelClick() {\n console.log('panel clicked');\n }\n\n actions(): ActionConfig[] {\n return [\n {\n iconName: 'download', // angular material name\n dataCy: 'download-action',\n tooltipCode: 'file.panel.download',\n ariaCode: 'aria-code',\n clickHandler: (file: ReferencedProgressFile) => {\n console.log('clickhandler', file);\n },\n showAction: (file: ReferencedProgressFile) => {\n console.log('file', file);\n return true;\n },\n },\n {\n iconName: 'delete', // angular material name\n dataCy: 'delete-action',\n tooltipCode: 'file.panel.download',\n ariaCode: 'aria-code',\n clickHandler: (file: ReferencedProgressFile) => {\n console.log('clickhandler', file);\n },\n showAction: (file: ReferencedProgressFile) => {\n console.log('file', file);\n return true;\n },\n },\n ];\n }\n}\n"}
|