@abp/ng.theme.shared 7.1.0-rc.1 → 7.1.0-rc.2

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.
Files changed (65) hide show
  1. package/esm2020/extensions/lib/adapters/date-time.adapter.mjs +3 -3
  2. package/esm2020/extensions/lib/components/abstract-actions/abstract-actions.component.mjs +1 -1
  3. package/esm2020/extensions/lib/components/extensible-form/extensible-form-prop.component.mjs +3 -3
  4. package/esm2020/extensions/lib/components/extensible-form/extensible-form.component.mjs +1 -1
  5. package/esm2020/extensions/lib/components/extensible-table/extensible-table.component.mjs +4 -4
  6. package/esm2020/extensions/lib/components/grid-actions/grid-actions.component.mjs +1 -1
  7. package/esm2020/extensions/lib/components/page-toolbar/page-toolbar.component.mjs +8 -3
  8. package/esm2020/extensions/lib/models/actions.mjs +2 -2
  9. package/esm2020/extensions/lib/models/entity-actions.mjs +2 -2
  10. package/esm2020/extensions/lib/models/entity-props.mjs +13 -6
  11. package/esm2020/extensions/lib/models/form-props.mjs +3 -3
  12. package/esm2020/extensions/lib/models/internal/object-extensions.mjs +1 -1
  13. package/esm2020/extensions/lib/models/props.mjs +1 -1
  14. package/esm2020/extensions/lib/models/toolbar-actions.mjs +1 -1
  15. package/esm2020/extensions/lib/pipes/create-injector.pipe.mjs +2 -2
  16. package/esm2020/extensions/lib/utils/actions.util.mjs +1 -1
  17. package/esm2020/extensions/lib/utils/enum.util.mjs +1 -1
  18. package/esm2020/extensions/lib/utils/form-props.util.mjs +2 -2
  19. package/esm2020/extensions/lib/utils/props.util.mjs +1 -1
  20. package/esm2020/extensions/lib/utils/state.util.mjs +11 -11
  21. package/esm2020/lib/components/breadcrumb/breadcrumb.component.mjs +2 -2
  22. package/esm2020/lib/components/confirmation/confirmation.component.mjs +5 -2
  23. package/esm2020/lib/components/password/password.component.mjs +1 -1
  24. package/esm2020/lib/directives/index.mjs +2 -1
  25. package/esm2020/lib/directives/visible.directive.mjs +63 -0
  26. package/esm2020/lib/models/nav-item.mjs +1 -2
  27. package/esm2020/lib/services/abstract-menu.service.mjs +1 -1
  28. package/esm2020/lib/services/confirmation.service.mjs +1 -1
  29. package/esm2020/lib/theme-shared.module.mjs +7 -3
  30. package/esm2020/lib/tokens/confirmation-icons.token.mjs +2 -1
  31. package/extensions/lib/adapters/date-time.adapter.d.ts +3 -3
  32. package/extensions/lib/components/abstract-actions/abstract-actions.component.d.ts +2 -2
  33. package/extensions/lib/components/extensible-form/extensible-form-prop.component.d.ts +1 -1
  34. package/extensions/lib/components/extensible-table/extensible-table.component.d.ts +1 -1
  35. package/extensions/lib/components/grid-actions/grid-actions.component.d.ts +1 -1
  36. package/extensions/lib/components/page-toolbar/page-toolbar.component.d.ts +5 -2
  37. package/extensions/lib/models/actions.d.ts +6 -5
  38. package/extensions/lib/models/entity-props.d.ts +3 -3
  39. package/extensions/lib/models/form-props.d.ts +2 -2
  40. package/extensions/lib/models/internal/object-extensions.d.ts +1 -1
  41. package/extensions/lib/models/props.d.ts +4 -3
  42. package/extensions/lib/models/toolbar-actions.d.ts +2 -2
  43. package/extensions/lib/tokens/extensions.token.d.ts +1 -1
  44. package/extensions/lib/utils/actions.util.d.ts +1 -1
  45. package/extensions/lib/utils/enum.util.d.ts +2 -2
  46. package/extensions/lib/utils/form-props.util.d.ts +2 -2
  47. package/extensions/lib/utils/props.util.d.ts +3 -2
  48. package/extensions/lib/utils/state.util.d.ts +3 -3
  49. package/fesm2015/abp-ng.theme.shared-extensions.mjs +33 -21
  50. package/fesm2015/abp-ng.theme.shared-extensions.mjs.map +1 -1
  51. package/fesm2015/abp-ng.theme.shared.mjs +73 -6
  52. package/fesm2015/abp-ng.theme.shared.mjs.map +1 -1
  53. package/fesm2020/abp-ng.theme.shared-extensions.mjs +33 -21
  54. package/fesm2020/abp-ng.theme.shared-extensions.mjs.map +1 -1
  55. package/fesm2020/abp-ng.theme.shared.mjs +72 -6
  56. package/fesm2020/abp-ng.theme.shared.mjs.map +1 -1
  57. package/lib/components/confirmation/confirmation.component.d.ts +1 -1
  58. package/lib/components/password/password.component.d.ts +1 -1
  59. package/lib/directives/index.d.ts +1 -0
  60. package/lib/directives/visible.directive.d.ts +18 -0
  61. package/lib/models/nav-item.d.ts +4 -2
  62. package/lib/services/abstract-menu.service.d.ts +2 -1
  63. package/lib/theme-shared.module.d.ts +8 -7
  64. package/lib/tokens/confirmation-icons.token.d.ts +1 -0
  65. package/package.json +3 -3
@@ -38,10 +38,10 @@ class DateTimeAdapter {
38
38
  if (!value)
39
39
  return '';
40
40
  const now = new Date();
41
- value = Object.assign(Object.assign({
41
+ const newValue = Object.assign(Object.assign({
42
42
  // TODO look for strict mode errors
43
43
  year: now.getUTCFullYear(), month: now.getMonth() + 1, day: now.getDate(), hour: 0, minute: 0, second: 0 }, this.value), value);
44
- const date = new Date(value.year, value.month - 1, value.day, value.hour, value.minute, value.second);
44
+ const date = new Date(newValue.year, newValue.month - 1, value.day, value.hour, value.minute, value.second);
45
45
  return new Date(date).toISOString();
46
46
  }
47
47
  }
@@ -325,7 +325,7 @@ class ExtensibleFormPropComponent {
325
325
  this.passwordKey = "ThemeShared.Extensions.PasswordComponent" /* eThemeSharedComponents.PasswordComponent */;
326
326
  this.disabledFn = (data) => false;
327
327
  this.search = (text$) => text$
328
- ? text$.pipe(debounceTime(300), distinctUntilChanged(), switchMap(text => this.prop.options(this.data, text)))
328
+ ? text$.pipe(debounceTime(300), distinctUntilChanged(), switchMap(text => { var _a, _b; return ((_b = (_a = this.prop) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.call(_a, this.data, text)) || of([]); }))
329
329
  : of([]);
330
330
  this.typeaheadFormatter = (option) => option.key;
331
331
  this.form = groupDirective.form;
@@ -347,7 +347,7 @@ class ExtensibleFormPropComponent {
347
347
  }
348
348
  get isInvalid() {
349
349
  const control = this.form.get(this.prop.name);
350
- return control.touched && control.invalid;
350
+ return (control === null || control === void 0 ? void 0 : control.touched) && control.invalid;
351
351
  }
352
352
  getTypeaheadControls() {
353
353
  const { name } = this.prop;
@@ -583,7 +583,7 @@ class EditFormPropsFactory extends PropsFactory {
583
583
  }
584
584
  class FormProp extends Prop {
585
585
  constructor(options) {
586
- super(options.type, options.name, options.displayName, options.permission, options.visible, options.isExtra, options.template, options.className);
586
+ super(options.type, options.name, options.displayName || '', options.permission || '', options.visible, options.isExtra, options.template, options.className);
587
587
  this.group = options.group;
588
588
  this.className = options.className;
589
589
  this.asyncValidators = options.asyncValidators || (_ => []);
@@ -594,7 +594,7 @@ class FormProp extends Prop {
594
594
  this.options = options.options;
595
595
  this.id = options.id || options.name;
596
596
  const defaultValue = options.defaultValue;
597
- this.defaultValue = isFalsyValue(defaultValue) ? defaultValue : defaultValue || null;
597
+ this.defaultValue = isFalsyValue(defaultValue) ? defaultValue : defaultValue || '';
598
598
  this.displayTextResolver = options.displayTextResolver;
599
599
  }
600
600
  static create(options) {
@@ -627,7 +627,7 @@ class ActionData {
627
627
  }
628
628
  }
629
629
  class Action {
630
- constructor(permission, visible = _ => true, action = _ => { }) {
630
+ constructor(permission, visible = () => true, action = () => { }) {
631
631
  this.permission = permission;
632
632
  this.visible = visible;
633
633
  this.action = action;
@@ -676,7 +676,7 @@ class EntityActionsFactory extends ActionsFactory {
676
676
  }
677
677
  class EntityAction extends Action {
678
678
  constructor(options) {
679
- super(options.permission, options.visible, options.action);
679
+ super(options.permission || '', options.visible, options.action);
680
680
  this.text = options.text;
681
681
  this.icon = options.icon || '';
682
682
  }
@@ -704,14 +704,21 @@ class EntityPropsFactory extends PropsFactory {
704
704
  }
705
705
  class EntityProp extends Prop {
706
706
  constructor(options) {
707
- super(options.type, options.name, options.displayName, options.permission, options.visible, options.isExtra);
707
+ super(options.type, options.name, options.displayName || '', options.permission || '', options.visible, options.isExtra);
708
708
  this.columnWidth = options.columnWidth;
709
709
  this.sortable = options.sortable || false;
710
710
  this.valueResolver =
711
- options.valueResolver || (data => of(escapeHtmlChars(data.record[this.name])));
712
- this.action = options.action;
713
- this.component = options.component;
714
- this.enumList = options.enumList;
711
+ options.valueResolver ||
712
+ (data => of(escapeHtmlChars(data.record[this.name])));
713
+ if (options.action) {
714
+ this.action = options.action;
715
+ }
716
+ if (options.component) {
717
+ this.component = options.component;
718
+ }
719
+ if (options.enumList) {
720
+ this.enumList = options.enumList;
721
+ }
715
722
  }
716
723
  static create(options) {
717
724
  return new EntityProp(options);
@@ -967,7 +974,7 @@ class ExtensibleTableComponent {
967
974
  this.columnWidths = widths;
968
975
  }
969
976
  getDate(value, format) {
970
- return value ? formatDate(value, format, this.locale) : '';
977
+ return value && format ? formatDate(value, format, this.locale) : '';
971
978
  }
972
979
  getIcon(value) {
973
980
  return value
@@ -977,7 +984,7 @@ class ExtensibleTableComponent {
977
984
  getEnum(rowValue, list) {
978
985
  if (!list)
979
986
  return rowValue;
980
- const { key } = list.find(({ value }) => value === rowValue);
987
+ const { key } = list.find(({ value }) => value === rowValue) || {};
981
988
  return key;
982
989
  }
983
990
  getContent(prop, data) {
@@ -992,7 +999,7 @@ class ExtensibleTableComponent {
992
999
  case "datetime" /* ePropType.DateTime */:
993
1000
  return this.getDate(value, getShortDateShortTimeFormat(this.config));
994
1001
  case "enum" /* ePropType.Enum */:
995
- return this.getEnum(value, prop.enumList);
1002
+ return this.getEnum(value, prop.enumList || []);
996
1003
  default:
997
1004
  return value;
998
1005
  // More types can be handled in the future
@@ -1059,7 +1066,7 @@ class CreateInjectorPipe {
1059
1066
  transform(_, action, context) {
1060
1067
  const get = (token, notFoundValue, options) => {
1061
1068
  const componentData = context.getData();
1062
- const componentDataCallback = data => {
1069
+ const componentDataCallback = (data) => {
1063
1070
  data = data !== null && data !== void 0 ? data : context.getData();
1064
1071
  return action.action(data);
1065
1072
  };
@@ -1096,6 +1103,11 @@ class PageToolbarComponent extends AbstractActionsComponent {
1096
1103
  this.getData = () => this.data;
1097
1104
  this.trackByFn = (_, item) => item.action || item.component;
1098
1105
  }
1106
+ asToolbarAction(value) {
1107
+ return {
1108
+ value: value,
1109
+ };
1110
+ }
1099
1111
  }
1100
1112
  PageToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageToolbarComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1101
1113
  PageToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PageToolbarComponent, selector: "abp-page-toolbar", providers: [
@@ -1103,7 +1115,7 @@ PageToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
1103
1115
  provide: EXTENSIONS_ACTION_TYPE,
1104
1116
  useValue: 'toolbarActions',
1105
1117
  },
1106
- ], exportAs: ["abpPageToolbar"], usesInheritance: true, ngImport: i0, template: "<div class=\"row justify-content-end mx-0 gap-2\" id=\"AbpContentToolbar\">\r\n <div\r\n class=\"col-auto px-0 pt-0 pt-md-2\"\r\n [class.pe-0]=\"last\"\r\n *ngFor=\"let action of actionList; trackBy: trackByFn; let last = last\"\r\n >\r\n <ng-container *ngIf=\"action.visible(data)\">\r\n <ng-container *abpPermission=\"action.permission;runChangeDetection: false\">\r\n <ng-container *ngIf=\"action.component as component; else button\">\r\n <ng-container\r\n *ngComponentOutlet=\"component; injector: record | createInjector: action:this\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #button>\r\n <button\r\n (click)=\"action.action(data)\"\r\n type=\"button\"\r\n [ngClass]=\"action.btnClass ? action.btnClass : defaultBtnClass\"\r\n class=\"d-inline-flex align-items-center gap-1\"\r\n >\r\n <i [ngClass]=\"action.icon\" [class.me-1]=\"action.icon\"></i>\r\n {{ action.text | abpLocalization }}\r\n </button>\r\n </ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "pipe", type: i1.LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: CreateInjectorPipe, name: "createInjector" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1118
+ ], exportAs: ["abpPageToolbar"], usesInheritance: true, ngImport: i0, template: "<div class=\"row justify-content-end mx-0 gap-2\" id=\"AbpContentToolbar\">\r\n <div\r\n class=\"col-auto px-0 pt-0 \"\r\n [class.pe-0]=\"last\"\r\n *ngFor=\"let action of actionList; trackBy: trackByFn; let last = last\"\r\n >\r\n <ng-container *ngIf=\"action.visible(data)\">\r\n <ng-container *abpPermission=\"action.permission;runChangeDetection: false\">\r\n <ng-container *ngIf=\"action.component as component; else button\">\r\n <ng-container\r\n *ngComponentOutlet=\"component; injector: record | createInjector: action:this\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #button>\r\n <ng-container *ngIf=\"asToolbarAction(action).value as toolbarAction\">\r\n <button\r\n (click)=\"action.action(data)\"\r\n type=\"button\"\r\n [ngClass]=\"toolbarAction.btnClass ? toolbarAction.btnClass : defaultBtnClass\"\r\n class=\"d-inline-flex align-items-center gap-1\"\r\n >\r\n <i [ngClass]=\"toolbarAction.icon\" [class.me-1]=\"toolbarAction.icon\"></i>\r\n {{ toolbarAction.text | abpLocalization }}\r\n </button>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "pipe", type: i1.LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: CreateInjectorPipe, name: "createInjector" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1107
1119
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageToolbarComponent, decorators: [{
1108
1120
  type: Component,
1109
1121
  args: [{ exportAs: 'abpPageToolbar', selector: 'abp-page-toolbar', providers: [
@@ -1111,7 +1123,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
1111
1123
  provide: EXTENSIONS_ACTION_TYPE,
1112
1124
  useValue: 'toolbarActions',
1113
1125
  },
1114
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row justify-content-end mx-0 gap-2\" id=\"AbpContentToolbar\">\r\n <div\r\n class=\"col-auto px-0 pt-0 pt-md-2\"\r\n [class.pe-0]=\"last\"\r\n *ngFor=\"let action of actionList; trackBy: trackByFn; let last = last\"\r\n >\r\n <ng-container *ngIf=\"action.visible(data)\">\r\n <ng-container *abpPermission=\"action.permission;runChangeDetection: false\">\r\n <ng-container *ngIf=\"action.component as component; else button\">\r\n <ng-container\r\n *ngComponentOutlet=\"component; injector: record | createInjector: action:this\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #button>\r\n <button\r\n (click)=\"action.action(data)\"\r\n type=\"button\"\r\n [ngClass]=\"action.btnClass ? action.btnClass : defaultBtnClass\"\r\n class=\"d-inline-flex align-items-center gap-1\"\r\n >\r\n <i [ngClass]=\"action.icon\" [class.me-1]=\"action.icon\"></i>\r\n {{ action.text | abpLocalization }}\r\n </button>\r\n </ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n" }]
1126
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row justify-content-end mx-0 gap-2\" id=\"AbpContentToolbar\">\r\n <div\r\n class=\"col-auto px-0 pt-0 \"\r\n [class.pe-0]=\"last\"\r\n *ngFor=\"let action of actionList; trackBy: trackByFn; let last = last\"\r\n >\r\n <ng-container *ngIf=\"action.visible(data)\">\r\n <ng-container *abpPermission=\"action.permission;runChangeDetection: false\">\r\n <ng-container *ngIf=\"action.component as component; else button\">\r\n <ng-container\r\n *ngComponentOutlet=\"component; injector: record | createInjector: action:this\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #button>\r\n <ng-container *ngIf=\"asToolbarAction(action).value as toolbarAction\">\r\n <button\r\n (click)=\"action.action(data)\"\r\n type=\"button\"\r\n [ngClass]=\"toolbarAction.btnClass ? toolbarAction.btnClass : defaultBtnClass\"\r\n class=\"d-inline-flex align-items-center gap-1\"\r\n >\r\n <i [ngClass]=\"toolbarAction.icon\" [class.me-1]=\"toolbarAction.icon\"></i>\r\n {{ toolbarAction.text | abpLocalization }}\r\n </button>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n" }]
1115
1127
  }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
1116
1128
 
1117
1129
  var objectExtensions = /*#__PURE__*/Object.freeze({
@@ -1210,7 +1222,7 @@ function mergeWithDefaultActions(extension, defaultActions, ...contributors) {
1210
1222
  }
1211
1223
 
1212
1224
  function generateFormFromProps(data) {
1213
- const extensions = data.getInjected(ExtensionsService);
1225
+ const extensions = data.getInjected((ExtensionsService));
1214
1226
  const identifier = data.getInjected(EXTENSIONS_IDENTIFIER);
1215
1227
  const form = new UntypedFormGroup({});
1216
1228
  const extraForm = new UntypedFormGroup({});
@@ -1388,7 +1400,7 @@ function createPropertiesToContributorsMapper(generateDisplayName, resource, enu
1388
1400
  if (property.ui.onTable.isVisible) {
1389
1401
  const sortable = Boolean(property.ui.onTable.isSortable);
1390
1402
  const columnWidth = type === "boolean" /* ePropType.Boolean */ ? 150 : 250;
1391
- const valueResolver = type === "enum" /* ePropType.Enum */
1403
+ const valueResolver = type === "enum" /* ePropType.Enum */ && property.type
1392
1404
  ? createEnumValueResolver(property.type, enums[property.type], propName)
1393
1405
  : createExtraPropertyValueResolver(propName);
1394
1406
  const entityProp = new EntityProp({