@saooti/octopus-sdk 41.0.16 → 41.0.17
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/CHANGELOG.md +23 -0
- package/eslint.config.mjs +13 -1
- package/package.json +2 -1
- package/src/components/composable/route/useRouteUpdateParams.ts +15 -3
- package/src/components/misc/ClassicHelpButton.vue +49 -25
- package/src/components/misc/ClassicPopover.vue +10 -7
- package/tsconfig.json +39 -39
- package/typings/index.d.ts +0 -1
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
# CHANGELOG
|
|
2
|
+
|
|
3
|
+
## 41.0.17 (07/11/2025)
|
|
4
|
+
|
|
5
|
+
**Features**
|
|
6
|
+
|
|
7
|
+
- Ajout options de configuration sur `ClassicHelpButton`
|
|
8
|
+
|
|
9
|
+
**Fixes**
|
|
10
|
+
|
|
11
|
+
- Correction anomalie fermeture `ClassicPopover`
|
|
12
|
+
|
|
13
|
+
**Misc**
|
|
14
|
+
|
|
15
|
+
- Ajout du `CHANGELOG`
|
|
16
|
+
- Ajustements configuration typescript pour analyse de code
|
|
17
|
+
- Nouvelles règles eslint
|
|
18
|
+
|
|
19
|
+
## 41.0.16 (04/11/2025)
|
|
20
|
+
|
|
21
|
+
- Bannière 'en cours de traitement' ne s'affiche plus dans les listes
|
|
22
|
+
- Ajustements sur `ClassicSelect` & `ClassicHelpButton`
|
|
23
|
+
- Ajout de ClassicAlert, pour l'affichage de message
|
package/eslint.config.mjs
CHANGED
|
@@ -23,9 +23,21 @@ export default typescriptEslint.config(
|
|
|
23
23
|
rules: {
|
|
24
24
|
// your rules
|
|
25
25
|
"curly": ['error'],
|
|
26
|
+
|
|
27
|
+
// Please don't use console statements and duplicated imports, TODOs are marked
|
|
26
28
|
"no-console": ['warn', { allow: ['warn', 'error'] }],
|
|
27
29
|
"no-warning-comments": ['warn'],
|
|
28
|
-
"no-duplicate-imports": ['warn']
|
|
30
|
+
"no-duplicate-imports": ['warn'],
|
|
31
|
+
|
|
32
|
+
// Prevent errors when testing on refs (instead of value of ref)
|
|
33
|
+
"vue/no-ref-as-operand": ['error'],
|
|
34
|
+
|
|
35
|
+
// Indentation
|
|
36
|
+
"vue/html-indent": ['warn', 4],
|
|
37
|
+
"vue/script-indent": ['warn', 4],
|
|
38
|
+
|
|
39
|
+
// Number of attributes per line (increase because sometimes two is not a lot)
|
|
40
|
+
"vue/max-attributes-per-line": ['warn', { singleline: 2 } ]
|
|
29
41
|
},
|
|
30
42
|
}
|
|
31
43
|
);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@saooti/octopus-sdk",
|
|
3
|
-
"version": "41.0.
|
|
3
|
+
"version": "41.0.17",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Javascript SDK for using octopus",
|
|
6
6
|
"author": "Saooti",
|
|
@@ -65,6 +65,7 @@
|
|
|
65
65
|
},
|
|
66
66
|
"devDependencies": {
|
|
67
67
|
"@types/sockjs-client": "^1.5.4",
|
|
68
|
+
"@types/webpack-env": "^1.18.8",
|
|
68
69
|
"@vitejs/plugin-vue": "^5.2.4",
|
|
69
70
|
"eslint": "^9.28.0",
|
|
70
71
|
"eslint-plugin-vue": "^9.33.0",
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
import { useRoute, useRouter } from 'vue-router';
|
|
2
|
-
|
|
2
|
+
|
|
3
|
+
interface RouteParams {
|
|
4
|
+
productor: string;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
export const useRouteUpdateParams = () => {
|
|
3
8
|
|
|
4
9
|
const router = useRouter();
|
|
5
10
|
const route = useRoute();
|
|
@@ -38,11 +43,18 @@ export const useRouteUpdateParams = ()=>{
|
|
|
38
43
|
}
|
|
39
44
|
}
|
|
40
45
|
|
|
46
|
+
/*
|
|
47
|
+
function updateRouteParams(params: Partial<RouteParams>) {
|
|
48
|
+
router.push({ query: {
|
|
49
|
+
...route.query,
|
|
50
|
+
...params
|
|
51
|
+
}});
|
|
52
|
+
}*/
|
|
41
53
|
|
|
42
|
-
|
|
54
|
+
return {
|
|
43
55
|
updatePaginateSize,
|
|
44
56
|
updateRouteParam,
|
|
45
57
|
updateRouteParamAdvanced,
|
|
46
58
|
updateFiltersParam
|
|
47
|
-
|
|
59
|
+
}
|
|
48
60
|
}
|
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
<!--
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
A simple component to display a help button that shows its message when
|
|
3
|
+
hovered.
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
Usage:
|
|
6
|
+
<ClassicHelpButton>This is my help message</ClassicHelpButton>
|
|
7
7
|
-->
|
|
8
8
|
<template>
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
>
|
|
13
|
-
<!-- Button icon -->
|
|
14
|
-
<HelpCircleIcon :size="30" />
|
|
15
|
-
|
|
16
|
-
<!-- Tooltip -->
|
|
17
|
-
<ClassicPopover
|
|
18
|
-
:target="computedId"
|
|
19
|
-
popover-class="help-popover"
|
|
9
|
+
<button
|
|
10
|
+
:id="computedId"
|
|
11
|
+
class="btn-transparent"
|
|
20
12
|
>
|
|
21
|
-
|
|
22
|
-
<
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
13
|
+
<!-- Button icon -->
|
|
14
|
+
<HelpCircleIcon :fill-color="color" :size="iconSize" />
|
|
15
|
+
|
|
16
|
+
<!-- Tooltip -->
|
|
17
|
+
<ClassicPopover
|
|
18
|
+
:target="computedId"
|
|
19
|
+
popover-class="help-popover"
|
|
20
|
+
>
|
|
21
|
+
<div class="content">
|
|
22
|
+
<slot />
|
|
23
|
+
</div>
|
|
24
|
+
</ClassicPopover>
|
|
25
|
+
</button>
|
|
26
26
|
</template>
|
|
27
27
|
|
|
28
28
|
<script setup lang="ts">
|
|
@@ -31,20 +31,44 @@ import { computed, getCurrentInstance } from 'vue';
|
|
|
31
31
|
import HelpCircleIcon from "vue-material-design-icons/HelpCircle.vue";
|
|
32
32
|
import ClassicPopover from './ClassicPopover.vue';
|
|
33
33
|
|
|
34
|
+
const { colored, small } = defineProps<{
|
|
35
|
+
colored?: boolean;
|
|
36
|
+
/** Make the icon smaller if true *(default: false)* */
|
|
37
|
+
small?: boolean;
|
|
38
|
+
}>();
|
|
39
|
+
|
|
40
|
+
/** The color to use for the icon */
|
|
41
|
+
const color = computed(() => {
|
|
42
|
+
if (colored) {
|
|
43
|
+
return "var(--octopus-primary-darker)";
|
|
44
|
+
} else {
|
|
45
|
+
return "black";
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
|
|
34
49
|
/** The internal ID for the elements */
|
|
35
50
|
const computedId = computed(() => {
|
|
36
|
-
|
|
51
|
+
return 'popover-' + getCurrentInstance()?.uid;
|
|
52
|
+
});
|
|
53
|
+
|
|
54
|
+
/** The size of the icon, according to the props */
|
|
55
|
+
const iconSize = computed(() => {
|
|
56
|
+
if (small) {
|
|
57
|
+
return 24;
|
|
58
|
+
} else {
|
|
59
|
+
return 30;
|
|
60
|
+
}
|
|
37
61
|
});
|
|
38
62
|
</script>
|
|
39
63
|
|
|
40
64
|
<style lang="scss" scoped>
|
|
41
65
|
.content {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
66
|
+
font: revert;
|
|
67
|
+
font-size: 18px !important;
|
|
68
|
+
text-align: start;
|
|
45
69
|
}
|
|
46
70
|
|
|
47
71
|
.help-popover {
|
|
48
|
-
|
|
72
|
+
background-color: var(--octopus-secondary-lighter);
|
|
49
73
|
}
|
|
50
74
|
</style>
|
|
@@ -12,7 +12,6 @@
|
|
|
12
12
|
isFixed && isTopLayerPopover ? 'position-fixed':'position-absolute',
|
|
13
13
|
popoverClass]"
|
|
14
14
|
:style="positionInlineStyle"
|
|
15
|
-
@focusout="clearDataBlur"
|
|
16
15
|
@mouseenter="overPopover = true"
|
|
17
16
|
@mouseleave="
|
|
18
17
|
overPopover = false;
|
|
@@ -139,8 +138,8 @@ function removeListeners() {
|
|
|
139
138
|
targetElement.value.removeEventListener("focusout", clearDataBlur);
|
|
140
139
|
}
|
|
141
140
|
}
|
|
142
|
-
function handleClickEvent(){
|
|
143
|
-
if (show.value && isClick.value) {
|
|
141
|
+
function handleClickEvent(e: MouseEvent | PointerEvent){
|
|
142
|
+
if (show.value && isClick.value && e.target !== popoverRef.value && !popoverRef.value?.contains(e.target)) {
|
|
144
143
|
isClick.value = false;
|
|
145
144
|
clearData();
|
|
146
145
|
return -1;
|
|
@@ -180,7 +179,7 @@ function setPopoverData(e: MouseEvent | PointerEvent) {
|
|
|
180
179
|
if (props.disable || !e || !e.target) {
|
|
181
180
|
return;
|
|
182
181
|
}
|
|
183
|
-
if ("click" === e.type && -1 === handleClickEvent()) {
|
|
182
|
+
if ("click" === e.type && -1 === handleClickEvent(e)) {
|
|
184
183
|
return;
|
|
185
184
|
}
|
|
186
185
|
show.value = true;
|
|
@@ -235,6 +234,7 @@ function setPopoverData(e: MouseEvent | PointerEvent) {
|
|
|
235
234
|
maxHeight.value = '80dvh';
|
|
236
235
|
}
|
|
237
236
|
}
|
|
237
|
+
|
|
238
238
|
function clearDataBlur(e: FocusEvent) {
|
|
239
239
|
if (isTabAction.value) {
|
|
240
240
|
isTabAction.value = false;
|
|
@@ -245,14 +245,18 @@ function clearDataBlur(e: FocusEvent) {
|
|
|
245
245
|
if (-1!==result) {
|
|
246
246
|
return;
|
|
247
247
|
}
|
|
248
|
+
|
|
249
|
+
const parent = popoverRef?.value as HTMLElement;
|
|
248
250
|
if (!e.relatedTarget) {
|
|
251
|
+
if (parent !== null && parent.contains(e.target)) {
|
|
252
|
+
return;
|
|
253
|
+
}
|
|
249
254
|
return clearClick();
|
|
250
255
|
}
|
|
251
256
|
const myElement = e.relatedTarget as HTMLElement;
|
|
252
257
|
if (popoverId.value === myElement.id) {
|
|
253
258
|
return;
|
|
254
259
|
}
|
|
255
|
-
const parent =popoverRef?.value as HTMLElement;
|
|
256
260
|
if (null === parent || !parent.contains(myElement)) {
|
|
257
261
|
return clearClick();
|
|
258
262
|
}
|
|
@@ -301,9 +305,8 @@ defineExpose({
|
|
|
301
305
|
clearClick
|
|
302
306
|
});
|
|
303
307
|
</script>
|
|
304
|
-
<style lang="scss">
|
|
305
|
-
|
|
306
308
|
|
|
309
|
+
<style lang="scss">
|
|
307
310
|
.octopus-popover {
|
|
308
311
|
background: var(--octopus-background);
|
|
309
312
|
border-radius: var(--octopus-border-radius);
|
package/tsconfig.json
CHANGED
|
@@ -1,43 +1,43 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "esnext",
|
|
4
|
+
"module": "esnext",
|
|
5
|
+
// "strict": true,
|
|
6
|
+
"jsx": "preserve",
|
|
7
|
+
"importHelpers": true,
|
|
8
|
+
"moduleResolution": "node",
|
|
9
|
+
"experimentalDecorators": true,
|
|
10
|
+
"skipLibCheck": true,
|
|
11
|
+
"esModuleInterop": true,
|
|
12
|
+
"allowSyntheticDefaultImports": true,
|
|
13
|
+
"sourceMap": true,
|
|
14
|
+
"baseUrl": ".",
|
|
15
|
+
"types": [
|
|
16
|
+
"webpack-env", "sockjs-client"
|
|
17
|
+
],
|
|
18
|
+
"paths": {
|
|
19
|
+
"@/*": [
|
|
20
|
+
"./src/*"
|
|
21
|
+
]
|
|
22
|
+
},
|
|
23
|
+
"lib": [
|
|
24
|
+
"esnext",
|
|
25
|
+
"dom",
|
|
26
|
+
"dom.iterable",
|
|
27
|
+
"scripthost"
|
|
28
|
+
]
|
|
22
29
|
},
|
|
23
|
-
"
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
30
|
+
"include": [
|
|
31
|
+
"src/**/*.ts",
|
|
32
|
+
"src/**/*.tsx",
|
|
33
|
+
"src/**/*.vue",
|
|
34
|
+
"tests/**/*.ts",
|
|
35
|
+
"tests/**/*.tsx"
|
|
36
|
+
],
|
|
37
|
+
"exclude": [
|
|
38
|
+
"node_modules"
|
|
39
|
+
],
|
|
40
|
+
"files": [
|
|
41
|
+
"src/shims-vue.d.ts"
|
|
28
42
|
]
|
|
29
|
-
},
|
|
30
|
-
"include": [
|
|
31
|
-
"src/**/*.ts",
|
|
32
|
-
"src/**/*.tsx",
|
|
33
|
-
"src/**/*.vue",
|
|
34
|
-
"tests/**/*.ts",
|
|
35
|
-
"tests/**/*.tsx"
|
|
36
|
-
],
|
|
37
|
-
"exclude": [
|
|
38
|
-
"node_modules"
|
|
39
|
-
],
|
|
40
|
-
"files": [
|
|
41
|
-
"src/shims-vue.d.ts",
|
|
42
|
-
]
|
|
43
43
|
}
|
package/typings/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
declare module 'sockjs-client/dist/sockjs';
|