@ironsource/shared-ui 1.4.3-rc.3 → 1.4.3-rc.5

package/components/includeExclude/IncludeExcludeOptionDraggable.vue.js

@@ -0,0 +1,126 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, unref, normalizeClass, createElementVNode, renderSlot, createCommentVNode, createVNode, withCtx, createTextVNode, toDisplayString, createBlock, withModifiers } from 'vue';
+/* empty css                                                                     */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
+import Text from '../typography/Text.vue.js';
+import { useIncludeExcludeContext } from './IncludeExcludeContext.vue.js';
+import { useId } from '../../composables/useId.vue.js';
+import _sfc_main$1 from '../tooltip/Tooltip.vue.js';
+import Icon from '../icon/Icon.vue.js';
+/* empty css                                                                               */
+import "../../IncludeExcludeOptionDraggable.vue_vue_type_style_index_0_scoped_true_lang.css";
+const _hoisted_1 = ["id"];
+const _hoisted_2 = {
+  key: 0,
+  class: "image"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "start-icon"
+};
+const _hoisted_4 = { class: "text-container" };
+const _hoisted_5 = { key: 0 };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "IncludeExcludeOptionDraggable",
+  props: {
+    option: null,
+    subtitle: { default: "" },
+    disabled: { type: Boolean, default: false },
+    clearable: { type: Boolean, default: false },
+    titleText: { default: "" }
+  },
+  setup(__props) {
+    const props = __props;
+    const api = useIncludeExcludeContext("IncludeExcludeOption");
+    const id = useId().value;
+    const el = ref(null);
+    const isMulti = true;
+    const tooltipDelay = 200;
+    const active = computed(() => {
+      return api.activeIndex.value !== null ? api.activeOption.value === props.option : false;
+    });
+    const selected = computed(() => {
+      return api.selectedOption.value.includes(props.option);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        id: unref(id).toString(),
+        ref_key: "el",
+        ref: el,
+        class: normalizeClass(["item-container-draggable", {
+          "item-container-draggable--disabled": __props.disabled,
+          "item-container-draggable--active": unref(active),
+          "item-container-draggable--selected": unref(selected),
+          "item-container-draggable--multi": isMulti,
+          "item-container-draggable--two-lines": __props.subtitle?.length
+        }])
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(["item", {
+            "item--multi": isMulti,
+            "item--with-icon": _ctx.$slots["icon-start"] || _ctx.$slots.image,
+            "item--without-icon": !_ctx.$slots["icon-start"] && !_ctx.$slots.image
+          }])
+        }, [
+          _ctx.$slots.image ? (openBlock(), createElementBlock("div", _hoisted_2, [
+            renderSlot(_ctx.$slots, "image", {}, void 0, true)
+          ])) : createCommentVNode("", true),
+          _ctx.$slots["icon-start"] ? (openBlock(), createElementBlock("div", _hoisted_3, [
+            renderSlot(_ctx.$slots, "icon-start", {}, void 0, true)
+          ])) : createCommentVNode("", true),
+          createElementVNode("div", _hoisted_4, [
+            createVNode(unref(_sfc_main$1), {
+              delay: tooltipDelay,
+              text: __props.titleText
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(Text), {
+                  size: "sm",
+                  "is-truncated": ""
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(__props.titleText), 1)
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }, 8, ["text"]),
+            createVNode(unref(_sfc_main$1), {
+              delay: tooltipDelay,
+              text: __props.subtitle
+            }, {
+              default: withCtx(() => [
+                __props.subtitle ? (openBlock(), createBlock(unref(Text), {
+                  key: 0,
+                  class: "subtitle",
+                  size: "caption",
+                  "is-truncated": ""
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(__props.subtitle), 1)
+                  ]),
+                  _: 1
+                })) : createCommentVNode("", true)
+              ]),
+              _: 1
+            }, 8, ["text"])
+          ])
+        ], 2),
+        __props.clearable && unref(selected) ? (openBlock(), createElementBlock("div", _hoisted_5, [
+          createElementVNode("button", {
+            class: "clear-button",
+            onClick: _cache[0] || (_cache[0] = withModifiers(($event) => unref(api).removeSelection(__props.option), ["prevent", "stop"]))
+          }, [
+            createVNode(unref(Icon), {
+              "font-size": "sm",
+              size: "sm",
+              name: "close-bold"
+            })
+          ])
+        ])) : createCommentVNode("", true)
+      ], 10, _hoisted_1);
+    };
+  }
+});
+var IncludeExcludeOptionDraggable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cc2c8ff8"]]);
+
+export { IncludeExcludeOptionDraggable as default };

package/components/includeExclude/includeExcludeMocks.d.ts

@@ -18,8 +18,20 @@ export type Platform = {
     name: string;
     icon: string;
 };
+export type groupOption = {
+    childOptionsIds: string[];
+    isCollapse: boolean;
+};
+export type EditColumns = {
+    name: string;
+    titleText: string;
+    icon: string;
+    disabled: boolean;
+    groupOption: groupOption;
+};
 export declare const apps: readonly Application[];
 /** used to test performance (756 apps) */
 export declare const applications: readonly Application[];
 export declare const countries: readonly Country[];
 export declare const platform: readonly Platform[];
+export declare const editColumns: readonly EditColumns[];

package/components/includeExclude/index.d.ts

@@ -1,5 +1,7 @@
 import IncludeExclude from './IncludeExclude.vue';
+import IncludeExcludeDragDrop from './IncludeExcludeDragDrop.vue';
 import IncludeExcludeOption from './IncludeExcludeOption.vue';
+import IncludeExcludeOptionDraggable from './IncludeExcludeOptionDraggable.vue';
 import IncludeExcludeAppTrigger from './IncludeExcludeAppTrigger.vue';
 import IncludeExcludeAppHeader from './IncludeExcludeAppHeader.vue';
 import IncludeExcludeChipFilter from './IncludeExcludeChipFilter.vue';
@@ -217,22 +219,171 @@ declare const IncludeExcludeTypes: () => (import("vue").DefineComponent<{
     distanceOffset: number;
     skiddingOffset: number;
 }> | import("vue").DefineComponent<{
-    option: {
+    loading: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    placement: {
+        type: import("vue").PropType<import("floating-vue").Placement>;
+    } & {
+        default: string;
+    };
+    disabled: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    options: {
+        type: import("vue").PropType<unknown[]>;
+        required: true;
+    };
+    modelValue: {
         type: import("vue").PropType<unknown>;
         required: true;
     };
+    searchPlaceholder: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+    isOnTop: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    distance: {
+        type: import("vue").PropType<number>;
+    } & {
+        default: number;
+    };
+    autoFocus: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    defaultOpen: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    clearable: {
+        type: import("vue").PropType<boolean>;
+    };
+    onSearch: {
+        type: import("vue").PropType<(option: any, term: string) => boolean>;
+    } & {
+        default: () => true;
+    };
+    hasSubtitle: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    titleText: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+    showClearAll: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    alwayesOpen: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    distanceOffset: {
+        type: import("vue").PropType<number>;
+    } & {
+        default: number;
+    };
+    skiddingOffset: {
+        type: import("vue").PropType<number>;
+    } & {
+        default: number;
+    };
+    keyField: {
+        type: import("vue").PropType<string>;
+        required: true;
+    };
+    isDraggable: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    draggableArgs: {
+        type: import("vue").PropType<object>;
+    } & {
+        default: any;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: unknown) => void;
+} & {
+    changeDragDrop: (value: unknown) => void;
+} & {
+    clickOutside: (value: unknown) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    loading: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    placement: {
+        type: import("vue").PropType<import("floating-vue").Placement>;
+    } & {
+        default: string;
+    };
     disabled: {
         type: import("vue").PropType<boolean>;
     } & {
         default: boolean;
     };
-    subtitle: {
+    options: {
+        type: import("vue").PropType<unknown[]>;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<unknown>;
+        required: true;
+    };
+    searchPlaceholder: {
         type: import("vue").PropType<string>;
     } & {
         default: string;
     };
+    isOnTop: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    distance: {
+        type: import("vue").PropType<number>;
+    } & {
+        default: number;
+    };
+    autoFocus: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    defaultOpen: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
     clearable: {
         type: import("vue").PropType<boolean>;
+    };
+    onSearch: {
+        type: import("vue").PropType<(option: any, term: string) => boolean>;
+    } & {
+        default: () => true;
+    };
+    hasSubtitle: {
+        type: import("vue").PropType<boolean>;
     } & {
         default: boolean;
     };
@@ -241,12 +392,63 @@ declare const IncludeExcludeTypes: () => (import("vue").DefineComponent<{
     } & {
         default: string;
     };
-    showCheckbox: {
+    showClearAll: {
         type: import("vue").PropType<boolean>;
     } & {
         default: boolean;
     };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    alwayesOpen: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    distanceOffset: {
+        type: import("vue").PropType<number>;
+    } & {
+        default: number;
+    };
+    skiddingOffset: {
+        type: import("vue").PropType<number>;
+    } & {
+        default: number;
+    };
+    keyField: {
+        type: import("vue").PropType<string>;
+        required: true;
+    };
+    isDraggable: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    draggableArgs: {
+        type: import("vue").PropType<object>;
+    } & {
+        default: any;
+    };
+}>> & {
+    "onUpdate:modelValue"?: (value: unknown) => any;
+    onClickOutside?: (value: unknown) => any;
+    onChangeDragDrop?: (value: unknown) => any;
+}, {
+    loading: boolean;
+    placement: import("floating-vue").Placement;
+    disabled: boolean;
+    searchPlaceholder: string;
+    isOnTop: boolean;
+    distance: number;
+    autoFocus: boolean;
+    defaultOpen: boolean;
+    onSearch: (option: any, term: string) => boolean;
+    hasSubtitle: boolean;
+    titleText: string;
+    showClearAll: boolean;
+    alwayesOpen: boolean;
+    distanceOffset: number;
+    skiddingOffset: number;
+    isDraggable: boolean;
+    draggableArgs: object;
+}> | import("vue").DefineComponent<{
     option: {
         type: import("vue").PropType<unknown>;
         required: true;
@@ -271,17 +473,36 @@ declare const IncludeExcludeTypes: () => (import("vue").DefineComponent<{
     } & {
         default: string;
     };
-    showCheckbox: {
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    option: {
+        type: import("vue").PropType<unknown>;
+        required: true;
+    };
+    disabled: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    subtitle: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+    clearable: {
         type: import("vue").PropType<boolean>;
     } & {
         default: boolean;
     };
+    titleText: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
 }>>, {
     disabled: boolean;
     subtitle: string;
     clearable: boolean;
     titleText: string;
-    showCheckbox: boolean;
 }> | import("vue").DefineComponent<{
     loading: {
         type: import("vue").PropType<boolean>;
@@ -700,4 +921,4 @@ declare const IncludeExcludeTypes: () => (import("vue").DefineComponent<{
     showImage: boolean;
     triggerTextFunc: (option: unknown) => string;
 }>)[];
-export { IncludeExclude, IncludeExcludeOption, IncludeExcludeAppTrigger, IncludeExcludeAppHeader, IncludeExcludeChipFilter, IncludeExcludeTypes, };
+export { IncludeExclude, IncludeExcludeDragDrop, IncludeExcludeOption, IncludeExcludeOptionDraggable, IncludeExcludeAppTrigger, IncludeExcludeAppHeader, IncludeExcludeChipFilter, IncludeExcludeTypes, };

package/components/includeExclude/index.vue.js

@@ -1,7 +1,11 @@
 import IncludeExclude from './IncludeExclude.vue.js';
 export { default as IncludeExclude } from './IncludeExclude.vue.js';
+import IncludeExcludeDragDrop from './IncludeExcludeDragDrop.vue.js';
+export { default as IncludeExcludeDragDrop } from './IncludeExcludeDragDrop.vue.js';
 import IncludeExcludeOption from './IncludeExcludeOption.vue.js';
 export { default as IncludeExcludeOption } from './IncludeExcludeOption.vue.js';
+import IncludeExcludeOptionDraggable from './IncludeExcludeOptionDraggable.vue.js';
+export { default as IncludeExcludeOptionDraggable } from './IncludeExcludeOptionDraggable.vue.js';
 import IncludeExcludeAppTrigger from './IncludeExcludeAppTrigger.vue.js';
 export { default as IncludeExcludeAppTrigger } from './IncludeExcludeAppTrigger.vue.js';
 import IncludeExcludeAppHeader from './IncludeExcludeAppHeader.vue.js';
@@ -11,7 +15,9 @@ export { default as IncludeExcludeChipFilter } from './IncludeExcludeChipFilter.
 
 const IncludeExcludeTypes = () => [
   IncludeExclude,
+  IncludeExcludeDragDrop,
   IncludeExcludeOption,
+  IncludeExcludeOptionDraggable,
   IncludeExcludeAppTrigger,
   IncludeExcludeAppHeader,
   IncludeExcludeChipFilter

package/components/table/Table.types.d.ts

@@ -6,6 +6,7 @@ export type Column = {
     isSortable?: boolean;
     colSpan?: number;
     width?: number;
+    isTextRight?: boolean;
 };
 export type Section = {
     id: string;

package/components/table/Table.vue.d.ts

@@ -6,6 +6,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     sections?: Section[];
     sort: Sort;
     isSticky?: boolean;
+    isStickyHeader?: boolean;
     isLoading?: boolean;
     emptyStateTitle?: string;
     emptyStateSubtitle?: string;
@@ -13,9 +14,11 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     infiniteScrollThreshold?: number;
     rowHeight?: number | ((index: number) => number);
     loadingRowCount?: number;
+    defaultScrollPosition?: number;
     testId?: string;
 }>, {
     isSticky: boolean;
+    isStickyHeader: boolean;
     sections: any;
     isLoading: boolean;
     sortOrder: string;
@@ -25,9 +28,12 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     infiniteScrollThreshold: number;
     rowHeight: number;
     loadingRowCount: number;
+    defaultScrollPosition: any;
     testId: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:sort": (newSort: Sort) => void;
+} & {
+    onScroll: (event: Event) => void;
 } & {
     saveRow: (payload_0: {
         value: unknown;
@@ -44,6 +50,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     sections?: Section[];
     sort: Sort;
     isSticky?: boolean;
+    isStickyHeader?: boolean;
     isLoading?: boolean;
     emptyStateTitle?: string;
     emptyStateSubtitle?: string;
@@ -51,9 +58,11 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     infiniteScrollThreshold?: number;
     rowHeight?: number | ((index: number) => number);
     loadingRowCount?: number;
+    defaultScrollPosition?: number;
     testId?: string;
 }>, {
     isSticky: boolean;
+    isStickyHeader: boolean;
     sections: any;
     isLoading: boolean;
     sortOrder: string;
@@ -63,8 +72,10 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     infiniteScrollThreshold: number;
     rowHeight: number;
     loadingRowCount: number;
+    defaultScrollPosition: any;
     testId: string;
 }>>> & {
+    onOnScroll?: (event: Event) => any;
     "onUpdate:sort"?: (newSort: Sort) => any;
     onSaveRow?: (args_0: {
         value: unknown;
@@ -77,6 +88,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     testId: string;
     isLoading: boolean;
     isSticky: boolean;
+    isStickyHeader: boolean;
     sections: Section[];
     emptyStateTitle: string;
     emptyStateSubtitle: string;
@@ -84,6 +96,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     infiniteScrollThreshold: number;
     rowHeight: number | ((index: number) => number);
     loadingRowCount: number;
+    defaultScrollPosition: number;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/components/table/Table.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, useCssVars, unref, ref, provide, computed, onMounted, openBlock, createElementBlock, createElementVNode, normalizeStyle, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, createCommentVNode, normalizeClass, Fragment, renderList, createBlock, mergeProps, withDirectives, vShow } from 'vue';
+import { defineComponent, useCssVars, unref, ref, provide, computed, useSlots, onMounted, openBlock, createElementBlock, createElementVNode, normalizeStyle, normalizeClass, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, createCommentVNode, Fragment, renderList, createBlock, mergeProps, withDirectives, vShow } from 'vue';
 import { TableTestIdModifiers } from '../../testids/index.vue.js';
 /* empty css                                                                     */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
 import Text from '../typography/Text.vue.js';
@@ -32,6 +32,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     sections: { default: null },
     sort: null,
     isSticky: { type: Boolean, default: true },
+    isStickyHeader: { type: Boolean, default: false },
     isLoading: { type: Boolean, default: false },
     emptyStateTitle: { default: "No results found" },
     emptyStateSubtitle: { default: "Try again with different filters" },
@@ -39,13 +40,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     infiniteScrollThreshold: { default: 100 },
     rowHeight: { type: [Number, Function], default: 48 },
     loadingRowCount: { default: 3 },
+    defaultScrollPosition: { default: null },
     testId: { default: "" }
   },
-  emits: ["update:sort", "saveRow", "loadMore"],
+  emits: ["update:sort", "onScroll", "saveRow", "loadMore"],
   setup(__props, { emit }) {
     const props = __props;
     useCssVars((_ctx) => ({
-      "04775a54": unref(gridColumnTemplate)
+      "7bbb8810": unref(gridColumnTemplate)
     }));
     const savingRows = ref([]);
     provide(TableContext, {
@@ -65,6 +67,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     const gridColumnTemplate = computed(() => {
       return props.columns.reduce((acc, column) => {
+        if (column === props.columns[props.columns.length - 1] && column.width) {
+          return `${acc} minmax(${column.width}px, 1fr)`;
+        }
         const columnTemplate = column.width ? `${column.width}px` : `${column.colSpan || 1}fr`;
         return `${acc} ${columnTemplate}`;
       }, "");
@@ -83,12 +88,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     const floatingActionRef = ref(null);
     const floatingActionPosition = ref(0);
+    const slots = useSlots();
+    const hasSearchSlot = computed(() => !!slots.search);
     const onScroll = (event) => {
       containerProps.onScroll();
       floatingActionPosition.value = event.target.scrollLeft + event.target.getBoundingClientRect().width;
+      emit("onScroll", event.target.scrollTop);
     };
     onMounted(() => {
       floatingActionPosition.value = containerProps.ref.value?.getBoundingClientRect().width;
+      if (props.defaultScrollPosition) {
+        setTimeout(() => {
+          containerProps.ref.value.scrollTo({
+            top: props.defaultScrollPosition,
+            behavior: "smooth"
+          });
+        }, 300);
+      }
     });
     const showBackToTopButton = computed(() => {
       const [firstListItem] = list.value;
@@ -161,11 +177,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }, [
           __props.title || _ctx.$slots["search"] ? (openBlock(), createElementBlock("div", {
             key: 0,
-            class: "table-header",
+            class: normalizeClass(["table-header", { isStickyHeader: __props.isStickyHeader }]),
             "data-testid": `${__props.testId}-${unref(TableTestIdModifiers).HEADER}`
           }, [
             createElementVNode("div", {
-              class: "table-title",
+              class: normalizeClass(["table-title", unref(hasSearchSlot) ? "border-search" : ""]),
               "data-testid": `${__props.testId}-${unref(TableTestIdModifiers).TITLE}`
             }, [
               renderSlot(_ctx.$slots, "title", {}, () => [
@@ -179,7 +195,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   _: 1
                 })
               ], true)
-            ], 8, _hoisted_4),
+            ], 10, _hoisted_4),
             createElementVNode("div", {
               class: "table-header-right",
               "data-testid": `${__props.testId}-${unref(TableTestIdModifiers).HEADER_RIGHT}`
@@ -192,9 +208,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, [
               renderSlot(_ctx.$slots, "table-header-actions", {}, void 0, true)
             ], 8, _hoisted_6)
-          ], 8, _hoisted_3)) : createCommentVNode("", true),
+          ], 10, _hoisted_3)) : createCommentVNode("", true),
           createElementVNode("thead", {
-            class: normalizeClass({ sticky: __props.isSticky })
+            class: normalizeClass({ sticky: __props.isSticky, isStickyHeader: __props.isStickyHeader })
           }, [
             createElementVNode("div", {
               class: "sections",
@@ -225,7 +241,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               (openBlock(true), createElementBlock(Fragment, null, renderList(__props.columns, (column) => {
                 return openBlock(), createElementBlock("th", {
                   key: column.id,
-                  class: normalizeClass({ sticky: column.isSticky, bordered: column.isBordered }),
+                  class: normalizeClass({
+                    sticky: column.isSticky,
+                    bordered: column.isBordered,
+                    isTextRight: column.isTextRight,
+                    isSortable: column.isSortable
+                  }),
                   style: normalizeStyle(column.isSticky ? unref(columnsStickyPositions)[column.id] : null),
                   onClick: ($event) => toggleSortOrder(column)
                 }, [
@@ -286,7 +307,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       key: cellIndex,
                       class: normalizeClass({
                         sticky: __props.columns[cellIndex].isSticky,
-                        bordered: __props.columns[cellIndex].isBordered
+                        bordered: __props.columns[cellIndex].isBordered,
+                        isTextRight: __props.columns[cellIndex].isTextRight
                       }),
                       style: normalizeStyle(
                         __props.columns[cellIndex].isSticky ? unref(columnsStickyPositions)[__props.columns[cellIndex].id] : null
@@ -341,6 +363,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var Table = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-392e31d7"]]);
+var Table = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-91b0dc76"]]);
 
 export { Table as default };