@dative-gpi/foundation-shared-components 0.0.109 → 0.0.110

package/components/FSSlideGroup.vue

@@ -107,31 +107,27 @@ export default defineComponent({
 
     const goToStart = () => {
       if (slideGroupRef.value) {
-        (slideGroupRef.value as any).scrollOffset = 0;
+        (slideGroupRef.value as any).scrollTo("prev");
+        (slideGroupRef.value as any).scrollTo("prev");
       }
     };
 
     const goToPrev = () => {
       if (slideGroupRef.value) {
-        (slideGroupRef.value as any).scrollOffset = Math.max(0, (slideGroupRef.value as any).scrollOffset - props.speed);
+        (slideGroupRef.value as any).scrollTo("prev");
       }
     };
 
     const goToEnd = () => {
       if (slideGroupRef.value) {
-        const contentSize = (slideGroupRef.value as any).$el.children[1].children[0].clientWidth;
-        const containerSize = (slideGroupRef.value as any).$el.clientWidth;
-        const arrowsOffset = props.dash ? 104 : 64;
-        (slideGroupRef.value as any).scrollOffset = (contentSize - containerSize + arrowsOffset);
+        (slideGroupRef.value as any).scrollTo("next");
+        (slideGroupRef.value as any).scrollTo("next");
       }
     };
 
     const goToNext = () => {
       if (slideGroupRef.value) {
-        const contentSize = (slideGroupRef.value as any).$el.children[1].children[0].clientWidth;
-        const containerSize = (slideGroupRef.value as any).$el.clientWidth;
-        const arrowsOffset = props.dash ? 104 : 64;
-        (slideGroupRef.value as any).scrollOffset = Math.min(contentSize - containerSize + arrowsOffset, (slideGroupRef.value as any).scrollOffset + props.speed);
+        (slideGroupRef.value as any).scrollTo("next");
       }
     };
 

package/components/fields/FSSearchField.vue

@@ -7,7 +7,7 @@
     :required="$props.required"
     :editable="$props.editable"
     :placeholder="placeholder"
-    @keydown.enter="$emit('update:modelValue', innerValue)"
+    @keydown.enter="onSearch"
     v-model="innerValue"
     v-bind="$attrs"
   >
@@ -23,7 +23,7 @@
           :icon="$props.prependInnerIcon"
           :editable="$props.editable"
           :color="ColorEnum.Dark"
-          @click="$emit('update:modelValue', innerValue)"
+          @click="onSearch"
         />
       </slot>
     </template>
@@ -41,7 +41,7 @@
           :variant="$props.buttonVariant"
           :color="$props.buttonColor"
           :editable="$props.editable"
-          @click="$emit('update:modelValue', innerValue)"
+          @click="onSearch"
         />
       </slot>
     </template>
@@ -163,6 +163,12 @@ export default defineComponent({
       return props.buttonLabel ?? $tr('ui.button.search', 'Search');
     });
 
+    const onSearch = (event: Event) => {
+      event.stopImmediatePropagation();
+      event.preventDefault();
+      emit('update:modelValue', innerValue.value);
+    };
+
     watch(innerValue, () => {
       if (["instant"].includes(props.variant)) {
         emit("update:modelValue", innerValue.value);
@@ -173,7 +179,8 @@ export default defineComponent({
       placeholder,
       buttonLabel,
       innerValue,
-      ColorEnum
+      ColorEnum,
+      onSearch
     };
   }
 });

package/components/fields/FSTagField.vue

@@ -141,7 +141,9 @@ export default defineComponent({
 
     const messages = computed((): string[] => getMessages(props.modelValue, props.rules));
 
-    const onAdd = (): void => {
+    const onAdd = (event: Event): void => {
+      event.stopImmediatePropagation();
+      event.preventDefault();
       if (!props.editable) {
         return;
       }

package/components/lists/FSDataTableUI.vue

@@ -373,7 +373,7 @@
                 {{ $tr("ui.data-table.rows-per-page", "Rows per page") }}
               </FSText>
               <FSSelectField
-                class="fs-data-table-rows-per-page"
+                class="fs-data-table-rows-per-page fs-small-input"
                 :clearable="false"
                 :hideHeader="true"
                 :items="rowsPerPageOptions"
@@ -382,7 +382,7 @@
             </FSRow>
             <FSToggleSet
               v-if="innerRowsPerPage !== -1"
-              class="fs-data-table-pagination"
+              class="fs-data-table-pagination fs-small-input"
               variant="slide"
               :dash="pageOptions.length > 8"
               :values="pageOptions"
@@ -529,7 +529,7 @@
                 width="120px"
               >
                 <FSSelectField
-                  class="fs-data-table-rows-per-page"
+                  class="fs-data-table-rows-per-page fs-small-input"
                   :clearable="false"
                   :hideHeader="true"
                   :items="rowsPerPageOptions"
@@ -539,7 +539,7 @@
             </FSRow>
             <FSToggleSet
               v-if="innerRowsPerPage !== -1"
-              class="fs-data-table-pagination"
+              class="fs-data-table-pagination fs-small-input"
               variant="slide"
               :dash="pageOptions.length > 8"
               :values="pageOptions"

package/models/tables.ts

@@ -28,6 +28,6 @@ export interface FSDataTableFilter {
 }
 
 export interface FSDataTableOrder {
-    key: string;
-    order: "asc" | "desc";
+    key: string | null;
+    order: "asc" | "desc" | null;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dative-gpi/foundation-shared-components",
   "sideEffects": false,
-  "version": "0.0.109",
+  "version": "0.0.110",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -10,8 +10,8 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-shared-domain": "0.0.109",
-    "@dative-gpi/foundation-shared-services": "0.0.109",
+    "@dative-gpi/foundation-shared-domain": "0.0.110",
+    "@dative-gpi/foundation-shared-services": "0.0.110",
     "@fontsource/montserrat": "^5.0.16",
     "@lexical/clipboard": "^0.12.5",
     "@lexical/history": "^0.12.5",
@@ -32,5 +32,5 @@
     "sass": "^1.69.5",
     "sass-loader": "^13.3.2"
   },
-  "gitHead": "2d4b8a76e9b8361a8a1e9b327311afef20a53950"
+  "gitHead": "8a2d3dd65f3e61ed359d517dc060537fb47b0123"
 }

package/styles/components/fs_data_table.scss

@@ -106,9 +106,9 @@
     background-color: var(--fs-data-table-background-color);
 }
 
-.fs-data-table-rows-per-page > .fs-select-field {
-    min-width: 120px !important;
-    width: 120px !important;
+.fs-data-table-rows-per-page {
+    min-width: 100px;
+    width: 100px;
 }
 
 .fs-data-table-pagination {

package/styles/globals/overrides.scss

@@ -30,7 +30,7 @@
 .v-input {
     padding: 0px !important;
 
-    &:not(.v-checkbox):not(.v-slider) {
+    &:not(.v-checkbox):not(.v-slider):not(.fs-small-input) {
         min-width: 200px;
         width: 100%;
     }