@it-enterprise/forcebpm-ui-kit 1.0.2-beta.27 → 1.0.2-beta.29

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 (22) hide show
  1. package/index.js +2 -1
  2. package/package.json +1 -1
  3. package/src/{FConfirmModal.vue → FConfirmDialog.vue} +33 -27
  4. package/src/FDialog.vue +0 -2
  5. package/src/FLangSwitcher.vue +47 -0
  6. package/src/FNotify.vue +1 -1
  7. package/src/FPreLoader.vue +2 -2
  8. package/src/assets/icons/check.svg +3 -0
  9. package/src/assets/icons/color-radio-active.svg +4 -0
  10. package/src/assets/icons/color-radio.svg +3 -0
  11. package/src/assets/icons/ctx-arrow.svg +3 -0
  12. package/src/assets/icons/ctx-delete.svg +6 -0
  13. package/src/assets/icons/ctx-link.svg +5 -0
  14. package/src/assets/icons/ctx-more.svg +5 -0
  15. package/src/assets/icons/ctx-pen.svg +4 -0
  16. package/src/assets/icons/open-envelope.svg +6 -0
  17. package/src/assets/scss/expansion.scss +5 -0
  18. package/src/assets/scss/icons.scss +63 -0
  19. package/src/assets/scss/input.scss +5 -5
  20. package/src/locales/en.json +16 -1
  21. package/src/locales/ru.json +17 -2
  22. package/src/locales/uk.json +16 -1
package/index.js CHANGED
@@ -7,7 +7,6 @@ import './src/assets/scss/index.scss'
7
7
  // Components
8
8
  export { default as FHtmlContent } from './src/FHtmlContent.vue'
9
9
  export { default as FAvatar } from './src/FAvatar.vue'
10
- export { default as FConfirmModal } from './src/FConfirmModal.vue'
11
10
  export { default as FPreLoader } from './src/FPreLoader.vue'
12
11
  export { default as FNoData } from './src/FNoData.vue'
13
12
  export { default as FNotify } from './src/FNotify.vue'
@@ -15,6 +14,7 @@ export { default as FShare } from './src/FShare.vue'
15
14
  export { default as FContextMenu } from './src/FContextMenu.vue'
16
15
  export { default as FSearchPanel } from './src/FSearchPanel.vue'
17
16
  export { default as FDialog } from './src/FDialog.vue'
17
+ export { default as FConfirmDialog } from './src/FConfirmDialog.vue'
18
18
  export { default as FToolbar } from './src/f-toolbar/FToolbar.vue'
19
19
  export { default as FTabPanel } from './src/f-toolbar/FTabPanel.vue'
20
20
  export { default as FViewerPanel } from './src/f-toolbar/FViewerPanel.vue'
@@ -26,6 +26,7 @@ export { default as FDatePicker } from './src/f-date-picker/FDatePicker.vue'
26
26
  export { default as FMenuDatePicker } from './src/f-date-picker/FMenuDatePicker.vue'
27
27
  export { default as FTextFieldDate } from './src/f-date-picker/FTextFieldDate.vue'
28
28
  export { default as FUserGroupPicker } from './src/FUserGroupPicker.vue'
29
+ export { default as FLangSwitcher } from './src/FLangSwitcher.vue'
29
30
 
30
31
  // Utils
31
32
  export { hexToRGBA, createRadialGradient } from './src/utils/color.js'
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "type": "module",
3
3
  "name": "@it-enterprise/forcebpm-ui-kit",
4
- "version": "1.0.2-beta.27",
4
+ "version": "1.0.2-beta.29",
5
5
  "description": "FBPM UI Kit",
6
6
  "author": "it-enterprise",
7
7
  "license": "MIT",
package/src/{FConfirmModal.vue → FConfirmDialog.vue} RENAMED
@@ -1,24 +1,30 @@
1
1
  <script setup>
2
- // FConfirmModal
2
+ // FConfirmDialog
3
3
  import { onBeforeMount, onBeforeUnmount, ref, inject } from 'vue'
4
4
 
5
- const show = ref(false)
5
+ const props = defineProps({
6
+ name: {
7
+ type: String,
8
+ default: 'confirm-dialog'
9
+ }
10
+ })
11
+
12
+ const state = ref(false)
6
13
  const loading = ref(false)
7
14
  const title = ref('')
8
15
  const subTitle = ref('')
9
16
  const approve = ref(null)
10
- const decline = ref(null)
17
+ const reject = ref(null)
11
18
 
12
19
  // Inject emitter and events from plugin
13
20
  const emitter = inject('fbpm-emitter', null)
14
- const events = inject('fbpm-events', {})
15
21
 
16
- const showModal = props => {
22
+ const open = props => {
17
23
  title.value = props.title
18
24
  subTitle.value = props.subTitle
19
25
  approve.value = props.approve
20
- decline.value = props.decline
21
- show.value = true
26
+ reject.value = props.reject
27
+ state.value = true
22
28
  }
23
29
 
24
30
  const approveHandler = async () => {
@@ -27,42 +33,42 @@ const approveHandler = async () => {
27
33
  await approve.value()
28
34
  }
29
35
  loading.value = false
30
- show.value = false
36
+ state.value = false
31
37
  }
32
38
 
33
- const declineHandler = () => {
34
- if (typeof decline.value === 'function') {
35
- decline.value()
39
+ const rejectHandler = () => {
40
+ if (typeof reject.value === 'function') {
41
+ reject.value()
36
42
  }
37
- show.value = false
43
+ state.value = false
38
44
  }
39
45
 
40
46
  onBeforeMount(() => {
41
- if (emitter && events.confirmModal) {
42
- emitter.on(events.confirmModal, showModal)
47
+ if (emitter && props.name) {
48
+ emitter.on(props.name, open)
43
49
  }
44
50
  })
45
51
 
46
52
  onBeforeUnmount(() => {
47
- if (emitter && events.confirmModal) {
48
- emitter.off(events.confirmModal, showModal)
53
+ if (emitter && props.name) {
54
+ emitter.off(props.name, open)
49
55
  }
50
56
  })
51
57
  </script>
52
58
  <template>
53
- <v-dialog v-model="show" content-class="f-confirm-modal" max-width="500" persistent @keydown.esc="declineHandler" @keydown.enter="approveHandler">
59
+ <v-dialog v-model="state" content-class="f-confirm-dialog" max-width="500" persistent @keydown.esc="rejectHandler" @keydown.enter="approveHandler">
54
60
  <!-- Header -->
55
- <div class="f-confirm-modal-header">{{ title }}</div>
61
+ <div class="f-confirm-dialog-header">{{ title }}</div>
56
62
 
57
63
  <!-- Body -->
58
64
  <div class="d-flex flex-column">
59
- <div class="f-confirm-modal-content mt-5 mx-5 mb-10">{{ subTitle }}</div>
65
+ <div class="f-confirm-dialog-content mt-5 mx-5 mb-10">{{ subTitle }}</div>
60
66
 
61
67
  <!-- Actions -->
62
- <v-btn class="f-confirm-modal-btn" variant="outlined" :disabled="loading" @click="declineHandler">
68
+ <v-btn class="f-confirm-dialog-btn" variant="outlined" :disabled="loading" @click="rejectHandler">
63
69
  {{ $t('buttons.no') }}
64
70
  </v-btn>
65
- <v-btn class="f-confirm-modal-btn mt-2 mb-10" :loading="loading" @click="approveHandler">
71
+ <v-btn class="f-confirm-dialog-btn mt-2 mb-10" :loading="loading" @click="approveHandler">
66
72
  {{ $t('buttons.yes') }}
67
73
  </v-btn>
68
74
  </div>
@@ -70,14 +76,14 @@ onBeforeUnmount(() => {
70
76
  </template>
71
77
 
72
78
  <style lang="scss" scoped>
73
- :deep(.f-confirm-modal) {
79
+ :deep(.f-confirm-dialog) {
74
80
  background: rgb(var(--v-theme-background));
75
81
  box-shadow: 0px 4px 20px 0px rgb(var(--v-theme-title));
76
82
  border-radius: 5.8px;
77
83
  display: flex;
78
84
  flex-direction: column;
79
85
  max-height: 90vh;
80
- .f-confirm-modal-header {
86
+ .f-confirm-dialog-header {
81
87
  display: flex;
82
88
  justify-content: space-between;
83
89
  background: rgb(var(--v-theme-background-dark));
@@ -89,20 +95,20 @@ onBeforeUnmount(() => {
89
95
  color: rgb(var(--v-theme-fields-light));
90
96
  padding: 12px 0px 10px 20px;
91
97
  }
92
- .f-confirm-modal-content {
98
+ .f-confirm-dialog-content {
93
99
  font-size: 1em;
94
100
  line-height: 1.5em;
95
101
  color: rgb(var(--v-theme-title));
96
102
  }
97
- .f-confirm-modal-btn {
103
+ .f-confirm-dialog-btn {
98
104
  margin: 0 34px;
99
105
  }
100
106
  }
101
107
 
102
108
  .v-theme--dark {
103
- :deep(.f-confirm-modal) {
109
+ :deep(.f-confirm-dialog) {
104
110
  box-shadow: var(--f-box-shadow);
105
- .f-confirm-modal-header {
111
+ .f-confirm-dialog-header {
106
112
  border-bottom: 1px solid rgb(var(--v-theme-line));
107
113
  }
108
114
  }
package/src/FDialog.vue CHANGED
@@ -211,8 +211,6 @@ watch(modelValue, val => {
211
211
  border-top-right-radius: 5px;
212
212
 
213
213
  .f-dialog-header-title {
214
- font-size: 1.15em;
215
- line-height: 1.25em;
216
214
  font-weight: 600;
217
215
  color: rgb(var(--v-theme-fields-light));
218
216
  padding: 12px 0px 10px 20px;
package/src/FLangSwitcher.vue ADDED
@@ -0,0 +1,47 @@
1
+ <script setup>
2
+ // FLangSwitcher
3
+ import { computed } from 'vue'
4
+ import { useI18n } from 'vue-i18n'
5
+
6
+ defineProps({
7
+ background: {
8
+ type: String,
9
+ default: 'transparent'
10
+ },
11
+ color: {
12
+ type: String,
13
+ default: 'text'
14
+ }
15
+ })
16
+
17
+ const emit = defineEmits(['change'])
18
+
19
+ const { locale } = useI18n()
20
+
21
+ const locales = [
22
+ { code: 'uk', name: 'Українська', flag: 'UA' },
23
+ { code: 'ru', name: 'Русский', flag: 'RU' },
24
+ { code: 'en', name: 'English', flag: 'EN' }
25
+ ]
26
+
27
+ const lang = computed(() => {
28
+ return locales.find(i => i.code === locale.value) || locales[0]
29
+ })
30
+ </script>
31
+
32
+ <template>
33
+ <v-menu offset="0, -6" location="bottom right" content-class="f-lang-switcher-content">
34
+ <template #activator="{ props }">
35
+ <v-btn v-bind="props" variant="text" height="32px" width="54px" class="pa-0 f-lang-switcher-btn" :class="`bg-${background}`" :color="color">
36
+ {{ lang.flag }}
37
+ <FIcon icon="chevron-down" :color="color" size="0.9em" />
38
+ </v-btn>
39
+ </template>
40
+
41
+ <v-list>
42
+ <v-list-item v-for="item in locales" :key="item.code" @click="emit('change', item.code)">
43
+ <v-list-item-title :class="item.code === lang.code ? 'text-primary' : `text-${color}`"> {{ item.flag }} ({{ item.name }}) </v-list-item-title>
44
+ </v-list-item>
45
+ </v-list>
46
+ </v-menu>
47
+ </template>
package/src/FNotify.vue CHANGED
@@ -146,7 +146,7 @@ watch(
146
146
  <div class="icon" :class="`bg-${nf.color || 'secondary'}`">
147
147
  <span v-if="nf.color === 'secondary' || nf.color === undefined" class="simple-icon">i</span>
148
148
  <FIcon v-if="nf.color === 'success' || nf.color === 'primary'" icon="check" size="16" color="white" />
149
- <span v-if="nf.color === 'info'" class="info-icon">!</span>
149
+ <span v-if="nf.color === 'info' || nf.color === 'warning'" class="info-icon">!</span>
150
150
  <FIcon v-if="nf.color === 'error' || nf.color === 'danger'" icon="times" size="16" color="white" />
151
151
  </div>
152
152
 
package/src/FPreLoader.vue CHANGED
@@ -9,9 +9,9 @@ const props = defineProps({
9
9
  </script>
10
10
 
11
11
  <template>
12
- <v-overlay :model-value="!!props.preLoaders.length" z-index="208" opacity="0.5" class="f-preloader">
12
+ <v-overlay :model-value="!!props.preLoaders.length" persistent z-index="1005" opacity="0.5" class="f-preloader">
13
13
  <div v-if="props.preLoaders.includes('tokenUpdate')" class="text-title">
14
- {{ $t('updating') }}
14
+ {{ $t('tokenRefresh') }}
15
15
  </div>
16
16
  <div class="f-preloader-lds-ellipsis">
17
17
  <div></div>
package/src/assets/icons/check.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="17" height="14" viewBox="0 0 17 14" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path opacity="0.99" d="M4.84439 10.5289L1.3876 7.04835L0.696241 7.74447L0.00488281 8.44059L4.84439 13.3162L16.0049 2.07608L14.6222 0.683838L4.84439 10.5289Z" fill="white"/>
3
+ </svg>
package/src/assets/icons/color-radio-active.svg ADDED
@@ -0,0 +1,4 @@
1
+ <svg width="22" height="23" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <rect x="3.66602" y="4.29395" width="14.6667" height="14.6667" rx="7.33333" fill="#97B960"/>
3
+ <rect x="1" y="1.62695" width="20" height="20" rx="10" stroke="#97B960" stroke-width="2"/>
4
+ </svg>
package/src/assets/icons/color-radio.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <rect y="0.626953" width="20" height="20" rx="10" fill="#75A3FF"/>
3
+ </svg>
package/src/assets/icons/ctx-arrow.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M13.7838 7.13658L10.8598 4.21257C10.7228 4.07642 10.5375 4 10.3444 4C10.1513 4 9.96601 4.07642 9.82904 4.21257C9.76053 4.28053 9.70615 4.36138 9.66903 4.45046C9.63192 4.53954 9.61281 4.63508 9.61281 4.73158C9.61281 4.82808 9.63192 4.92363 9.66903 5.01271C9.70615 5.10179 9.76053 5.18264 9.82904 5.25059L11.503 6.92459H2.731C2.53713 6.92459 2.3512 7.00161 2.21411 7.1387C2.07702 7.27579 2 7.46172 2 7.6556C2 7.84947 2.07702 8.0354 2.21411 8.17249C2.3512 8.30958 2.53713 8.3866 2.731 8.3866H11.503L9.82904 10.0606C9.76053 10.1286 9.70615 10.2094 9.66903 10.2985C9.63192 10.3876 9.61281 10.4831 9.61281 10.5796C9.61281 10.6761 9.63192 10.7717 9.66903 10.8607C9.70615 10.9498 9.76053 11.0307 9.82904 11.0986C9.89735 11.1664 9.97836 11.22 10.0674 11.2563C10.1565 11.2927 10.2519 11.3112 10.3481 11.3106C10.5398 11.3098 10.7236 11.2337 10.8598 11.0986L13.7838 8.17461C13.8523 8.10665 13.9067 8.0258 13.9438 7.93672C13.9809 7.84764 14 7.7521 14 7.6556C14 7.55909 13.9809 7.46355 13.9438 7.37447C13.9067 7.28539 13.8523 7.20454 13.7838 7.13658Z" fill="#F1BF45"/>
3
+ </svg>
package/src/assets/icons/ctx-delete.svg ADDED
@@ -0,0 +1,6 @@
1
+ <svg width="13" height="14" viewBox="0 0 13 14" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M1 3.32383H1.9471L2.69091 13.0077L2.698 13.1H2.79061H10.213H10.3056L10.3127 13.0077L11.0565 3.32383H12.1625H12.2625V3.22383V2.63177V2.53177H12.1625H8.5657V1V0.9H8.4657H4.52347H4.42347V1V2.53177H1H0.9V2.63177V3.22383V3.32383H1ZM6.88932 4.76904V4.66904H6.78932H6.19727H6.09727V4.76904V10.8773V10.9773H6.19727H6.78932H6.88932V10.8773V4.76904ZM8.83946 4.78048L8.84487 4.68063L8.74502 4.67522L8.15385 4.64319L8.05399 4.63778L8.04858 4.73763L7.71733 10.8512L7.71192 10.951L7.81178 10.9565L8.40295 10.9885L8.5028 10.9939L8.50821 10.894L8.83946 4.78048ZM5.16273 10.9587L5.26259 10.9532L5.25718 10.8534L4.92603 4.73983L4.92062 4.63998L4.82076 4.64539L4.22959 4.67741L4.12974 4.68282L4.13515 4.78267L4.4663 10.8962L4.47171 10.9961L4.57156 10.9907L5.16273 10.9587ZM7.78809 1.67762V2.51733H5.21552V1.67762H7.78809ZM3.41765 12.2791L2.7396 3.29495H10.2638L9.57167 12.2791H3.41765Z" fill="#EFEFEF"/>
3
+ <path d="M1 3.32383H1.9471L2.69091 13.0077L2.698 13.1H2.79061H10.213H10.3056L10.3127 13.0077L11.0565 3.32383H12.1625H12.2625V3.22383V2.63177V2.53177H12.1625H8.5657V1V0.9H8.4657H4.52347H4.42347V1V2.53177H1H0.9V2.63177V3.22383V3.32383H1ZM6.88932 4.76904V4.66904H6.78932H6.19727H6.09727V4.76904V10.8773V10.9773H6.19727H6.78932H6.88932V10.8773V4.76904ZM8.83946 4.78048L8.84487 4.68063L8.74502 4.67522L8.15385 4.64319L8.05399 4.63778L8.04858 4.73763L7.71733 10.8512L7.71192 10.951L7.81178 10.9565L8.40295 10.9885L8.5028 10.9939L8.50821 10.894L8.83946 4.78048ZM5.16273 10.9587L5.26259 10.9532L5.25718 10.8534L4.92603 4.73983L4.92062 4.63998L4.82076 4.64539L4.22959 4.67741L4.12974 4.68282L4.13515 4.78267L4.4663 10.8962L4.47171 10.9961L4.57156 10.9907L5.16273 10.9587ZM7.78809 1.67762V2.51733H5.21552V1.67762H7.78809ZM3.41765 12.2791L2.7396 3.29495H10.2638L9.57167 12.2791H3.41765Z" fill="#888EA4"/>
4
+ <path d="M1 3.32383H1.9471L2.69091 13.0077L2.698 13.1H2.79061H10.213H10.3056L10.3127 13.0077L11.0565 3.32383H12.1625H12.2625V3.22383V2.63177V2.53177H12.1625H8.5657V1V0.9H8.4657H4.52347H4.42347V1V2.53177H1H0.9V2.63177V3.22383V3.32383H1ZM6.88932 4.76904V4.66904H6.78932H6.19727H6.09727V4.76904V10.8773V10.9773H6.19727H6.78932H6.88932V10.8773V4.76904ZM8.83946 4.78048L8.84487 4.68063L8.74502 4.67522L8.15385 4.64319L8.05399 4.63778L8.04858 4.73763L7.71733 10.8512L7.71192 10.951L7.81178 10.9565L8.40295 10.9885L8.5028 10.9939L8.50821 10.894L8.83946 4.78048ZM5.16273 10.9587L5.26259 10.9532L5.25718 10.8534L4.92603 4.73983L4.92062 4.63998L4.82076 4.64539L4.22959 4.67741L4.12974 4.68282L4.13515 4.78267L4.4663 10.8962L4.47171 10.9961L4.57156 10.9907L5.16273 10.9587ZM7.78809 1.67762V2.51733H5.21552V1.67762H7.78809ZM3.41765 12.2791L2.7396 3.29495H10.2638L9.57167 12.2791H3.41765Z" stroke="#EFEFEF" stroke-width="0.2"/>
5
+ <path d="M1 3.32383H1.9471L2.69091 13.0077L2.698 13.1H2.79061H10.213H10.3056L10.3127 13.0077L11.0565 3.32383H12.1625H12.2625V3.22383V2.63177V2.53177H12.1625H8.5657V1V0.9H8.4657H4.52347H4.42347V1V2.53177H1H0.9V2.63177V3.22383V3.32383H1ZM6.88932 4.76904V4.66904H6.78932H6.19727H6.09727V4.76904V10.8773V10.9773H6.19727H6.78932H6.88932V10.8773V4.76904ZM8.83946 4.78048L8.84487 4.68063L8.74502 4.67522L8.15385 4.64319L8.05399 4.63778L8.04858 4.73763L7.71733 10.8512L7.71192 10.951L7.81178 10.9565L8.40295 10.9885L8.5028 10.9939L8.50821 10.894L8.83946 4.78048ZM5.16273 10.9587L5.26259 10.9532L5.25718 10.8534L4.92603 4.73983L4.92062 4.63998L4.82076 4.64539L4.22959 4.67741L4.12974 4.68282L4.13515 4.78267L4.4663 10.8962L4.47171 10.9961L4.57156 10.9907L5.16273 10.9587ZM7.78809 1.67762V2.51733H5.21552V1.67762H7.78809ZM3.41765 12.2791L2.7396 3.29495H10.2638L9.57167 12.2791H3.41765Z" stroke="#888EA4" stroke-width="0.2"/>
6
+ </svg>
package/src/assets/icons/ctx-link.svg ADDED
@@ -0,0 +1,5 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="800px" height="800px" viewBox="0 0 24 24" fill="none">
2
+ <g id="Interface / External_Link">
3
+ <path id="Vector" d="M10.0002 5H8.2002C7.08009 5 6.51962 5 6.0918 5.21799C5.71547 5.40973 5.40973 5.71547 5.21799 6.0918C5 6.51962 5 7.08009 5 8.2002V15.8002C5 16.9203 5 17.4801 5.21799 17.9079C5.40973 18.2842 5.71547 18.5905 6.0918 18.7822C6.5192 19 7.07899 19 8.19691 19H15.8031C16.921 19 17.48 19 17.9074 18.7822C18.2837 18.5905 18.5905 18.2839 18.7822 17.9076C19 17.4802 19 16.921 19 15.8031V14M20 9V4M20 4H15M20 4L13 11" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </g>
5
+ </svg>
package/src/assets/icons/ctx-more.svg ADDED
@@ -0,0 +1,5 @@
1
+ <svg width="12" height="3" viewBox="0 0 12 3" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <circle cx="1.05882" cy="1.05882" r="1.05882" fill="#888EA4"/>
3
+ <circle cx="6.00023" cy="1.05882" r="1.05882" fill="#888EA4"/>
4
+ <circle cx="10.9416" cy="1.05882" r="1.05882" fill="#888EA4"/>
5
+ </svg>
package/src/assets/icons/ctx-pen.svg ADDED
@@ -0,0 +1,4 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M13.3655 2.63436C12.9562 2.22527 12.4122 2 11.8335 2C11.2547 2 10.7107 2.22527 10.3015 2.63454L2.3942 10.5416C2.33529 10.6005 2.29838 10.6778 2.28965 10.7607L2.00202 13.49C1.99074 13.5963 2.02711 13.7023 2.10111 13.7798C2.16984 13.8516 2.26474 13.8918 2.36347 13.8918C2.37111 13.8918 2.37874 13.8916 2.38638 13.8911L5.22401 13.7118C5.31238 13.7062 5.39565 13.6685 5.45819 13.606L13.3653 5.6989C13.7745 5.28981 14 4.74563 14 4.16672C14.0002 3.58782 13.7747 3.04363 13.3655 2.63436ZM5.04129 12.9943L2.77038 13.1378L2.99929 10.9647L9.81055 4.15363L11.8464 6.18927L5.04129 12.9943ZM12.8513 5.18454L12.3605 5.67527L10.3247 3.63945L10.8155 3.14873C11.0875 2.87691 11.4489 2.72727 11.8333 2.72727C12.2178 2.72727 12.5793 2.87691 12.8511 3.14873C13.1229 3.42073 13.2727 3.78218 13.2727 4.16672C13.2729 4.55109 13.1231 4.91254 12.8513 5.18454Z" fill="#EFEFEF"/>
3
+ <path d="M13.3655 2.63436C12.9562 2.22527 12.4122 2 11.8335 2C11.2547 2 10.7107 2.22527 10.3015 2.63454L2.3942 10.5416C2.33529 10.6005 2.29838 10.6778 2.28965 10.7607L2.00202 13.49C1.99074 13.5963 2.02711 13.7023 2.10111 13.7798C2.16984 13.8516 2.26474 13.8918 2.36347 13.8918C2.37111 13.8918 2.37874 13.8916 2.38638 13.8911L5.22401 13.7118C5.31238 13.7062 5.39565 13.6685 5.45819 13.606L13.3653 5.6989C13.7745 5.28981 14 4.74563 14 4.16672C14.0002 3.58782 13.7747 3.04363 13.3655 2.63436ZM5.04129 12.9943L2.77038 13.1378L2.99929 10.9647L9.81055 4.15363L11.8464 6.18927L5.04129 12.9943ZM12.8513 5.18454L12.3605 5.67527L10.3247 3.63945L10.8155 3.14873C11.0875 2.87691 11.4489 2.72727 11.8333 2.72727C12.2178 2.72727 12.5793 2.87691 12.8511 3.14873C13.1229 3.42073 13.2727 3.78218 13.2727 4.16672C13.2729 4.55109 13.1231 4.91254 12.8513 5.18454Z" fill="#888EA4"/>
4
+ </svg>
package/src/assets/icons/open-envelope.svg ADDED
@@ -0,0 +1,6 @@
1
+ <svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M13.0526 15.5368C13.0526 15.6942 13.0636 15.8488 13.0847 16L15.1547 16C15.7863 16 16.2916 15.4947 16.2916 14.8632V12.2116C16.0147 12.2186 15.7468 12.2585 15.4916 12.3276V14.8632C15.4916 14.9895 15.4074 15.1158 15.2389 15.1158L13.0784 15.1158C13.0614 15.2536 13.0526 15.3941 13.0526 15.5368Z" fill="#888EA4"/>
3
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M15.1258 5.1857C15.3244 5.32168 15.4429 5.51043 15.4811 5.70932C15.4468 5.48217 15.3283 5.29237 15.1258 5.1857Z" fill="#888EA4"/>
4
+ <path d="M16.2916 12.2116L16.3368 5.85263C16.3368 5.30526 16.0421 4.75789 15.5789 4.46316L9.05263 0.252631C8.50526 -0.0842105 7.83157 -0.0842105 7.28421 0.252631L0.757894 4.46316C0.294737 4.75789 0 5.30526 0 5.85263V14.8632C0 15.4947 0.505263 16 1.13684 16L13.0847 16C13.0636 15.8488 13.0526 15.6942 13.0526 15.5368C13.0526 15.3941 13.0614 15.2536 13.0784 15.1158L1.05263 15.1158C0.88421 15.1158 0.8 14.9895 0.8 14.8632V5.85263C0.8 5.55789 0.926315 5.30526 1.17895 5.17895L7.70526 0.968421C7.95789 0.799999 8.29473 0.799999 8.58947 0.968421L15.1158 5.17895L15.1258 5.1857C15.3283 5.29237 15.4468 5.48217 15.4811 5.70932C15.4902 5.75671 15.4947 5.80467 15.4947 5.85263V11.4947L15.4916 11.4954V12.3276C15.7468 12.2585 16.0147 12.2186 16.2916 12.2116Z" fill="#888EA4"/>
5
+ <path d="M13.8521 5.60005C14.0205 5.47374 14.0626 5.179 13.9363 5.01058C13.81 4.84216 13.5153 4.80005 13.3468 4.92637L8.54685 8.54742C8.29422 8.71584 7.99948 8.71584 7.74685 8.54742L2.90475 4.92637C2.73633 4.80005 2.44159 4.84216 2.31527 5.01058C2.18896 5.179 2.23106 5.47374 2.39948 5.60005L7.24159 9.2211C7.49422 9.43163 7.83106 9.51584 8.1258 9.51584C8.42053 9.51584 8.75737 9.43163 9.01001 9.2211L13.8521 5.60005Z" fill="#888EA4"/>
6
+ </svg>
package/src/assets/scss/expansion.scss CHANGED
@@ -18,6 +18,11 @@
18
18
  font-size: 1em;
19
19
  padding: 15px 12px 10px 4px;
20
20
  color: var(--v-theme-title);
21
+ &:focus-visible {
22
+ .v-expansion-panel-title__overlay {
23
+ opacity: 0;
24
+ }
25
+ }
21
26
  &:hover {
22
27
  .v-expansion-panel-title__overlay {
23
28
  opacity: 0;
package/src/assets/scss/icons.scss CHANGED
@@ -71,6 +71,20 @@
71
71
  mask-size: contain;
72
72
  mask-position: center;
73
73
  }
74
+ &.color-radio-active {
75
+ background-color: rgb(var(--v-theme-primary));
76
+ -webkit-mask: url('./../icons/color-radio-active.svg') no-repeat;
77
+ mask: url('./../icons/color-radio-active.svg') no-repeat;
78
+ mask-size: contain;
79
+ mask-position: center;
80
+ }
81
+ &.color-radio {
82
+ background-color: rgb(var(--v-theme-primary));
83
+ -webkit-mask: url('./../icons/color-radio.svg') no-repeat;
84
+ mask: url('./../icons/color-radio.svg') no-repeat;
85
+ mask-size: contain;
86
+ mask-position: center;
87
+ }
74
88
  &.checkbox-true {
75
89
  background-color: rgb(var(--v-theme-primary));
76
90
  -webkit-mask: url('./../icons/checkbox-true.svg') no-repeat;
@@ -85,6 +99,13 @@
85
99
  mask-size: contain;
86
100
  mask-position: center;
87
101
  }
102
+ &.check {
103
+ background-color: rgb(var(--v-theme-primary));
104
+ -webkit-mask: url('./../icons/check.svg') no-repeat;
105
+ mask: url('./../icons/check.svg') no-repeat;
106
+ mask-size: contain;
107
+ mask-position: center;
108
+ }
88
109
  &.times {
89
110
  background-color: rgb(var(--v-theme-primary));
90
111
  -webkit-mask: url('./../icons/times.svg') no-repeat;
@@ -148,6 +169,41 @@
148
169
  height: 18px;
149
170
  width: 5px;
150
171
  }
172
+ &.ctx-link {
173
+ background-color: rgb(var(--v-theme-primary));
174
+ -webkit-mask: url('./../icons/ctx-link.svg') no-repeat;
175
+ mask: url('./../icons/ctx-link.svg') no-repeat;
176
+ mask-size: contain;
177
+ mask-position: center;
178
+ }
179
+ &.ctx-pen {
180
+ background-color: rgb(var(--v-primary-base));
181
+ -webkit-mask: url('./../icons/ctx-pen.svg') no-repeat;
182
+ mask: url('./../icons/ctx-pen.svg') no-repeat;
183
+ mask-size: contain;
184
+ mask-position: center;
185
+ }
186
+ &.ctx-delete {
187
+ background-color: rgb(var(--v-primary-base));
188
+ -webkit-mask: url('./../icons/ctx-delete.svg') no-repeat;
189
+ mask: url('./../icons/ctx-delete.svg') no-repeat;
190
+ mask-size: contain;
191
+ mask-position: center;
192
+ }
193
+ &.ctx-arrow-next {
194
+ background-color: rgb(var(--v-primary-base));
195
+ -webkit-mask: url('./../icons/ctx-arrow.svg') no-repeat;
196
+ mask: url('./../icons/ctx-arrow.svg') no-repeat;
197
+ mask-size: contain;
198
+ mask-position: center;
199
+ }
200
+ &.ctx-more {
201
+ background-color: rgb(var(--v-theme-primary));
202
+ -webkit-mask: url('./../icons/ctx-more.svg') no-repeat;
203
+ mask: url('./../icons/ctx-more.svg') no-repeat;
204
+ mask-size: contain;
205
+ mask-position: center;
206
+ }
151
207
  &.bell {
152
208
  background-color: rgb(var(--v-theme-primary));
153
209
  -webkit-mask: url('./../icons/bell.svg') no-repeat;
@@ -162,6 +218,13 @@
162
218
  mask-size: contain;
163
219
  mask-position: center;
164
220
  }
221
+ &.open-envelope {
222
+ background-color: rgb(var(--v-theme-primary));
223
+ -webkit-mask: url('./../icons/open-envelope.svg') no-repeat;
224
+ mask: url('./../icons/open-envelope.svg') no-repeat;
225
+ mask-size: contain;
226
+ mask-position: center;
227
+ }
165
228
  }
166
229
 
167
230
  @media screen and (max-width: 1280px) {
package/src/assets/scss/input.scss CHANGED
@@ -282,7 +282,7 @@
282
282
  margin-right: 8px;
283
283
  }
284
284
  .v-selection-control__wrapper {
285
- --v-selection-control-size: 16px;
285
+ --v-selection-control-size: 20px;
286
286
  .v-selection-control__input {
287
287
  &::before {
288
288
  content: none;
@@ -322,7 +322,7 @@
322
322
  .v-selection-control__wrapper {
323
323
  margin-right: 8px;
324
324
  .v-switch__track {
325
- height: 24px;
325
+ height: var(--v-selection-control-size);
326
326
  min-width: 40px;
327
327
  background: rgb(var(--v-theme-disabled));
328
328
  opacity: 1;
@@ -333,9 +333,9 @@
333
333
  }
334
334
  .v-switch__thumb {
335
335
  background: #fff;
336
- transform: scale(1);
337
- height: 20px;
338
- width: 20px;
336
+ transform: scale(0.8);
337
+ height: var(--v-selection-control-size);
338
+ width: var(--v-selection-control-size);
339
339
  }
340
340
  }
341
341
  }
package/src/locales/en.json CHANGED
@@ -1,4 +1,5 @@
1
1
  {
2
+ "tokenRefresh": "Session is refreshing... Please wait",
2
3
  "login": {
3
4
  "title": "Sign In",
4
5
  "welcome": "Welcome! Please select a login method",
@@ -65,7 +66,21 @@
65
66
  "allUsers": "All users",
66
67
  "allUsersAndGroups": "All users and groups",
67
68
  "selectGroup": "Select group",
68
- "selectAllFromList": "Select all from list"
69
+ "selectAllFromList": "Select all from list",
70
+ "colorTheme": "Color theme",
71
+ "darkTheme": "Dark theme",
72
+ "version": "Version",
73
+ "delegateRights": "Delegate rights",
74
+ "delegatedRights": "Delegation of rights"
75
+ },
76
+ "notification": {
77
+ "title": "Notifications",
78
+ "unmute": "Enable pop-up notifications",
79
+ "mute": "Disable pop-up notifications",
80
+ "read": "Read",
81
+ "unread": "Unread",
82
+ "markAllAsRead": "Mark all as read",
83
+ "markAsRead": "Mark as read"
69
84
  },
70
85
  "tooltip": {
71
86
  "actions": "Additional actions",
package/src/locales/ru.json CHANGED
@@ -1,4 +1,5 @@
1
1
  {
2
+ "tokenRefresh": "Сеанс обновляется... Пожалуйста, подождите",
2
3
  "login": {
3
4
  "title": "Вход",
4
5
  "welcome": "Добро пожаловать! Пожалуйста, выберите способ входа в систему",
@@ -13,7 +14,7 @@
13
14
  "loginFail": "Не удалось войти в систему, попробуйте еще раз",
14
15
  "loginError": "Ошибка при попытке входа в систему, обратитесь в поддержку",
15
16
  "forgotPassword": "Забыли пароль?",
16
- "errorLoginOrPass": "Не верный логин или пароль",
17
+ "errorLoginOrPass": "Неверный логин или пароль",
17
18
  "loginConfirmation": "Подтверждение входа",
18
19
  "confirmationCode": "Код подтверждения"
19
20
  },
@@ -66,7 +67,21 @@
66
67
  "allUsers": "Все пользователи",
67
68
  "allUsersAndGroups": "Все пользователи и группы",
68
69
  "selectGroup": "Выбрать группу",
69
- "selectAllFromList": "Выбрать всех из списка"
70
+ "selectAllFromList": "Выбрать всех из списка",
71
+ "colorTheme": "Цветовая тема",
72
+ "darkTheme": "Темная тема",
73
+ "version": "Версия",
74
+ "delegateRights": "Делегировать права",
75
+ "delegatedRights": "Делегирование прав"
76
+ },
77
+ "notification": {
78
+ "title": "Уведомления",
79
+ "unmute": "Включить всплывающие уведомления",
80
+ "mute": "Отключить всплывающие уведомления",
81
+ "read": "Прочитанные",
82
+ "unread": "Непрочитанные",
83
+ "markAllAsRead": "Отметить все как прочитанные",
84
+ "markAsRead": "Отметить как прочитанное"
70
85
  },
71
86
  "tooltip": {
72
87
  "actions": "Дополнительные действия",
package/src/locales/uk.json CHANGED
@@ -1,4 +1,5 @@
1
1
  {
2
+ "tokenRefresh": "Сеанс оновлюється... Будь-ласка, зачекайте",
2
3
  "login": {
3
4
  "title": "Вхід",
4
5
  "welcome": "Ласкаво просимо! Будь ласка, виберіть спосіб входу в систему",
@@ -66,7 +67,21 @@
66
67
  "allUsers": "Всі користувачі",
67
68
  "allUsersAndGroups": "Всі користувачі та групи",
68
69
  "selectGroup": "Вибрати групу",
69
- "selectAllFromList": "Вибрати всіх зі списку"
70
+ "selectAllFromList": "Вибрати всіх зі списку",
71
+ "colorTheme": "Кольорова тема",
72
+ "darkTheme": "Темна тема",
73
+ "version": "Версія",
74
+ "delegateRights": "Делегувати права",
75
+ "delegatedRights": "Делегування прав"
76
+ },
77
+ "notification": {
78
+ "title": "Cповіщення",
79
+ "unmute": "Увімкнути спливаючі сповіщення",
80
+ "mute": "Вимкнути спливаючі сповіщення",
81
+ "read": "Прочитані",
82
+ "unread": "Непрочитані",
83
+ "markAllAsRead": "Позначити всі як прочитані",
84
+ "markAsRead": "Позначити як прочитане"
70
85
  },
71
86
  "tooltip": {
72
87
  "actions": "Додаткові дії",