@vc-shell/framework 1.0.155 → 1.0.157

package/dist/shared/modules/dynamic/components/fields/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../../shared/modules/dynamic/components/fields/Button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,gBAAgB,EAAY,MAAM,KAAK,CAAC;AAE5D,OAAO,cAAc,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAK5B,iBAAiB,qBAAqB,CAAC,GAAG;QAAE,OAAO,EAAE,YAAY,CAAA;KAAE;;;;AAHlF,wBAwBE"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../../shared/modules/dynamic/components/fields/Button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,gBAAgB,EAAsB,MAAM,KAAK,CAAC;AAEtE,OAAO,cAAc,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAM5B,iBAAiB,qBAAqB,CAAC,GAAG;QAAE,OAAO,EAAE,YAAY,CAAA;KAAE;;;;AAHlF,wBAyBE"}

package/dist/shared/modules/dynamic/composables/useFilterBuilder/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../shared/modules/dynamic/composables/useFilterBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,QAAQ,EAKR,eAAe,EACf,YAAY,EACZ,KAAK,EACL,WAAW,EAEZ,MAAM,KAAK,CAAC;AAGb,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAK9D,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACjD;AASD,UAAU,IAAI;IACZ,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,UAAU,EAAE,CAAC;KACxB,EAAE,CAAC;CACL;AAED,MAAM,WAAW,gBAAgB;IAC/B,eAAe,EAAE,CAAC,WAAW,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAChD,KAAK,CACH,YAAY,EACZ,eAAe,EACf;QAEE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CACF,GACD,SAAS,CAAC;IACd,iBAAiB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACvC,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IACtC,KAAK,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAE3B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACtC;;UAGO,IAAI,GAAG,SAAS;;;MAGpB,gBAAgB;AAJpB,wBA+LE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../shared/modules/dynamic/composables/useFilterBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,QAAQ,EAKR,eAAe,EACf,YAAY,EACZ,KAAK,EACL,WAAW,EAGZ,MAAM,KAAK,CAAC;AAGb,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAK9D,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACjD;AASD,UAAU,IAAI;IACZ,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,UAAU,EAAE,CAAC;KACxB,EAAE,CAAC;CACL;AAED,MAAM,WAAW,gBAAgB;IAC/B,eAAe,EAAE,CAAC,WAAW,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAChD,KAAK,CACH,YAAY,EACZ,eAAe,EACf;QAEE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CACF,GACD,SAAS,CAAC;IACd,iBAAiB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACvC,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IACtC,KAAK,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAE3B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACtC;;UAGO,IAAI,GAAG,SAAS;;;MAGpB,gBAAgB;AAJpB,wBAmME"}

package/dist/ui/components/organisms/vc-table/_internal/vc-table-cell/vc-table-cell.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vc-table-cell.vue.d.ts","sourceRoot":"","sources":["../../../../../../../ui/components/organisms/vc-table/_internal/vc-table-cell/vc-table-cell.vue.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAE/D,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,aAAa,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAC/B;;AAkQD,wBAMG;AACH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC"}
+{"version":3,"file":"vc-table-cell.vue.d.ts","sourceRoot":"","sources":["../../../../../../../ui/components/organisms/vc-table/_internal/vc-table-cell/vc-table-cell.vue.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAE/D,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,aAAa,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAC/B;;AAiVD,wBAMG;AACH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vc-shell/framework",
-  "version": "1.0.155",
+  "version": "1.0.157",
   "type": "module",
   "main": "./dist/framework.js",
   "types": "./dist/index.d.ts",
@@ -53,9 +53,9 @@
     "whatwg-fetch": "^3.6.19"
   },
   "devDependencies": {
-    "@vc-shell/api-client-generator": "^1.0.155",
-    "@vc-shell/config-generator": "^1.0.155",
-    "@vc-shell/ts-config": "^1.0.155",
+    "@vc-shell/api-client-generator": "^1.0.157",
+    "@vc-shell/config-generator": "^1.0.157",
+    "@vc-shell/ts-config": "^1.0.157",
     "@vitejs/plugin-vue": "^5.0.3",
     "sass": "^1.69.6",
     "typescript": "^5.3.3",

package/shared/modules/dynamic/components/fields/Button.ts

@@ -1,12 +1,14 @@
-import { Component, ExtractPropTypes, h, unref } from "vue";
+import { Component, ExtractPropTypes, computed, h, unref } from "vue";
 import { Button } from "../factories";
 import componentProps from "./props";
 import { ButtonSchema } from "../../types";
+import { useI18n } from "vue-i18n";
 
 export default {
   name: "ButtonEl",
   props: componentProps,
   setup(props: ExtractPropTypes<typeof componentProps> & { element: ButtonSchema }) {
+    const { t } = useI18n({ useScope: "global" });
     return () => {
       const field = Button({
         props: {
@@ -20,7 +22,7 @@ export default {
           },
         },
         slots: {
-          default: () => props.element.content,
+          default: () => unref(computed(() => t(props.element.content))),
         },
       });
 

package/shared/modules/dynamic/composables/useFilterBuilder/index.ts

@@ -12,6 +12,7 @@ import {
   VNode,
   ComputedRef,
   readonly,
+  toValue,
 } from "vue";
 import * as _ from "lodash-es";
 import { Checkbox, InputField } from "../../components/factories";
@@ -148,7 +149,7 @@ export default <Query>(args: {
             "onUpdate:modelValue": (e: boolean) => selectFilterItem(e, currC.value, control.field, control.multiple),
           },
           slots: {
-            default: () => currC.displayName,
+            default: () => unref(computed(() => t(currC.displayName))),
           },
         });
 
@@ -163,7 +164,7 @@ export default <Query>(args: {
       props: {
         type: "date",
         classNames: "tw-mb-3",
-        label: control.label,
+        label: toValue(computed(() => t(control.label ?? ""))),
         modelValue: computed(() => filter[control.field]),
         "onUpdate:modelValue": (e: unknown) => (filter[control.field] = e),
       },
@@ -198,7 +199,11 @@ export default <Query>(args: {
       h(VcRow, () =>
         Object.values(controls.value).map(({ title, fields }) =>
           h(VcCol, { class: "tw-p-2" }, () => [
-            h("div", { class: "tw-mb-4 tw-text-[#a1c0d4] tw-font-bold tw-text-[17px]" }, title),
+            h(
+              "div",
+              { class: "tw-mb-4 tw-text-[#a1c0d4] tw-font-bold tw-text-[17px]" },
+              unref(computed(() => t(title))),
+            ),
             Object.values(fields).map((item) => {
               if ("component" in item && item.component) {
                 return h(

package/ui/components/atoms/vc-label/vc-label.vue

@@ -46,7 +46,7 @@
 <script lang="ts" setup>
 import { VcIcon } from "./../../../components";
 import { ref } from "vue";
-import { useFloating, shift, flip } from "@floating-ui/vue";
+import { useFloating, shift } from "@floating-ui/vue";
 
 export interface Props {
   required?: boolean;
@@ -70,7 +70,7 @@ const tooltipRef = ref<HTMLElement | null>(null);
 
 const { floatingStyles } = useFloating(tooltipIconRef, tooltipRef, {
   placement: "top-start",
-  middleware: [flip({ fallbackPlacements: ["top-start", "bottom-start"] }), shift({ mainAxis: false })],
+  middleware: [shift()],
 });
 </script>
 

package/ui/components/organisms/vc-table/_internal/vc-table-cell/vc-table-cell.vue

@@ -1,14 +1,17 @@
 <template>
   <!-- Money cell -->
   <template v-if="cell.type === 'money'">
-    <template v-if="typeof Number(value) === 'number' && Number(value) > 0">
-      <span>{{ Math.trunc(Number(value)) }}</span
-      ><span class="tw-text-[#a5a5a5] tw-text-xs"
+    <div
+      v-if="typeof Number(value) === 'number' && Number(value) > 0"
+      class="tw-truncate"
+    >
+      <span class="tw-truncate">{{ Math.trunc(Number(value)) }}</span
+      ><span class="tw-text-[#a5a5a5] tw-text-xs tw-truncate"
         >.{{ `${(Number(value) * 100) % 100}`.padEnd(2, "0").slice(0, 2) }}</span
       >
-    </template>
+    </div>
     <template v-else>
-      <span>N/A</span>
+      <div class="tw-truncate">N/A</div>
     </template>
   </template>
 
@@ -17,29 +20,60 @@
     v-else-if="cell.type === 'date-ago'"
     class="tw-text-[#a5a5a5]"
   >
-    <template v-if="value">
+    <div
+      v-if="value"
+      class="tw-truncate"
+    >
       {{ moment(value).fromNow() }}
-    </template>
-    <template v-else>N/A</template>
+    </div>
+    <div
+      v-else
+      class="tw-truncate"
+    >
+      N/A
+    </div>
   </span>
 
   <!-- Date exact cell -->
-  <span
+  <dvi
     v-else-if="cell.type === 'date' || cell.type === 'time' || cell.type === 'date-time'"
-    class="tw-text-[#a5a5a5]"
+    class="tw-text-[#a5a5a5] tw-truncate"
   >
     <template v-if="value">
-      <template v-if="cell.format">
+      <div
+        v-if="cell.format"
+        class="tw-truncate"
+      >
         {{ moment(value).locale(locale).format(cell.format) }}
-      </template>
+      </div>
       <template v-else>
-        <template v-if="cell.type === 'date'">{{ value instanceof Date && value.toLocaleDateString() }}</template>
-        <template v-if="cell.type === 'time'">{{ value instanceof Date && value.toLocaleTimeString() }}</template>
-        <template v-if="cell.type === 'date-time'">{{ value.toLocaleString() }}</template>
+        <div
+          v-if="cell.type === 'date'"
+          class="tw-truncate"
+        >
+          {{ value instanceof Date && value.toLocaleDateString() }}
+        </div>
+        <div
+          v-if="cell.type === 'time'"
+          class="tw-truncate"
+        >
+          {{ value instanceof Date && value.toLocaleTimeString() }}
+        </div>
+        <p
+          v-if="cell.type === 'date-time'"
+          class="tw-truncate"
+        >
+          {{ value.toLocaleString() }}
+        </p>
       </template>
     </template>
-    <template v-else>N/A</template>
-  </span>
+    <div
+      v-else
+      class="tw-truncate"
+    >
+      N/A
+    </div>
+  </dvi>
 
   <!-- Image cell -->
   <template v-else-if="cell.type === 'image'">
@@ -66,22 +100,25 @@
   </div>
 
   <!-- Number cell -->
-  <span
+  <div
     v-else-if="cell.type === 'number'"
-    class="tw-text-right"
+    class="tw-text-right tw-truncate"
   >
     {{ Number(value).toFixed(0) }}
-  </span>
+  </div>
 
   <!-- Link cell -->
   <template v-else-if="cell.type === 'link'">
-    <VcLink>{{ value }}</VcLink>
+    <VcLink class="tw-truncate">{{ value }}</VcLink>
   </template>
 
   <!-- Default cell -->
-  <span v-else>
+  <div
+    v-else
+    class="tw-truncate"
+  >
     {{ value }}
-  </span>
+  </div>
 </template>
 
 <script lang="ts" setup>

package/ui/components/organisms/vc-table/vc-table.vue

@@ -325,7 +325,7 @@
               <td
                 v-for="cell in filteredCols"
                 :key="`${(typeof item === 'object' && 'id' in item && item.id) || itemIndex}_${cell.id}`"
-                class="tw-box-border tw-overflow-hidden tw-px-3 [&~:not(.vc-image):not(.vc-status)]:tw-truncate"
+                class="tw-box-border tw-overflow-hidden tw-px-3"
                 :class="cell.class"
                 :style="{ maxWidth: cell.width, width: cell.width }"
               >