@tekkare/auriga 0.2.154 → 0.2.156
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/dist/module.json
CHANGED
|
@@ -74,12 +74,15 @@ export default defineComponent({
|
|
|
74
74
|
validator: (value) => {
|
|
75
75
|
return ["en", "fr", "es", "jp", "kr"].includes(value);
|
|
76
76
|
}
|
|
77
|
+
},
|
|
78
|
+
autoOpen: {
|
|
79
|
+
type: Boolean,
|
|
80
|
+
default: true
|
|
77
81
|
}
|
|
78
82
|
},
|
|
79
83
|
emits: ["clearFilters", "saveScope"],
|
|
80
84
|
setup(props, { emit }) {
|
|
81
85
|
const filtersOpen = ref(null);
|
|
82
|
-
const scrollPosition = ref(0);
|
|
83
86
|
const lastScrollY = ref(0);
|
|
84
87
|
const isUserScrolling = ref(false);
|
|
85
88
|
const langData = ref(null);
|
|
@@ -105,31 +108,36 @@ export default defineComponent({
|
|
|
105
108
|
}
|
|
106
109
|
);
|
|
107
110
|
function openFromScroll() {
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
lastScrollY.value = currentScrollY;
|
|
115
|
-
}
|
|
116
|
-
} else {
|
|
117
|
-
const filters = document.getElementById("arg_filters_section");
|
|
118
|
-
if (filters) {
|
|
119
|
-
if (window.scrollY > lastScrollY.value + filters.offsetHeight) {
|
|
111
|
+
if (window.scrollY !== lastScrollY.value) {
|
|
112
|
+
isUserScrolling.value = true;
|
|
113
|
+
}
|
|
114
|
+
if (!props.autoOpen) {
|
|
115
|
+
if (window.scrollY > 0) {
|
|
116
|
+
if (isUserScrolling.value) {
|
|
120
117
|
filtersOpen.value = false;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
if (props.autoOpen) {
|
|
122
|
+
const currentScrollY = window.scrollY;
|
|
123
|
+
if (currentScrollY === 0) {
|
|
124
|
+
if (!isUserScrolling.value) {
|
|
125
|
+
return;
|
|
126
|
+
} else {
|
|
127
|
+
filtersOpen.value = true;
|
|
121
128
|
lastScrollY.value = currentScrollY;
|
|
122
129
|
}
|
|
130
|
+
} else {
|
|
131
|
+
const filters = document.getElementById("arg_filters_section");
|
|
132
|
+
if (filters) {
|
|
133
|
+
if (window.scrollY > lastScrollY.value + filters.offsetHeight) {
|
|
134
|
+
filtersOpen.value = false;
|
|
135
|
+
lastScrollY.value = currentScrollY;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
123
138
|
}
|
|
124
139
|
}
|
|
125
140
|
}
|
|
126
|
-
onMounted(() => {
|
|
127
|
-
adjustFilterPosition();
|
|
128
|
-
listenToHeaderChange();
|
|
129
|
-
setTimeout(() => {
|
|
130
|
-
openFromScroll();
|
|
131
|
-
});
|
|
132
|
-
});
|
|
133
141
|
onUpdated(() => {
|
|
134
142
|
adjustFilterPosition();
|
|
135
143
|
});
|
|
@@ -144,9 +152,15 @@ export default defineComponent({
|
|
|
144
152
|
function handleCard() {
|
|
145
153
|
if (filtersOpen.value === false) {
|
|
146
154
|
document.removeEventListener("scroll", openFromScroll);
|
|
155
|
+
if (!props.autoOpen) {
|
|
156
|
+
document.removeEventListener("scroll", openFromScroll);
|
|
157
|
+
}
|
|
147
158
|
filtersOpen.value = true;
|
|
148
159
|
} else {
|
|
149
160
|
filtersOpen.value = false;
|
|
161
|
+
if (!props.autoOpen) {
|
|
162
|
+
document.addEventListener("scroll", openFromScroll);
|
|
163
|
+
}
|
|
150
164
|
}
|
|
151
165
|
}
|
|
152
166
|
function listenToHeaderChange() {
|
|
@@ -178,10 +192,13 @@ export default defineComponent({
|
|
|
178
192
|
emit("saveScope");
|
|
179
193
|
}
|
|
180
194
|
onMounted(() => {
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
195
|
+
if (!props.autoOpen) {
|
|
196
|
+
filtersOpen.value = true;
|
|
197
|
+
}
|
|
198
|
+
adjustFilterPosition();
|
|
199
|
+
listenToHeaderChange();
|
|
200
|
+
setTimeout(() => {
|
|
201
|
+
openFromScroll();
|
|
185
202
|
});
|
|
186
203
|
});
|
|
187
204
|
return {
|
|
@@ -28,6 +28,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
28
28
|
default: string;
|
|
29
29
|
validator: (value: string) => boolean;
|
|
30
30
|
};
|
|
31
|
+
autoOpen: {
|
|
32
|
+
type: BooleanConstructor;
|
|
33
|
+
default: boolean;
|
|
34
|
+
};
|
|
31
35
|
}>, {
|
|
32
36
|
filtersOpen: import("vue").Ref<any, any>;
|
|
33
37
|
clear: () => void;
|
|
@@ -64,6 +68,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
64
68
|
default: string;
|
|
65
69
|
validator: (value: string) => boolean;
|
|
66
70
|
};
|
|
71
|
+
autoOpen: {
|
|
72
|
+
type: BooleanConstructor;
|
|
73
|
+
default: boolean;
|
|
74
|
+
};
|
|
67
75
|
}>> & Readonly<{
|
|
68
76
|
onClearFilters?: ((...args: any[]) => any) | undefined;
|
|
69
77
|
onSaveScope?: ((...args: any[]) => any) | undefined;
|
|
@@ -75,6 +83,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
75
83
|
haveClear: boolean;
|
|
76
84
|
clearMsg: string;
|
|
77
85
|
saveScopeMsg: string;
|
|
86
|
+
autoOpen: boolean;
|
|
78
87
|
}, {}, {
|
|
79
88
|
argIcon: any;
|
|
80
89
|
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div>
|
|
2
|
+
<div :class="selectorIcon ? 'relative' : ''">
|
|
3
3
|
<!-- Simple select -->
|
|
4
4
|
<div class="oip_select_display">
|
|
5
5
|
<p
|
|
@@ -1065,4 +1065,8 @@ export default defineComponent({
|
|
|
1065
1065
|
.open-info:hover svg {
|
|
1066
1066
|
color: var(--primary) !important;
|
|
1067
1067
|
}
|
|
1068
|
+
|
|
1069
|
+
.relative {
|
|
1070
|
+
position: relative;
|
|
1071
|
+
}
|
|
1068
1072
|
</style>
|
|
@@ -71,7 +71,7 @@ const drawSquircle=(ctx,geom,radii,smooth,lineWidth,color)=>{const defaultFill=c
|
|
|
71
71
|
</script>
|
|
72
72
|
|
|
73
73
|
<style>
|
|
74
|
-
.oip_select_icon{align-items:center;background:var(--white);border:1.5px solid var(--light);border-radius:8px;cursor:pointer;display:flex;justify-content:center;padding:8px;position:relative;transition:border .15s ease-in}.oip_select_icon:hover{border:1.5px solid var(--primary-light)!important}.oip_select_wrap.open .oip_select_icon{border:1.5px solid var(--primary)!important;filter:drop-shadow(1px 1px 1px rgba(33,118,255,.3))!important}.oip_select_wrap:not(.open) .oip_select_icon:hover svg{color:var(--primary)!important}.oip_select_dropdown_block.icon{right:
|
|
74
|
+
.oip_select_icon{align-items:center;background:var(--white);border:1.5px solid var(--light);border-radius:8px;cursor:pointer;display:flex;justify-content:center;padding:8px;position:relative;transition:border .15s ease-in}.oip_select_icon:hover{border:1.5px solid var(--primary-light)!important}.oip_select_wrap.open .oip_select_icon{border:1.5px solid var(--primary)!important;filter:drop-shadow(1px 1px 1px rgba(33,118,255,.3))!important}.oip_select_wrap:not(.open) .oip_select_icon:hover svg{color:var(--primary)!important}.oip_select_dropdown_block.icon{right:0}.oip_select_dropdown_block{background:var(--demi-fond);border:1.5px solid var(--light);border-radius:12px;box-shadow:var(--overlay-shadow);display:flex;flex-direction:column;margin-top:15px;max-height:500px;min-width:230px;padding:16px;position:absolute;z-index:12}.oip_select_block{align-items:center;background:var(--white);border:1.5px solid var(--light);border-radius:8px;cursor:pointer;display:flex;gap:4px;-webkit-mask-image:paint(squircle);mask-image:paint(squircle);padding:12px;position:relative;width:196px;--squircle-radius:8px;--squircle-smooth:1}.filter_box:hover,.filter_wrap:hover>.filter_box:not(.open),.oip_select_block:hover,.oip_select_dropdown_block:hover,.prmt_parent_switch:hover{border:1.5px solid var(--primary-primary-20,#d3e4ff)!important}.filter_box.open,.oip_select_dropdown_block.open,.oip_select_wrap.open>.oip_select_block,.prmt_parent_switch.open{border:1.5px solid var(--primary)!important;filter:drop-shadow(0 0 4px rgba(33,118,255,.3))!important}.filter_wrap.open,.oip_select_wrap.open,.switch_wrapper.open{filter:drop-shadow(0 0 4px rgba(33,118,255,.3))!important}.oip_select_block.open>svg{color:var(--primary)!important}.oip_select_block.disabled{background:var(--light)!important;cursor:not-allowed}.oip_select_label .prmt_tooltip{display:flex}.oip_select_label .prmt_tooltip span,.oip_select_label>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:98%}.oip_select_label{color:var(--darkest);font-size:14px;font-weight:700;line-height:16px;max-height:16px;width:90%}.oip_select_block svg{flex-shrink:0!important}.oip_select_label.disabled{color:var(--dark)}.oip_select_caret_down{float:right;margin-left:auto}.oip_select_complex_selection_loop_name{font-style:normal;line-height:160%;width:-moz-fit-content;width:fit-content}.oip_select_complex_selection_loop.del>svg{color:var(--system-alert)!important;flex-shrink:0}.oip_select_complex_selection_loop.add>svg{color:var(--primary)!important;flex-shrink:0}.oip_select_complex_selection_loop{align-self:stretch;cursor:pointer;display:flex;flex-grow:1;gap:8px;min-height:24px}.oip_select_complex_selection_container{margin:8px 0;max-height:350px;overflow-y:auto}.oip_select_complex_selection_loop_name{font-size:14px;font-weight:400;line-height:16px}.oip_search_container>svg{color:var(--medium)!important}.oip_search_name:focus-visible{outline:none}.oip_search_name::-moz-placeholder{color:var(--medium);font-size:12px;font-weight:400;line-height:20px}.oip_search_name::placeholder{color:var(--medium);font-size:12px;font-weight:400;line-height:20px}.oip_search_name{border:none;padding-left:8px;width:100%}.oip_search_container{align-items:center;align-self:stretch;background:var(--white);border:1px solid var(--light);border-radius:8px;display:flex;gap:8px;padding:8px 12px}.oip_select_dropdown_title{color:var(--darkest);font-size:14px;font-weight:500;margin-bottom:8px}.oip_select_dropdown_selection_container{display:flex;flex:1 1 auto;flex-direction:column;gap:0;margin-top:16px;min-height:10px;overflow-y:auto}.oip_select_dropdown_selection_container:only-child{margin-top:0}.oip_empty_dropdown{color:var(--dark);font-size:14px;font-style:italic;font-weight:400;line-height:16px;padding-top:16px;text-align:center}.oip_select_complex_selection_loop>svg.add{fill:var(--accent)!important;color:var(--white)!important}.arg-circle-amount{align-items:center;background:#e9f1ff;border-radius:50%;color:var(--primary);display:flex;flex-direction:column;flex-shrink:0;font-size:14px;font-style:normal;font-weight:600;gap:10px;height:20px;justify-content:center;padding:4px;position:absolute;right:34px;width:20px}.oip_empty_select{color:var(--dark);font-size:14px;font-style:italic;font-weight:400;line-height:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.oip_select_display{align-items:flex-start;display:flex;flex-direction:column;gap:4px}.close-icon{background:var(--light);border-radius:100%;cursor:pointer;margin-left:auto;padding:4px}.arg-icon-circle-amount,.close-icon{align-items:center;display:flex;justify-content:center}.arg-icon-circle-amount{background:#e9f1ff;border-radius:50%;color:var(--primary);flex-direction:column;font-size:12px;font-style:normal;font-weight:900;height:var(--m,20px);line-height:normal;position:absolute;right:-5px;top:-5px;width:var(--m,20px);z-index:1}.close-icon:hover svg{color:var(--primary)!important}
|
|
75
75
|
</style>
|
|
76
76
|
<style scoped>
|
|
77
77
|
.oip_select_complex_selection_loop > svg.add {
|