mis-crystal-design-system 18.0.18 → 18.0.19-test-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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mis-crystal-design-system",
3
- "version": "18.0.18",
3
+ "version": "18.0.19-test-2",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "*",
6
6
  "@angular/core": "*",
@@ -40,6 +40,12 @@
40
40
  "esm": "./esm2022/async-search-dropdown/mis-crystal-design-system-async-search-dropdown.mjs",
41
41
  "default": "./fesm2022/mis-crystal-design-system-async-search-dropdown.mjs"
42
42
  },
43
+ "./checkbox": {
44
+ "types": "./checkbox/index.d.ts",
45
+ "esm2022": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
46
+ "esm": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
47
+ "default": "./fesm2022/mis-crystal-design-system-checkbox.mjs"
48
+ },
43
49
  "./button": {
44
50
  "types": "./button/index.d.ts",
45
51
  "esm2022": "./esm2022/button/mis-crystal-design-system-button.mjs",
@@ -52,12 +58,6 @@
52
58
  "esm": "./esm2022/chip/mis-crystal-design-system-chip.mjs",
53
59
  "default": "./fesm2022/mis-crystal-design-system-chip.mjs"
54
60
  },
55
- "./checkbox": {
56
- "types": "./checkbox/index.d.ts",
57
- "esm2022": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
58
- "esm": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
59
- "default": "./fesm2022/mis-crystal-design-system-checkbox.mjs"
60
- },
61
61
  "./datepicker_v2": {
62
62
  "types": "./datepicker_v2/index.d.ts",
63
63
  "esm2022": "./esm2022/datepicker_v2/mis-crystal-design-system-datepicker_v2.mjs",
@@ -3,20 +3,22 @@ import { ActionItem } from "../table.component";
3
3
  import * as i0 from "@angular/core";
4
4
  export declare class ActionsCellComponent implements OnInit {
5
5
  set rowData(value: any);
6
- data: any;
7
6
  isChecked: boolean;
8
7
  set config(config: any);
9
- actionItems: ActionItem[];
10
- actionType: "inline" | "dropdown" | "checkbox";
11
- submenuAlign: "left" | "right";
12
- menuAlign: "left" | "right";
13
- action?: (data: any) => void;
14
8
  actionClick: EventEmitter<{
15
9
  item?: ActionItem;
16
10
  data: any;
17
11
  isChecked?: any;
18
12
  }>;
13
+ dropdownToggled: EventEmitter<ActionsCellComponent>;
19
14
  isDropdownOpen: boolean;
15
+ actionItems: ActionItem[];
16
+ actionType: "inline" | "dropdown" | "checkbox";
17
+ submenuAlign: "left" | "right";
18
+ menuAlign: "left" | "right";
19
+ action?: (data: any) => void;
20
+ data: any;
21
+ disable: (data: any) => boolean;
20
22
  private _style;
21
23
  containerStyle: any;
22
24
  ngOnInit(): void;
@@ -25,10 +27,11 @@ export declare class ActionsCellComponent implements OnInit {
25
27
  trackByAction(index: number, item: ActionItem): string;
26
28
  isSvgFile(iconPath: string): boolean;
27
29
  onDocumentClick(): void;
30
+ closeDropdown(): void;
28
31
  toggleDropdown(event: Event): void;
29
32
  onDropdownItemClick(item: any, event: Event): void;
30
33
  onCheckboxChange(event: any): void;
31
34
  isDisabled(item: ActionItem): boolean;
32
35
  static ɵfac: i0.ɵɵFactoryDeclaration<ActionsCellComponent, never>;
33
- static ɵcmp: i0.ɵɵComponentDeclaration<ActionsCellComponent, "mis-actions-cell", never, { "rowData": { "alias": "rowData"; "required": false; }; "isChecked": { "alias": "isChecked"; "required": false; }; "config": { "alias": "config"; "required": false; }; }, { "actionClick": "actionClick"; }, never, never, false, never>;
36
+ static ɵcmp: i0.ɵɵComponentDeclaration<ActionsCellComponent, "mis-actions-cell", never, { "rowData": { "alias": "rowData"; "required": false; }; "isChecked": { "alias": "isChecked"; "required": false; }; "config": { "alias": "config"; "required": false; }; }, { "actionClick": "actionClick"; "dropdownToggled": "dropdownToggled"; }, never, never, false, never>;
34
37
  }
@@ -1,6 +1,7 @@
1
1
  import { AfterViewInit, ElementRef, EventEmitter, OnChanges, OnInit, QueryList, Renderer2 } from "@angular/core";
2
2
  import { Filter, TableFilterComponent } from "./filter/filter.component";
3
3
  import { SortState } from "./sort-icons.directive";
4
+ import { ActionsCellComponent } from './actions-cell/actions-cell.component';
4
5
  import * as i0 from "@angular/core";
5
6
  export declare class TableComponent implements OnInit, AfterViewInit, OnChanges {
6
7
  private renderer;
@@ -25,6 +26,7 @@ export declare class TableComponent implements OnInit, AfterViewInit, OnChanges
25
26
  }>;
26
27
  filter: TableFilterComponent | any;
27
28
  colHeaders: QueryList<ElementRef> | any;
29
+ actionCells: QueryList<ActionsCellComponent>;
28
30
  pages: Array<number>;
29
31
  tableLength: number;
30
32
  pageSelected: EventEmitter<number>;
@@ -70,6 +72,7 @@ export declare class TableComponent implements OnInit, AfterViewInit, OnChanges
70
72
  onActionClick(event: any, rowIndex: number): void;
71
73
  isRowDisabled(row: any): boolean;
72
74
  toggleCheckbox(): void;
75
+ closeOtherDropdowns(exceptComponent: ActionsCellComponent): void;
73
76
  static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent, never>;
74
77
  static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "mis-table", never, { "config": { "alias": "tableConfig"; "required": false; }; "subTableconfig": { "alias": "subTableconfig"; "required": false; }; "tableDataLoading": { "alias": "tableDataLoading"; "required": false; }; "expandedIndex": { "alias": "expandedIndex"; "required": false; }; "tableData": { "alias": "tableData"; "required": false; }; "subTableData": { "alias": "subTableData"; "required": false; }; "subTableDataLoading": { "alias": "subTableDataLoading"; "required": false; }; }, { "filtersUpdated": "filtersUpdated"; "pageSelected": "pageSelected"; "sortChange": "sortChange"; "headerAction": "headerAction"; }, never, never, false, never>;
75
78
  }
@@ -119,6 +122,7 @@ export interface ColConfig {
119
122
  actionItems?: ActionItem[];
120
123
  actionType?: "inline" | "dropdown" | "checkbox";
121
124
  menuAlign?: "left" | "right";
125
+ disable?: (rowData: any) => boolean;
122
126
  }
123
127
  export interface ActionItem {
124
128
  label: string;
@@ -1,69 +0,0 @@
1
- .mis-btn {
2
- background: none;
3
- outline: none;
4
- border: none;
5
- cursor: pointer;
6
- border-radius: 4px;
7
- vertical-align: middle;
8
- text-align: center;
9
- box-sizing: border-box;
10
- display: flex;
11
- align-items: center;
12
- text-decoration: none;
13
- justify-content: center;
14
-
15
- span,
16
- img {
17
- margin-right: 8px;
18
- }
19
-
20
- padding: 10px 16px;
21
- font-size: 16px;
22
- line-height: 24px;
23
- &.mis-btn-lg {
24
- padding: 16px;
25
- font-weight: bold;
26
- }
27
- &.mis-btn-sm {
28
- padding: 6px 12px;
29
- font-size: 14px;
30
- line-height: 20px;
31
- }
32
-
33
- background-color: transparent;
34
- color: #0937b2;
35
- &:hover {
36
- background-color: #f0f3fa;
37
- }
38
- &:focus {
39
- background-color: #dae1f3;
40
- }
41
- &:disabled {
42
- color: #929dab;
43
- pointer-events: none;
44
- }
45
-
46
- &.mis-outline {
47
- border: 1px solid #0937b2;
48
-
49
- &:disabled {
50
- color: #929dab;
51
- border-color: #929dab;
52
- }
53
- }
54
-
55
- &.mis-primary {
56
- background-color: #0937b2;
57
- color: #ffffff;
58
- &:hover {
59
- background-color: #062a99;
60
- }
61
- &:focus {
62
- background-color: #041f80;
63
- }
64
- &:disabled {
65
- background-color: #e0e0e0;
66
- color: #929dab;
67
- }
68
- }
69
- }
@@ -1,20 +0,0 @@
1
- .mis-drawer {
2
- display: block;
3
- transition: all 300ms ease-out;
4
- }
5
- .mis-drawer-overlay {
6
- background: rgba(0, 0, 0, 0.12);
7
- }
8
- mis-datepicker-container {
9
- z-index: 2100;
10
- }
11
-
12
- mis-loader {
13
- z-index: 3000;
14
- }
15
-
16
- @keyframes slideOut {
17
- to {
18
- transform: translateX(100%);
19
- }
20
- }
@@ -1,180 +0,0 @@
1
- @import "../styles/mis-color-constants.scss";
2
-
3
- .input-container {
4
- position: relative;
5
- padding-bottom: 24px;
6
- &.mis-disabled {
7
- .input-wrapper {
8
- pointer-events: none !important;
9
- }
10
- }
11
- .input-wrapper {
12
- box-sizing: border-box;
13
- display: flex;
14
- align-items: center;
15
- flex-direction: row;
16
- flex-wrap: nowrap;
17
- transition: all ease-in 60ms;
18
- background-color: #ffffff;
19
- padding: 3px 16px; // DONE CHANGE
20
- gap: 16px;
21
- .mis-input {
22
- flex: 1 1 auto;
23
- z-index: 0;
24
- position: relative;
25
- display: flex;
26
- align-items: center;
27
- }
28
- input {
29
- flex: 1 1 auto;
30
- border: none;
31
- outline: none;
32
- height: 100%;
33
- padding: 0;
34
- font-family: Lato;
35
- font-style: normal;
36
- font-weight: normal;
37
- font-size: 16px;
38
- height: 24px;
39
- color: #181f33;
40
- background-color: transparent;
41
- width: 100%;
42
- vertical-align: middle;
43
- &::placeholder {
44
- transition: all ease-in 100ms;
45
- opacity: 0;
46
- transform-origin: left center;
47
- color: transparent;
48
- }
49
- }
50
- .mis-placeholder {
51
- position: absolute;
52
- font-family: Lato;
53
- font-style: normal;
54
- font-weight: normal;
55
- font-size: 16px;
56
- line-height: 24px;
57
- color: #6a737d;
58
- z-index: -1;
59
- transition: all ease-in 150ms;
60
- }
61
-
62
- &:focus-within {
63
- background-color: #f5f5f5;
64
- }
65
- &:focus-within {
66
- border: 1px solid $pmry_500;
67
- }
68
- [mis-input-act],
69
- [mis-input-icon] {
70
- width: 18px;
71
- height: 18px;
72
- color: #6a737d;
73
- font-size: 24px;
74
- line-height: 18px;
75
- }
76
- [mis-input-act] {
77
- cursor: pointer;
78
- }
79
- }
80
- &.no-hint {
81
- padding-bottom: 0px;
82
- }
83
- &.rounded {
84
- input {
85
- box-sizing: initial;
86
- }
87
- &.sm {
88
- input {
89
- padding: 3px 16px;
90
- }
91
- }
92
- &.md {
93
- input {
94
- padding: 9px 16px;
95
- }
96
- }
97
- &.lg {
98
- input {
99
- padding: 15px 16px;
100
- }
101
- }
102
- .input-wrapper {
103
- border-radius: 4px;
104
- border: 1px solid #e0e0e0;
105
- padding: 0;
106
- // input:not(:disabled) {
107
- // &:hover,
108
- // &:focus {
109
- // background-color: #f5f5f5;
110
- // }
111
- // }
112
- &:hover {
113
- background-color: #f5f5f5;
114
- }
115
- &:focus-within {
116
- border: 1px solid #0937b2;
117
- }
118
- input:not(:placeholder-shown) + .mis-placeholder {
119
- color: transparent !important;
120
- }
121
- .mis-placeholder {
122
- margin-left: 16px;
123
- transition-duration: 50ms;
124
- }
125
- }
126
- &.has-error {
127
- .input-wrapper {
128
- border: 1px solid #b00020 !important;
129
- }
130
- }
131
- }
132
- &.floating {
133
- .input-wrapper {
134
- padding-top: 24px;
135
- padding-bottom: 7px; // DONE CHANGE
136
- border-bottom: 1px solid #e0e0e0;
137
- input:focus + .mis-placeholder {
138
- color: #0937b2 !important;
139
- }
140
- input:not(:placeholder-shown) + .mis-placeholder,
141
- input:focus + .mis-placeholder {
142
- transform: translateY(calc(-100% + 6px)) !important;
143
- font-size: 12px !important;
144
- letter-spacing: 0.2px !important;
145
- }
146
- &:focus-within {
147
- border: none;
148
- border-bottom: 1px solid #0937b2;
149
- input::placeholder {
150
- color: #6a737d;
151
- opacity: 1;
152
- font-size: 16px;
153
- }
154
- }
155
- }
156
- &.has-error {
157
- .input-wrapper {
158
- border-bottom: 1px solid #b00020 !important;
159
- .mis-placeholder {
160
- color: #b00020 !important;
161
- }
162
- }
163
- }
164
- }
165
- [mis-input-hint],
166
- [mis-input-error] {
167
- position: absolute;
168
- left: 0;
169
- right: 0px;
170
- bottom: 0px;
171
- line-height: 24px;
172
- height: 24px;
173
- font-size: 12px;
174
- color: #6a737d;
175
- letter-spacing: 0.2px;
176
- }
177
- [mis-input-error] {
178
- color: #b00020;
179
- }
180
- }
package/modal/modal.scss DELETED
@@ -1,9 +0,0 @@
1
- .mis-modal {
2
- display: block;
3
- overflow: auto;
4
- padding: 8px;
5
- // transition: all 300ms ease-out;
6
- }
7
- .mis-modal-overlay {
8
- background: rgba(0, 0, 0, 0.32);
9
- }
Binary file