@zeedhi/common 1.54.0 → 1.55.0

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.
@@ -2908,8 +2908,6 @@ class Dashboard extends ComponentRender {
2908
2908
  this.moveMode = false;
2909
2909
  /* Cards */
2910
2910
  this.cards = [];
2911
- /* Card ID to be deleted */
2912
- this.deleteCardId = '';
2913
2911
  this.overrideNamedProps = {};
2914
2912
  /* Remove the paddings of the dashboard */
2915
2913
  this.removePadding = false;
@@ -3002,7 +3000,9 @@ class Dashboard extends ComponentRender {
3002
3000
  persistent: true,
3003
3001
  title: 'EDIT_CARD',
3004
3002
  grid: {
3005
- md: 4,
3003
+ cols: 10,
3004
+ sm: 8,
3005
+ lg: 6,
3006
3006
  },
3007
3007
  children: [
3008
3008
  {
@@ -3024,7 +3024,12 @@ class Dashboard extends ComponentRender {
3024
3024
  minValue: 1,
3025
3025
  clearable: false,
3026
3026
  hint: 'Min: 1, Max: 12',
3027
- cssStyle: 'width: 100px',
3027
+ grid: {
3028
+ cols: 6,
3029
+ sm: 6,
3030
+ md: 4,
3031
+ lg: 3,
3032
+ },
3028
3033
  mask: {
3029
3034
  decimalPlaces: 0,
3030
3035
  },
@@ -3033,19 +3038,33 @@ class Dashboard extends ComponentRender {
3033
3038
  name: 'inputHeight',
3034
3039
  component: 'ZdTextInput',
3035
3040
  label: 'HEIGHT',
3036
- cssStyle: 'width: 80px',
3041
+ grid: {
3042
+ cols: 6,
3043
+ sm: 6,
3044
+ md: 4,
3045
+ lg: 3,
3046
+ },
3037
3047
  },
3038
3048
  {
3039
3049
  name: 'inputPath',
3040
3050
  component: 'ZdTextInput',
3041
3051
  label: 'PATH',
3042
- cssStyle: 'width: 250px',
3052
+ grid: {
3053
+ cols: 7,
3054
+ sm: 7,
3055
+ md: 9,
3056
+ },
3043
3057
  },
3044
3058
  {
3045
3059
  name: 'inputLocal',
3046
3060
  component: 'ZdSwitch',
3047
3061
  label: 'PATH_LOCAL',
3048
3062
  cssClass: 'zd-mt-4',
3063
+ grid: {
3064
+ cols: 5,
3065
+ sm: 5,
3066
+ md: 3,
3067
+ },
3049
3068
  },
3050
3069
  ],
3051
3070
  },
@@ -3080,40 +3099,30 @@ class Dashboard extends ComponentRender {
3080
3099
  /* Edit header */
3081
3100
  this.headerLeftSlot = [
3082
3101
  {
3083
- name: `tooltipAddCard${this.name}`,
3084
- component: 'ZdTooltip',
3085
- bottom: true,
3102
+ name: `addDashboard${this.name}`,
3103
+ component: 'ZdButton',
3086
3104
  label: 'ADD',
3087
- children: [
3088
- {
3089
- name: `addDashboard${this.name}`,
3090
- component: 'ZdButton',
3091
- icon: true,
3092
- iconName: 'plus',
3093
- color: 'white',
3094
- events: {
3095
- click: this.openModalAddCard.bind(this),
3096
- },
3097
- },
3098
- ],
3105
+ iconName: 'plus',
3106
+ color: 'white',
3107
+ small: true,
3108
+ cssClass: 'zd-my-2',
3109
+ outline: true,
3110
+ events: {
3111
+ click: this.openModalAddCard.bind(this),
3112
+ },
3099
3113
  },
3100
3114
  {
3101
- name: `tooltipSaveCard${this.name}`,
3102
- component: 'ZdTooltip',
3103
- bottom: true,
3115
+ name: `saveDashboard${this.name}`,
3116
+ component: 'ZdButton',
3104
3117
  label: 'SAVE',
3105
- children: [
3106
- {
3107
- name: `saveDashboard${this.name}`,
3108
- component: 'ZdButton',
3109
- icon: true,
3110
- iconName: 'complete',
3111
- color: 'white',
3112
- events: {
3113
- click: this.onSave.bind(this),
3114
- },
3115
- },
3116
- ],
3118
+ iconName: 'complete',
3119
+ color: 'white',
3120
+ small: true,
3121
+ cssClass: 'zd-my-2',
3122
+ outline: true,
3123
+ events: {
3124
+ click: this.onSave.bind(this),
3125
+ },
3117
3126
  },
3118
3127
  ];
3119
3128
  this.editingMode = this.getInitValue('editingMode', props.editingMode, this.editingMode);
@@ -3123,6 +3132,7 @@ class Dashboard extends ComponentRender {
3123
3132
  this.removePadding = this.getInitValue('removePadding', props.removePadding, this.removePadding);
3124
3133
  this.height = this.getInitValue('height', props.height, this.height);
3125
3134
  this.heightAdjust = this.getInitValue('heightAdjust', props.heightAdjust, this.heightAdjust);
3135
+ this.cardFooterSlot = this.getInitValue('cardFooterSlot', props.cardFooterSlot, this.cardFooterSlot);
3126
3136
  this.createAccessors();
3127
3137
  }
3128
3138
  onMounted(element) {
@@ -3152,17 +3162,19 @@ class Dashboard extends ComponentRender {
3152
3162
  }
3153
3163
  }
3154
3164
  /* Delete a card */
3155
- deleteCard() {
3165
+ deleteCard(cardId) {
3156
3166
  this.cards.forEach((card, index) => {
3157
- if (this.deleteCardId === card.cardId) {
3167
+ if (cardId === card.cardId) {
3158
3168
  this.cards.splice(index, 1);
3159
3169
  }
3160
3170
  });
3171
+ }
3172
+ deleteAndCloseDialog(cardId) {
3173
+ this.deleteCard(cardId);
3161
3174
  DialogService.hide();
3162
3175
  }
3163
3176
  /* Show delete card dialog */
3164
3177
  showDeleteCardDialog(cardId) {
3165
- this.deleteCardId = cardId;
3166
3178
  this.hideDialog();
3167
3179
  DialogService.show({
3168
3180
  name: `${this.name}-delete-dialog`,
@@ -3184,7 +3196,7 @@ class Dashboard extends ComponentRender {
3184
3196
  component: 'ZdButton',
3185
3197
  label: 'YES',
3186
3198
  events: {
3187
- click: this.deleteCard.bind(this),
3199
+ click: this.deleteAndCloseDialog.bind(this, cardId),
3188
3200
  },
3189
3201
  },
3190
3202
  ],
@@ -3256,6 +3268,8 @@ class Dashboard extends ComponentRender {
3256
3268
  }
3257
3269
  /* Return footer rightSlot props for view layer */
3258
3270
  getFooterRightSlot(cardId) {
3271
+ if (this.cardFooterSlot)
3272
+ return this.cardFooterSlot;
3259
3273
  const rightSlot = [
3260
3274
  {
3261
3275
  name: `tooltipDelete${cardId}`,
@@ -3299,6 +3313,9 @@ class Dashboard extends ComponentRender {
3299
3313
  getCardId() {
3300
3314
  return Math.random().toString(36).substr(2, 9);
3301
3315
  }
3316
+ selectCard(cardId) {
3317
+ this.currentCardId = cardId;
3318
+ }
3302
3319
  }
3303
3320
 
3304
3321
  /**
@@ -3395,9 +3412,6 @@ class Date$1 extends TextInput {
3395
3412
  this.pickerType = this.getInitValue('pickerType', props.pickerType, this.pickerType);
3396
3413
  this.helperOptions = this.getInitValue('helperOptions', props.helperOptions, this.helperOptions);
3397
3414
  this.helperValue = this.getInitValue('helperValue', props.helperValue, this.helperValue);
3398
- if (this.pickerType === 'month') {
3399
- this.isoFormat = 'YYYY-MM';
3400
- }
3401
3415
  this.width = this.getInitValue('width', props.width, this.width);
3402
3416
  this.mask = this.getInitValue('mask', props.mask, undefined);
3403
3417
  this.createAccessors();
@@ -5203,6 +5217,7 @@ class Grid extends Iterable {
5203
5217
  * @public
5204
5218
  */
5205
5219
  this.resizeColumns = false;
5220
+ this.showSelectAll = true;
5206
5221
  this.navigationKeyMapping = {
5207
5222
  up: {
5208
5223
  event: this.navigateUp.bind(this),
@@ -5252,6 +5267,8 @@ class Grid extends Iterable {
5252
5267
  this.noResultSlot = this.changeDefaultSlotNames(this.noResultSlot);
5253
5268
  this.noDataText = this.getInitValue('noDataText', props.noDataText, this.noDataText);
5254
5269
  this.noResultsText = this.getInitValue('noResultsText', props.noResultsText, this.noResultsText);
5270
+ this.disableSelection = this.getInitValue('disableSelection', props.disableSelection, this.disableSelection);
5271
+ this.showSelectAll = this.getInitValue('showSelectAll', props.showSelectAll, this.showSelectAll);
5255
5272
  this.createAccessors();
5256
5273
  }
5257
5274
  onMounted(element) {
@@ -5441,6 +5458,10 @@ class Grid extends Iterable {
5441
5458
  });
5442
5459
  return slot;
5443
5460
  }
5461
+ callDisableSelection(row) {
5462
+ return !!this.disableSelection && typeof this.disableSelection === 'function'
5463
+ && this.disableSelection({ row, component: this });
5464
+ }
5444
5465
  }
5445
5466
 
5446
5467
  /**
@@ -8162,6 +8183,7 @@ class Month extends Date$1 {
8162
8183
  * Defines the month input format.
8163
8184
  */
8164
8185
  this.inputFormat = Config.monthInputFormat;
8186
+ this.isoFormat = 'YYYY-MM';
8165
8187
  /**
8166
8188
  * Determines the type of the picker - month for month picker.
8167
8189
  */
@@ -8171,19 +8193,11 @@ class Month extends Date$1 {
8171
8193
  this.dateFormat = this.getInitValue('dateFormat', props.dateFormat, this.dateFormat);
8172
8194
  this.displayFormat = this.getInitValue('displayFormat', props.displayFormat, this.displayFormat);
8173
8195
  this.inputFormat = this.getInitValue('inputFormat', props.inputFormat, this.inputFormat);
8196
+ this.pickerType = this.getInitValue('pickerType', undefined, this.pickerType);
8174
8197
  this.createAccessors();
8175
8198
  }
8176
- maskFormat(format) {
8177
- const monthIndex = format.indexOf('MMM');
8178
- const replaced = format.replace(/[A-Za-z]/gi, '#');
8179
- if (monthIndex === -1)
8180
- return replaced;
8181
- const arrFormat = replaced.split('');
8182
- arrFormat.splice(monthIndex, 3, ...'CCC');
8183
- return arrFormat.join('');
8184
- }
8185
8199
  }
8186
- FormatterParserProvider.registerFormatter('ZdMonth', (value, { dateFormat = Config.monthFormat, displayFormat = Config.monthDisplayFormat, inputFormat = Config.monthInputFormat, mask = '', initialMask, } = {}) => {
8200
+ FormatterParserProvider.registerFormatter('ZdMonth', (value, { dateFormat = Config.monthFormat, displayFormat = Config.monthDisplayFormat, inputFormat = Config.monthInputFormat, mask = '', initialMask, isSimpleDisplay = false, } = {}) => {
8187
8201
  if (!value) {
8188
8202
  return '';
8189
8203
  }
@@ -8195,14 +8209,17 @@ FormatterParserProvider.registerFormatter('ZdMonth', (value, { dateFormat = Conf
8195
8209
  if (inputFormat) {
8196
8210
  return dayjs(value, dateFormat).format(inputFormat);
8197
8211
  }
8198
- const valueToUnmask = value;
8212
+ let valueToUnmask = value;
8213
+ if (isSimpleDisplay) {
8214
+ valueToUnmask = dayjs(value, dateFormat).format(displayFormat);
8215
+ }
8199
8216
  const unmasked = Mask.getValueWithoutMask(valueToUnmask);
8200
8217
  const masked = Mask.getValueWithMask(unmasked, mask);
8201
8218
  return masked;
8202
8219
  }
8203
8220
  return dayjs(value, dateFormat).format(displayFormat);
8204
8221
  });
8205
- FormatterParserProvider.registerParser('ZdMonth', (value, { dateFormat = Config.monthFormat, displayFormat = Config.monthDisplayFormat, inputFormat = Config.monthInputFormat, mask = '', maskFormat, } = {}) => {
8222
+ FormatterParserProvider.registerParser('ZdMonth', (value, { dateFormat = Config.monthFormat, displayFormat = Config.monthDisplayFormat, inputFormat = Config.monthInputFormat, mask = '', initialMask, isSimpleDisplay = false, } = {}) => {
8206
8223
  if (!value) {
8207
8224
  return null;
8208
8225
  }
@@ -8218,12 +8235,14 @@ FormatterParserProvider.registerParser('ZdMonth', (value, { dateFormat = Config.
8218
8235
  }
8219
8236
  const unmasked = Mask.getValueWithoutMask(value);
8220
8237
  let masked;
8221
- const displayFmtMask = maskFormat(displayFormat);
8222
- masked = Mask.getValueWithMask(unmasked, displayFmtMask);
8223
- if (dayjs(masked, displayFormat, true).format(displayFormat) === masked) {
8224
- return dayjs(masked, displayFormat).format(dateFormat);
8238
+ if (!initialMask || isSimpleDisplay) {
8239
+ const displayFmtMask = displayFormat.replace(/[A-Za-z]/gi, '#');
8240
+ masked = Mask.getValueWithMask(unmasked, displayFmtMask);
8241
+ if (dayjs(masked, displayFormat, true).format(displayFormat) === masked) {
8242
+ return dayjs(masked, displayFormat).format(dateFormat);
8243
+ }
8225
8244
  }
8226
- const dateFmtMask = maskFormat(dateFormat);
8245
+ const dateFmtMask = dateFormat.replace(/[A-Za-z]/gi, '#');
8227
8246
  masked = Mask.getValueWithMask(unmasked, dateFmtMask);
8228
8247
  if (dayjs(masked, dateFormat, true).format(dateFormat) === masked) {
8229
8248
  return masked;
@@ -12099,11 +12118,14 @@ class BaseReport {
12099
12118
  return Object.assign(Object.assign({}, result), { [col.name]: row });
12100
12119
  }, {});
12101
12120
  }
12102
- buildFilter(filter) {
12103
- return Object.keys(filter).map((key) => ({
12104
- label: key,
12105
- value: I18n.translate('IS_EQUAL', { value: filter[key] }),
12106
- }));
12121
+ buildFilter(filter, columns) {
12122
+ return Object.keys(filter).map((key) => {
12123
+ var _a;
12124
+ return ({
12125
+ label: ((_a = columns.find((col) => col.name === key)) === null || _a === void 0 ? void 0 : _a.label) || key,
12126
+ value: I18n.translate('IS_EQUAL', { value: filter[key] }),
12127
+ });
12128
+ });
12107
12129
  }
12108
12130
  formatLangCode(lang) {
12109
12131
  if (!lang) {
@@ -12128,7 +12150,7 @@ class CSVReport extends BaseReport {
12128
12150
  }
12129
12151
  buildMetadata(name, title, columns, filter) {
12130
12152
  const builtCols = this.buildColumns(columns);
12131
- const builtFilters = this.buildFilter(filter || {});
12153
+ const builtFilters = this.buildFilter(filter || {}, columns);
12132
12154
  const lang = this.formatLangCode(I18n.instance.language);
12133
12155
  const clientLogo = '';
12134
12156
  const enterpriseLogo = '';
@@ -12235,7 +12257,7 @@ class PDFReport extends BaseReport {
12235
12257
  buildMetadata(name, title, columns, filter, portrait = true) {
12236
12258
  return __awaiter(this, void 0, void 0, function* () {
12237
12259
  const builtCols = this.buildColumns(columns);
12238
- const builtFilters = this.buildFilter(filter || {});
12260
+ const builtFilters = this.buildFilter(filter || {}, columns);
12239
12261
  const lang = this.formatLangCode(I18n.instance.language);
12240
12262
  let clientLogo = '';
12241
12263
  let enterpriseLogo = '';
@@ -12334,7 +12356,7 @@ class XLSReport extends BaseReport {
12334
12356
  }
12335
12357
  buildMetadata(name, title, columns, filter) {
12336
12358
  const builtCols = this.buildColumns(columns);
12337
- const builtFilters = this.buildFilter(filter || {});
12359
+ const builtFilters = this.buildFilter(filter || {}, columns);
12338
12360
  const lang = this.formatLangCode(I18n.instance.language);
12339
12361
  const clientLogo = '';
12340
12362
  const enterpriseLogo = '';
@@ -12379,7 +12401,7 @@ class XLS2Report extends BaseReport {
12379
12401
  }
12380
12402
  buildMetadata(name, title, columns, filter) {
12381
12403
  const builtCols = this.buildColumns(columns);
12382
- const builtFilters = this.buildFilter(filter || {});
12404
+ const builtFilters = this.buildFilter(filter || {}, columns);
12383
12405
  const lang = this.formatLangCode(I18n.instance.language);
12384
12406
  const clientLogo = '';
12385
12407
  const enterpriseLogo = '';
@@ -12576,7 +12598,7 @@ class XLS3Report extends BaseReport {
12576
12598
  }
12577
12599
  buildMetadata(name, title, columns, filter) {
12578
12600
  const builtCols = this.buildColumns(columns);
12579
- const builtFilters = this.buildFilter(filter || {});
12601
+ const builtFilters = this.buildFilter(filter || {}, columns);
12580
12602
  const lang = this.formatLangCode(I18n.instance.language);
12581
12603
  const clientLogo = '';
12582
12604
  const enterpriseLogo = '';
@@ -12856,4 +12878,4 @@ class Report {
12856
12878
 
12857
12879
  const AutoNumeric = require('@zeedhi/autonumeric/dist/autoNumeric');
12858
12880
 
12859
- export { Alert, AlertService, ApexChart, AutoNumeric, Badge, Breadcrumbs, Button, ButtonGroup, CSVReport, Card, Carousel, Checkbox, CheckboxMultiple, ChildNotFoundError, Chip, CodeEditor, Col, CollapseCard, Column, Component, ComponentRender, Container, Currency, Dashboard, Date$1 as Date, DateRange, Dialog, DialogService, Divider, Dropdown, FileInput, Footer, Form, Frame, FramePage, Grid, GridColumn, GridColumnEditable, GridEditable, Header, Icon, Icons, Image, Increment, Input, Iterable, IterableColumnsButton, IterableColumnsButtonController, IterablePageComponent, IterablePageInfo, IterablePageSize, IterablePagination, List, ListGroup, ListItem, Loading, LoadingService, Login, LoginButton, MasterDetail, Menu, MenuButton, MenuGroup, MenuLink, MenuSeparator, Modal, ModalCloseButton, ModalService, Month, Number$1 as Number, PDFReport, Password, Progress, Radio, RangeSlider, Report, Row, Search, Select, SelectMultiple, SelectTree, SelectTreeMultiple, SelectableList, SpeedDial, Steppers, SvgMap, Switch, Tab, Table, Tabs, Tag, Text, TextInput, Textarea, Time, Toggleable, Tooltip, Tree, TreeDataStructure, TreeGrid, TreeGridEditable, WatchURL, XLS2Report, XLS3Report, XLSReport, initTheme };
12881
+ export { Alert, AlertService, ApexChart, AutoNumeric, Badge, Breadcrumbs, Button, ButtonGroup, CSVReport, Card, Carousel, Checkbox, CheckboxMultiple, ChildNotFoundError, Chip, CodeEditor, Col, CollapseCard, Column, ColumnNotFoundError, Component, ComponentRender, Container, Currency, Dashboard, Date$1 as Date, DateRange, Dialog, DialogService, Divider, Dropdown, FileInput, Footer, Form, Frame, FramePage, Grid, GridColumn, GridColumnEditable, GridEditable, Header, Icon, Icons, Image, Increment, Input, Iterable, IterableColumnsButton, IterableColumnsButtonController, IterablePageComponent, IterablePageInfo, IterablePageSize, IterablePagination, List, ListGroup, ListItem, Loading, LoadingService, Login, LoginButton, MasterDetail, Menu, MenuButton, MenuGroup, MenuLink, MenuSeparator, Modal, ModalCloseButton, ModalService, Month, Number$1 as Number, PDFReport, Password, Progress, Radio, RangeSlider, Report, Row, Search, Select, SelectMultiple, SelectTree, SelectTreeMultiple, SelectableList, SpeedDial, Steppers, SvgMap, Switch, Tab, Table, Tabs, Tag, Text, TextInput, Textarea, Time, Toggleable, Tooltip, Tree, TreeDataStructure, TreeGrid, TreeGridEditable, WatchURL, XLS2Report, XLS3Report, XLSReport, initTheme };
@@ -2915,8 +2915,6 @@
2915
2915
  this.moveMode = false;
2916
2916
  /* Cards */
2917
2917
  this.cards = [];
2918
- /* Card ID to be deleted */
2919
- this.deleteCardId = '';
2920
2918
  this.overrideNamedProps = {};
2921
2919
  /* Remove the paddings of the dashboard */
2922
2920
  this.removePadding = false;
@@ -3009,7 +3007,9 @@
3009
3007
  persistent: true,
3010
3008
  title: 'EDIT_CARD',
3011
3009
  grid: {
3012
- md: 4,
3010
+ cols: 10,
3011
+ sm: 8,
3012
+ lg: 6,
3013
3013
  },
3014
3014
  children: [
3015
3015
  {
@@ -3031,7 +3031,12 @@
3031
3031
  minValue: 1,
3032
3032
  clearable: false,
3033
3033
  hint: 'Min: 1, Max: 12',
3034
- cssStyle: 'width: 100px',
3034
+ grid: {
3035
+ cols: 6,
3036
+ sm: 6,
3037
+ md: 4,
3038
+ lg: 3,
3039
+ },
3035
3040
  mask: {
3036
3041
  decimalPlaces: 0,
3037
3042
  },
@@ -3040,19 +3045,33 @@
3040
3045
  name: 'inputHeight',
3041
3046
  component: 'ZdTextInput',
3042
3047
  label: 'HEIGHT',
3043
- cssStyle: 'width: 80px',
3048
+ grid: {
3049
+ cols: 6,
3050
+ sm: 6,
3051
+ md: 4,
3052
+ lg: 3,
3053
+ },
3044
3054
  },
3045
3055
  {
3046
3056
  name: 'inputPath',
3047
3057
  component: 'ZdTextInput',
3048
3058
  label: 'PATH',
3049
- cssStyle: 'width: 250px',
3059
+ grid: {
3060
+ cols: 7,
3061
+ sm: 7,
3062
+ md: 9,
3063
+ },
3050
3064
  },
3051
3065
  {
3052
3066
  name: 'inputLocal',
3053
3067
  component: 'ZdSwitch',
3054
3068
  label: 'PATH_LOCAL',
3055
3069
  cssClass: 'zd-mt-4',
3070
+ grid: {
3071
+ cols: 5,
3072
+ sm: 5,
3073
+ md: 3,
3074
+ },
3056
3075
  },
3057
3076
  ],
3058
3077
  },
@@ -3087,40 +3106,30 @@
3087
3106
  /* Edit header */
3088
3107
  this.headerLeftSlot = [
3089
3108
  {
3090
- name: `tooltipAddCard${this.name}`,
3091
- component: 'ZdTooltip',
3092
- bottom: true,
3109
+ name: `addDashboard${this.name}`,
3110
+ component: 'ZdButton',
3093
3111
  label: 'ADD',
3094
- children: [
3095
- {
3096
- name: `addDashboard${this.name}`,
3097
- component: 'ZdButton',
3098
- icon: true,
3099
- iconName: 'plus',
3100
- color: 'white',
3101
- events: {
3102
- click: this.openModalAddCard.bind(this),
3103
- },
3104
- },
3105
- ],
3112
+ iconName: 'plus',
3113
+ color: 'white',
3114
+ small: true,
3115
+ cssClass: 'zd-my-2',
3116
+ outline: true,
3117
+ events: {
3118
+ click: this.openModalAddCard.bind(this),
3119
+ },
3106
3120
  },
3107
3121
  {
3108
- name: `tooltipSaveCard${this.name}`,
3109
- component: 'ZdTooltip',
3110
- bottom: true,
3122
+ name: `saveDashboard${this.name}`,
3123
+ component: 'ZdButton',
3111
3124
  label: 'SAVE',
3112
- children: [
3113
- {
3114
- name: `saveDashboard${this.name}`,
3115
- component: 'ZdButton',
3116
- icon: true,
3117
- iconName: 'complete',
3118
- color: 'white',
3119
- events: {
3120
- click: this.onSave.bind(this),
3121
- },
3122
- },
3123
- ],
3125
+ iconName: 'complete',
3126
+ color: 'white',
3127
+ small: true,
3128
+ cssClass: 'zd-my-2',
3129
+ outline: true,
3130
+ events: {
3131
+ click: this.onSave.bind(this),
3132
+ },
3124
3133
  },
3125
3134
  ];
3126
3135
  this.editingMode = this.getInitValue('editingMode', props.editingMode, this.editingMode);
@@ -3130,6 +3139,7 @@
3130
3139
  this.removePadding = this.getInitValue('removePadding', props.removePadding, this.removePadding);
3131
3140
  this.height = this.getInitValue('height', props.height, this.height);
3132
3141
  this.heightAdjust = this.getInitValue('heightAdjust', props.heightAdjust, this.heightAdjust);
3142
+ this.cardFooterSlot = this.getInitValue('cardFooterSlot', props.cardFooterSlot, this.cardFooterSlot);
3133
3143
  this.createAccessors();
3134
3144
  }
3135
3145
  onMounted(element) {
@@ -3159,17 +3169,19 @@
3159
3169
  }
3160
3170
  }
3161
3171
  /* Delete a card */
3162
- deleteCard() {
3172
+ deleteCard(cardId) {
3163
3173
  this.cards.forEach((card, index) => {
3164
- if (this.deleteCardId === card.cardId) {
3174
+ if (cardId === card.cardId) {
3165
3175
  this.cards.splice(index, 1);
3166
3176
  }
3167
3177
  });
3178
+ }
3179
+ deleteAndCloseDialog(cardId) {
3180
+ this.deleteCard(cardId);
3168
3181
  DialogService.hide();
3169
3182
  }
3170
3183
  /* Show delete card dialog */
3171
3184
  showDeleteCardDialog(cardId) {
3172
- this.deleteCardId = cardId;
3173
3185
  this.hideDialog();
3174
3186
  DialogService.show({
3175
3187
  name: `${this.name}-delete-dialog`,
@@ -3191,7 +3203,7 @@
3191
3203
  component: 'ZdButton',
3192
3204
  label: 'YES',
3193
3205
  events: {
3194
- click: this.deleteCard.bind(this),
3206
+ click: this.deleteAndCloseDialog.bind(this, cardId),
3195
3207
  },
3196
3208
  },
3197
3209
  ],
@@ -3263,6 +3275,8 @@
3263
3275
  }
3264
3276
  /* Return footer rightSlot props for view layer */
3265
3277
  getFooterRightSlot(cardId) {
3278
+ if (this.cardFooterSlot)
3279
+ return this.cardFooterSlot;
3266
3280
  const rightSlot = [
3267
3281
  {
3268
3282
  name: `tooltipDelete${cardId}`,
@@ -3306,6 +3320,9 @@
3306
3320
  getCardId() {
3307
3321
  return Math.random().toString(36).substr(2, 9);
3308
3322
  }
3323
+ selectCard(cardId) {
3324
+ this.currentCardId = cardId;
3325
+ }
3309
3326
  }
3310
3327
 
3311
3328
  /**
@@ -3402,9 +3419,6 @@
3402
3419
  this.pickerType = this.getInitValue('pickerType', props.pickerType, this.pickerType);
3403
3420
  this.helperOptions = this.getInitValue('helperOptions', props.helperOptions, this.helperOptions);
3404
3421
  this.helperValue = this.getInitValue('helperValue', props.helperValue, this.helperValue);
3405
- if (this.pickerType === 'month') {
3406
- this.isoFormat = 'YYYY-MM';
3407
- }
3408
3422
  this.width = this.getInitValue('width', props.width, this.width);
3409
3423
  this.mask = this.getInitValue('mask', props.mask, undefined);
3410
3424
  this.createAccessors();
@@ -5210,6 +5224,7 @@
5210
5224
  * @public
5211
5225
  */
5212
5226
  this.resizeColumns = false;
5227
+ this.showSelectAll = true;
5213
5228
  this.navigationKeyMapping = {
5214
5229
  up: {
5215
5230
  event: this.navigateUp.bind(this),
@@ -5259,6 +5274,8 @@
5259
5274
  this.noResultSlot = this.changeDefaultSlotNames(this.noResultSlot);
5260
5275
  this.noDataText = this.getInitValue('noDataText', props.noDataText, this.noDataText);
5261
5276
  this.noResultsText = this.getInitValue('noResultsText', props.noResultsText, this.noResultsText);
5277
+ this.disableSelection = this.getInitValue('disableSelection', props.disableSelection, this.disableSelection);
5278
+ this.showSelectAll = this.getInitValue('showSelectAll', props.showSelectAll, this.showSelectAll);
5262
5279
  this.createAccessors();
5263
5280
  }
5264
5281
  onMounted(element) {
@@ -5448,6 +5465,10 @@
5448
5465
  });
5449
5466
  return slot;
5450
5467
  }
5468
+ callDisableSelection(row) {
5469
+ return !!this.disableSelection && typeof this.disableSelection === 'function'
5470
+ && this.disableSelection({ row, component: this });
5471
+ }
5451
5472
  }
5452
5473
 
5453
5474
  /**
@@ -8169,6 +8190,7 @@
8169
8190
  * Defines the month input format.
8170
8191
  */
8171
8192
  this.inputFormat = core.Config.monthInputFormat;
8193
+ this.isoFormat = 'YYYY-MM';
8172
8194
  /**
8173
8195
  * Determines the type of the picker - month for month picker.
8174
8196
  */
@@ -8178,19 +8200,11 @@
8178
8200
  this.dateFormat = this.getInitValue('dateFormat', props.dateFormat, this.dateFormat);
8179
8201
  this.displayFormat = this.getInitValue('displayFormat', props.displayFormat, this.displayFormat);
8180
8202
  this.inputFormat = this.getInitValue('inputFormat', props.inputFormat, this.inputFormat);
8203
+ this.pickerType = this.getInitValue('pickerType', undefined, this.pickerType);
8181
8204
  this.createAccessors();
8182
8205
  }
8183
- maskFormat(format) {
8184
- const monthIndex = format.indexOf('MMM');
8185
- const replaced = format.replace(/[A-Za-z]/gi, '#');
8186
- if (monthIndex === -1)
8187
- return replaced;
8188
- const arrFormat = replaced.split('');
8189
- arrFormat.splice(monthIndex, 3, ...'CCC');
8190
- return arrFormat.join('');
8191
- }
8192
8206
  }
8193
- core.FormatterParserProvider.registerFormatter('ZdMonth', (value, { dateFormat = core.Config.monthFormat, displayFormat = core.Config.monthDisplayFormat, inputFormat = core.Config.monthInputFormat, mask = '', initialMask, } = {}) => {
8207
+ core.FormatterParserProvider.registerFormatter('ZdMonth', (value, { dateFormat = core.Config.monthFormat, displayFormat = core.Config.monthDisplayFormat, inputFormat = core.Config.monthInputFormat, mask = '', initialMask, isSimpleDisplay = false, } = {}) => {
8194
8208
  if (!value) {
8195
8209
  return '';
8196
8210
  }
@@ -8202,14 +8216,17 @@
8202
8216
  if (inputFormat) {
8203
8217
  return core.dayjs(value, dateFormat).format(inputFormat);
8204
8218
  }
8205
- const valueToUnmask = value;
8219
+ let valueToUnmask = value;
8220
+ if (isSimpleDisplay) {
8221
+ valueToUnmask = core.dayjs(value, dateFormat).format(displayFormat);
8222
+ }
8206
8223
  const unmasked = core.Mask.getValueWithoutMask(valueToUnmask);
8207
8224
  const masked = core.Mask.getValueWithMask(unmasked, mask);
8208
8225
  return masked;
8209
8226
  }
8210
8227
  return core.dayjs(value, dateFormat).format(displayFormat);
8211
8228
  });
8212
- core.FormatterParserProvider.registerParser('ZdMonth', (value, { dateFormat = core.Config.monthFormat, displayFormat = core.Config.monthDisplayFormat, inputFormat = core.Config.monthInputFormat, mask = '', maskFormat, } = {}) => {
8229
+ core.FormatterParserProvider.registerParser('ZdMonth', (value, { dateFormat = core.Config.monthFormat, displayFormat = core.Config.monthDisplayFormat, inputFormat = core.Config.monthInputFormat, mask = '', initialMask, isSimpleDisplay = false, } = {}) => {
8213
8230
  if (!value) {
8214
8231
  return null;
8215
8232
  }
@@ -8225,12 +8242,14 @@
8225
8242
  }
8226
8243
  const unmasked = core.Mask.getValueWithoutMask(value);
8227
8244
  let masked;
8228
- const displayFmtMask = maskFormat(displayFormat);
8229
- masked = core.Mask.getValueWithMask(unmasked, displayFmtMask);
8230
- if (core.dayjs(masked, displayFormat, true).format(displayFormat) === masked) {
8231
- return core.dayjs(masked, displayFormat).format(dateFormat);
8245
+ if (!initialMask || isSimpleDisplay) {
8246
+ const displayFmtMask = displayFormat.replace(/[A-Za-z]/gi, '#');
8247
+ masked = core.Mask.getValueWithMask(unmasked, displayFmtMask);
8248
+ if (core.dayjs(masked, displayFormat, true).format(displayFormat) === masked) {
8249
+ return core.dayjs(masked, displayFormat).format(dateFormat);
8250
+ }
8232
8251
  }
8233
- const dateFmtMask = maskFormat(dateFormat);
8252
+ const dateFmtMask = dateFormat.replace(/[A-Za-z]/gi, '#');
8234
8253
  masked = core.Mask.getValueWithMask(unmasked, dateFmtMask);
8235
8254
  if (core.dayjs(masked, dateFormat, true).format(dateFormat) === masked) {
8236
8255
  return masked;
@@ -12106,11 +12125,14 @@
12106
12125
  return Object.assign(Object.assign({}, result), { [col.name]: row });
12107
12126
  }, {});
12108
12127
  }
12109
- buildFilter(filter) {
12110
- return Object.keys(filter).map((key) => ({
12111
- label: key,
12112
- value: core.I18n.translate('IS_EQUAL', { value: filter[key] }),
12113
- }));
12128
+ buildFilter(filter, columns) {
12129
+ return Object.keys(filter).map((key) => {
12130
+ var _a;
12131
+ return ({
12132
+ label: ((_a = columns.find((col) => col.name === key)) === null || _a === void 0 ? void 0 : _a.label) || key,
12133
+ value: core.I18n.translate('IS_EQUAL', { value: filter[key] }),
12134
+ });
12135
+ });
12114
12136
  }
12115
12137
  formatLangCode(lang) {
12116
12138
  if (!lang) {
@@ -12135,7 +12157,7 @@
12135
12157
  }
12136
12158
  buildMetadata(name, title, columns, filter) {
12137
12159
  const builtCols = this.buildColumns(columns);
12138
- const builtFilters = this.buildFilter(filter || {});
12160
+ const builtFilters = this.buildFilter(filter || {}, columns);
12139
12161
  const lang = this.formatLangCode(core.I18n.instance.language);
12140
12162
  const clientLogo = '';
12141
12163
  const enterpriseLogo = '';
@@ -12242,7 +12264,7 @@
12242
12264
  buildMetadata(name, title, columns, filter, portrait = true) {
12243
12265
  return __awaiter(this, void 0, void 0, function* () {
12244
12266
  const builtCols = this.buildColumns(columns);
12245
- const builtFilters = this.buildFilter(filter || {});
12267
+ const builtFilters = this.buildFilter(filter || {}, columns);
12246
12268
  const lang = this.formatLangCode(core.I18n.instance.language);
12247
12269
  let clientLogo = '';
12248
12270
  let enterpriseLogo = '';
@@ -12341,7 +12363,7 @@
12341
12363
  }
12342
12364
  buildMetadata(name, title, columns, filter) {
12343
12365
  const builtCols = this.buildColumns(columns);
12344
- const builtFilters = this.buildFilter(filter || {});
12366
+ const builtFilters = this.buildFilter(filter || {}, columns);
12345
12367
  const lang = this.formatLangCode(core.I18n.instance.language);
12346
12368
  const clientLogo = '';
12347
12369
  const enterpriseLogo = '';
@@ -12386,7 +12408,7 @@
12386
12408
  }
12387
12409
  buildMetadata(name, title, columns, filter) {
12388
12410
  const builtCols = this.buildColumns(columns);
12389
- const builtFilters = this.buildFilter(filter || {});
12411
+ const builtFilters = this.buildFilter(filter || {}, columns);
12390
12412
  const lang = this.formatLangCode(core.I18n.instance.language);
12391
12413
  const clientLogo = '';
12392
12414
  const enterpriseLogo = '';
@@ -12583,7 +12605,7 @@
12583
12605
  }
12584
12606
  buildMetadata(name, title, columns, filter) {
12585
12607
  const builtCols = this.buildColumns(columns);
12586
- const builtFilters = this.buildFilter(filter || {});
12608
+ const builtFilters = this.buildFilter(filter || {}, columns);
12587
12609
  const lang = this.formatLangCode(core.I18n.instance.language);
12588
12610
  const clientLogo = '';
12589
12611
  const enterpriseLogo = '';
@@ -12882,6 +12904,7 @@
12882
12904
  exports.Col = Col;
12883
12905
  exports.CollapseCard = CollapseCard;
12884
12906
  exports.Column = Column;
12907
+ exports.ColumnNotFoundError = ColumnNotFoundError;
12885
12908
  exports.Component = Component;
12886
12909
  exports.ComponentRender = ComponentRender;
12887
12910
  exports.Container = Container;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zeedhi/common",
3
- "version": "1.54.0",
3
+ "version": "1.55.0",
4
4
  "description": "Zeedhi Common",
5
5
  "author": "Zeedhi <zeedhi@teknisa.com>",
6
6
  "license": "ISC",
@@ -37,5 +37,5 @@
37
37
  "lodash.times": "^4.3.2",
38
38
  "mockdate": "^3.0.2"
39
39
  },
40
- "gitHead": "338fa7c142e0a73239dc51f238c7f21c6b403f2b"
40
+ "gitHead": "832a10a71ea046b631344b008e676c1706617cec"
41
41
  }
@@ -72,6 +72,7 @@ export * from './zd-input/input';
72
72
  export * from './zd-input/interfaces';
73
73
  export * from './zd-iterable/column';
74
74
  export * from './zd-iterable/iterable';
75
+ export * from './zd-iterable/column-not-found';
75
76
  export * from './zd-iterable/iterable-columns-button';
76
77
  export * from './zd-iterable/iterable-columns-button-controller';
77
78
  export * from './zd-iterable/iterable-page-component';
@@ -3,6 +3,7 @@ import { ComponentRender } from '../zd-component/component-render';
3
3
  import { IButton } from '../zd-button/interfaces';
4
4
  import { Modal } from '../zd-modal/modal';
5
5
  import { IModal } from '../zd-modal/interfaces';
6
+ import { IComponentRender } from '../zd-component/interfaces';
6
7
  /**
7
8
  * Base class for Dashboard component.
8
9
  */
@@ -13,11 +14,12 @@ export declare class Dashboard extends ComponentRender implements IDashboard {
13
14
  cards: IDashboardCard[];
14
15
  addModal?: Modal;
15
16
  editModal?: Modal;
16
- deleteCardId: string;
17
17
  overrideNamedProps: any;
18
18
  removePadding: boolean;
19
19
  height: string | number;
20
20
  heightAdjust: string | number;
21
+ cardFooterSlot?: IComponentRender[];
22
+ currentCardId?: string;
21
23
  addModalDef: IModal;
22
24
  editModalDef: IModal;
23
25
  /**
@@ -28,7 +30,8 @@ export declare class Dashboard extends ComponentRender implements IDashboard {
28
30
  onMounted(element: any): void;
29
31
  onBeforeDestroy(): void;
30
32
  addCard(): void;
31
- deleteCard(): void;
33
+ deleteCard(cardId: string): void;
34
+ deleteAndCloseDialog(cardId: string): void;
32
35
  showDeleteCardDialog(cardId: string): void;
33
36
  private hideDialog;
34
37
  updateCard(): void;
@@ -50,7 +53,7 @@ export declare class Dashboard extends ComponentRender implements IDashboard {
50
53
  local: boolean;
51
54
  overrideNamedProps: any;
52
55
  };
53
- getFooterRightSlot(cardId: string): ({
56
+ getFooterRightSlot(cardId: string): IComponentRender[] | ({
54
57
  name: string;
55
58
  component: string;
56
59
  bottom: boolean;
@@ -81,4 +84,5 @@ export declare class Dashboard extends ComponentRender implements IDashboard {
81
84
  }[];
82
85
  })[];
83
86
  private getCardId;
87
+ selectCard(cardId: string): void;
84
88
  }
@@ -18,6 +18,7 @@ export interface IDashboard extends IComponentRender {
18
18
  removePadding?: boolean;
19
19
  height?: string | number;
20
20
  heightAdjust?: string | number;
21
+ cardFooterSlot?: IComponentRender[];
21
22
  }
22
23
  export interface IDashboardCard extends Omit<ICard, 'name' | 'component'> {
23
24
  cardId: string;
@@ -55,7 +55,7 @@ export declare class Date extends TextInput implements IDate {
55
55
  /**
56
56
  * Determines the type of the picker - date for date picker, month for month picker.
57
57
  */
58
- pickerType: string;
58
+ protected pickerType: string;
59
59
  /**
60
60
  * Helper options.
61
61
  */
@@ -16,7 +16,6 @@ export interface IDate extends ITextInput {
16
16
  fullWidth?: boolean;
17
17
  locale?: string;
18
18
  inputFormat?: string;
19
- pickerType?: string;
20
19
  scrollable?: boolean;
21
20
  showDatePicker?: boolean;
22
21
  showWeek?: boolean;
@@ -105,6 +105,15 @@ export declare class Grid extends Iterable implements IGrid {
105
105
  * @public
106
106
  */
107
107
  resizeColumns: boolean;
108
+ /**
109
+ * Disable selection of specific rows using controller
110
+ * @public
111
+ */
112
+ disableSelection?: (args: {
113
+ row: IDictionary<any>;
114
+ component: Grid;
115
+ }) => boolean;
116
+ showSelectAll: boolean;
108
117
  /**
109
118
  * Creates a new Grid.
110
119
  * @param props Grid properties
@@ -167,4 +176,5 @@ export declare class Grid extends Iterable implements IGrid {
167
176
  deleteRows(): Promise<any[]>;
168
177
  getActionComponent(actionComponent: IComponent, column: GridColumn, row: IDictionary, parentPath?: string): IComponent;
169
178
  protected changeDefaultSlotNames(slot: IComponentRender[]): IComponentRender[];
179
+ callDisableSelection(row: IDictionary<any>): boolean;
170
180
  }
@@ -41,6 +41,11 @@ export interface IGrid extends IIterable {
41
41
  loadingText?: string;
42
42
  noDataText?: string;
43
43
  noResultsText?: string;
44
+ disableSelection?: (args: {
45
+ row: IDictionary<any>;
46
+ component: Grid;
47
+ }) => boolean;
48
+ showSelectAll?: boolean;
44
49
  }
45
50
  export interface IGridColumn extends IColumn {
46
51
  children?: IChildrenActionColumn[];
@@ -16,10 +16,11 @@ export declare class Month extends Date implements IMonth {
16
16
  * Defines the month input format.
17
17
  */
18
18
  inputFormat?: string;
19
+ protected isoFormat: string;
19
20
  /**
20
21
  * Determines the type of the picker - month for month picker.
21
22
  */
22
- pickerType: string;
23
+ protected pickerType: string;
23
24
  protected formatterFn: Function;
24
25
  protected parserFn: Function;
25
26
  /**
@@ -27,5 +28,4 @@ export declare class Month extends Date implements IMonth {
27
28
  * @param props Month properties
28
29
  */
29
30
  constructor(props: IMonth);
30
- protected maskFormat(format: string): string;
31
31
  }
@@ -10,7 +10,7 @@ export declare abstract class BaseReport implements IReportType {
10
10
  totalWidth: number;
11
11
  };
12
12
  protected buildColumns(columns: IColumn[]): MetadataColumn;
13
- protected buildFilter(filter: IDictionary): MetadataFilter;
13
+ protected buildFilter(filter: IDictionary, columns: IColumn[]): MetadataFilter;
14
14
  protected formatLangCode(lang?: string): string;
15
15
  protected expressionZeedhiToXls: any;
16
16
  protected colunmXLS: string;