@dative-gpi/foundation-shared-components 1.0.41 → 1.0.43

package/components/fields/FSTermField.vue

@@ -68,7 +68,7 @@
           :rules="[DateRules.required()]"
           :editable="$props.editable"
           :hideHeader="true"
-          :modelValue="[parseForPicker(innerStartDate)!, parseForPicker(innerEndDate)!]"
+          :modelValue="actualValue"
           @update:modelValue="onPickDates"
         />
       </FSRow>
@@ -81,7 +81,7 @@ import { computed, defineComponent, type PropType, ref, watch } from "vue";
 import _ from "lodash";
 
 import { DateRules, NumberRules, TextRules } from "@dative-gpi/foundation-shared-components/models";
-import { useAppTimeZone } from "@dative-gpi/foundation-shared-services/composables";
+import { useDateFormat } from "@dative-gpi/foundation-shared-services/composables";
 import { useRules } from "@dative-gpi/foundation-shared-components/composables";
 import { DateSetting } from "@dative-gpi/foundation-shared-domain/models";
 
@@ -163,7 +163,7 @@ export default defineComponent({
   },
   emits: ["update:startDate", "update:endDate"],
   setup(props, { emit }) {
-    const { parseForPicker, formatFromPicker, todayToPicker, yesterdayToPicker } = useAppTimeZone();
+    const { parseForPicker, epochToISO, todayToPicker, yesterdayToPicker } = useDateFormat();
     const { getMessages } = useRules();
 
     const innerDateSetting = ref<DateSetting>(DateSetting.PastDays);
@@ -181,6 +181,14 @@ export default defineComponent({
       ];
     });
 
+    const actualValue = computed(() => {
+      const dates = [parseForPicker(innerStartDate.value), parseForPicker(innerEndDate.value)]
+      if(dates.some(d => d == null)) {
+        return null;
+      }
+      return dates as [number, number];
+    })
+
     const messages = computed((): string[] => {
       return props.messages ??
         getMessages(props.startDate, props.rules).concat(getMessages(props.endDate, props.rules));
@@ -418,14 +426,14 @@ export default defineComponent({
       }
       else {
         console.log(value[0], value[1]);
-        if (value && value[0] != null && formatFromPicker(value[0]) !== innerStartDate.value) {
-          innerStartDate.value = formatFromPicker(value[0]);
+        if (value && value[0] != null && epochToISO(value[0]) !== innerStartDate.value) {
+          innerStartDate.value = epochToISO(value[0]);
           if (valid.value) {
             emit("update:startDate", innerStartDate.value);
           }
         }
-        if (value && value[1] != null && formatFromPicker(value[1]) !== innerEndDate.value) {
-          innerEndDate.value = formatFromPicker(value[1]);
+        if (value && value[1] != null && epochToISO(value[1]) !== innerEndDate.value) {
+          innerEndDate.value = epochToISO(value[1]);
           if (valid.value) {
             emit("update:endDate", innerEndDate.value);
           }
@@ -619,7 +627,7 @@ export default defineComponent({
         }
       }
 
-      if (parseForPicker(props.endDate) != null && parseForPicker(props.startDate) != null) {
+      if (props.endDate && parseForPicker(props.endDate) != null && props.startDate && parseForPicker(props.startDate) != null) {
         innerDateSetting.value = DateSetting.Pick;
         innerDateValue.value = 1;
         return;
@@ -643,6 +651,7 @@ export default defineComponent({
       innerDateValue,
       innerStartDate,
       innerEndDate,
+      actualValue,
       pastSettings,
       DateSetting,
       NumberRules,

package/components/selects/FSSelectDateSetting.vue

@@ -1,5 +1,6 @@
 <template>
   <FSSelectField
+    class="fs-select-date-setting"
     :items="dateSettings"
     :clearable="false"
     :modelValue="$props.modelValue"

package/models/rules.ts

@@ -1,11 +1,11 @@
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui/composables";
-import { useAppTimeZone } from "@dative-gpi/foundation-shared-services/composables";
+import { useDateFormat } from "@dative-gpi/foundation-shared-services/composables";
 import { validateExpression } from "@dative-gpi/foundation-shared-domain/tools";
 
 import { getTimeBestString } from "../utils";
 import type { TimeUnit } from "@/shared/foundation-shared-domain";
 
-const { epochToLongDateFormat } = useAppTimeZone()!;
+const { epochToLongDateFormat } = useDateFormat()!;
 const { $tr } = useTranslationsProvider();
 
 export const TextRules = {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dative-gpi/foundation-shared-components",
   "sideEffects": false,
-  "version": "1.0.41",
+  "version": "1.0.43",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -10,8 +10,8 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-shared-domain": "1.0.41",
-    "@dative-gpi/foundation-shared-services": "1.0.41"
+    "@dative-gpi/foundation-shared-domain": "1.0.43",
+    "@dative-gpi/foundation-shared-services": "1.0.43"
   },
   "peerDependencies": {
     "@dative-gpi/bones-ui": "^0.0.75",
@@ -35,5 +35,5 @@
     "sass": "1.71.1",
     "sass-loader": "13.3.2"
   },
-  "gitHead": "508299773d7c9704b08daf80c858931aaa823326"
+  "gitHead": "30a450a1f1843ffd8d38d5ff3f86c4349480ed74"
 }

package/styles/components/fs_gradient_field.scss

@@ -1,16 +1,16 @@
+.fs-gradient-field-select > .v-input__control > .v-field {
+  display: flex;
 
-.fs-gradient-select-field .v-select__selection {
-  width: 100%;
-
-  
-}
+  & > .v-field__prepend-inner {
+    flex: 1;
+  }
 
-.fs-gradient-field-preview {
-  padding: 13px 20px;
-  > span {
-    height: 12px;
-    background: var(--fs-gradient-field-background) !important;
-    width: 100%;
+  & > .v-field__field {
+    flex: 0;
   }
 }
 
+.fs-gradient-field-preview {
+  background: var(--fs-gradient-field-background) !important;
+  min-width: 100%;
+}

package/styles/components/fs_select_date_settings.scss

@@ -0,0 +1,3 @@
+.fs-select-field.fs-select-date-setting {
+    min-width: 160px;
+}