@ouestfrance/sipa-bms-ui 8.1.4 → 8.2.0

package/dist/components/form/BmsMultiSelect.vue.d.ts

@@ -0,0 +1,29 @@
+import { Caption, InputOption } from '../../models';
+export interface Props {
+    options: InputOption[];
+    label?: string;
+    errors?: string[] | Caption[];
+    captions?: string[] | Caption[];
+    required?: boolean;
+    optional?: boolean;
+    disabled?: boolean;
+    helperText?: string;
+    placeholder?: string;
+}
+type __VLS_Props = Props;
+type __VLS_PublicProps = {
+    'modelValue': InputOption[];
+    'open'?: boolean;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: InputOption[]) => any;
+    "update:open": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: InputOption[]) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+    label: string;
+    required: boolean;
+    disabled: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/form/BmsSelect.vue.d.ts

@@ -10,25 +10,36 @@ export interface Props {
     disabled?: boolean;
     helperText?: string;
     placeholder?: string;
-    open?: boolean;
 }
 type __VLS_Props = Props;
 type __VLS_PublicProps = {
     'modelValue': any;
+    'open'?: boolean;
 } & __VLS_Props;
-declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__VLS_PublicProps, {
     setFocus: () => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: any) => any;
+    "update:open": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
     label: string;
     required: boolean;
     disabled: boolean;
-    open: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     selectWrapper: HTMLSpanElement;
     selectInput: HTMLInputElement;
-}, any>;
+}, any>, {
+    input?(_: {}): any;
+    option?(_: {
+        option: any;
+    }): any;
+}>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table/BmsServerTable.vue.d.ts

@@ -47,11 +47,11 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__
 }>, {
     mode: "normal" | "dense";
     size: number;
+    selectedItems: unknown[];
     selectable: boolean;
+    selectMode: SelectMode;
     selectableDisabled: boolean;
-    selectedItems: unknown[];
     maxSelectedSize: number;
-    selectMode: SelectMode;
     pagination: number[];
     canSaveFilters: boolean;
     filters: Filter[];

package/dist/components/table/UiBmsTable.vue.d.ts

@@ -33,9 +33,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__
 }>, {
     sort: Sort;
     mode: "normal" | "dense";
-    hasFilters: boolean;
     selectable: boolean;
+    selectMode: SelectMode;
     selectableDisabled: boolean;
+    hasFilters: boolean;
     maxSelectedSize: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     blob: HTMLDivElement;
@@ -43,9 +44,11 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__
     thead: HTMLTableSectionElement;
     pagination: HTMLDivElement;
 }, HTMLDivElement>, Partial<Record<string, (_: {
-    row: unknown;
+    row: any;
+    isChildElement: false | undefined;
 }) => any>> & Partial<Record<string, (_: {
-    row: unknown;
+    row: any;
+    isChildElement: false | undefined;
 }) => any>> & {
     'custom-actions'?(_: {}): any;
     'saved-filters'?(_: {}): any;
@@ -53,8 +56,9 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__
     filters?(_: {}): any;
     'alert-action'?(_: {}): any;
     default?(_: {
-        row: unknown;
+        row: any;
     }): any;
+    'child-element'?(_: {}): any;
     empty?(_: {}): any;
     pagination?(_: {}): any;
 }>;

package/dist/components/table/UiBmsTableRow.vue.d.ts

@@ -0,0 +1,38 @@
+import { SelectMode, TableHeader } from '../../models';
+interface Props {
+    item: any;
+    selectedItems: any[];
+    selectable: boolean;
+    headers: TableHeader[];
+    selectMode: SelectMode;
+    selectableDisabled?: boolean;
+    dense?: boolean;
+    isChildElement?: boolean;
+}
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (item: any) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onSelect?: ((item: any) => any) | undefined;
+}>, {
+    dense: boolean;
+    selectableDisabled: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLTableRowElement>, Partial<Record<string, (_: {
+    row: any;
+    isChildElement: true;
+}) => any>> & Partial<Record<string, (_: {
+    row: any;
+    isChildElement: false | undefined;
+}) => any>> & Partial<Record<string, (_: {
+    row: any;
+    isChildElement: false | undefined;
+}) => any>> & {
+    default?(_: {
+        row: any;
+    }): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/composables/search.composable.d.ts

@@ -5,7 +5,7 @@ export declare const useSearch: (persistent?: boolean | Ref<boolean>, defaultFil
     reflect: Ref<boolean, boolean>;
     filters: Ref<{
         label: string;
-        inputType?: string | undefined;
+        inputType?: import('../models').InputType | undefined;
         key: string;
         type: import('../models').FilterType;
         value?: any;
@@ -22,7 +22,7 @@ export declare const useSearch: (persistent?: boolean | Ref<boolean>, defaultFil
         customFilter?: Function | undefined;
     }[], Filter[] | {
         label: string;
-        inputType?: string | undefined;
+        inputType?: import('../models').InputType | undefined;
         key: string;
         type: import('../models').FilterType;
         value?: any;

package/dist/index.d.ts

@@ -25,6 +25,7 @@ import { default as BmsInputRadioCaption } from './components/form/BmsInputRadio
 import { default as BmsInputRadioCaptionGroup } from './components/form/BmsInputRadioCaptionGroup.vue';
 import { default as BmsInputText } from './components/form/BmsInputText.vue';
 import { default as BmsInputToggle } from './components/form/BmsInputToggle.vue';
+import { default as BmsMultiSelect } from './components/form/BmsMultiSelect.vue';
 import { default as BmsSearch } from './components/form/BmsSearch.vue';
 import { default as BmsSelect } from './components/form/BmsSelect.vue';
 import { default as BmsTag } from './components/form/BmsTag.vue';
@@ -69,4 +70,4 @@ export * from './plugins/confirm';
 export * from './plugins/runtime-env';
 export * from './plugins/router-history';
 export * from './services';
-export { BmsButton, BmsIconButton, BmsAlert, BmsBadge, BmsCaption, BmsCircularProgress, BmsLoader, BmsTooltip, BmsAutocomplete, BmsBetweenInput, BmsChip, BmsFilePicker, BmsInputBooleanCheckbox, BmsInputCheckboxGroup, BmsInputCheckboxCaption, BmsInputCheckboxCaptionGroup, BmsInputCode, BmsInputDateTime, BmsInputFile, BmsInputNumber, BmsInputRadio, BmsInputRadioGroup, BmsInputRadioCaption, BmsInputRadioCaptionGroup, BmsInputText, BmsInputToggle, BmsSearch, BmsSelect, BmsTag, BmsTextArea, BmsContentPageLayout, BmsCard, BmsForm, BmsHeader, BmsHeaderTitle, BmsModal, BmsOverlay, BmsSection, BmsStep, BmsStepper, BmsBackButton, BmsBreadcrumb, BmsLink, BmsMenu, BmsMenuNav, BmsShortLinkMenu, BmsTabs, BmsTenantSwitcher, BmsDraggableList, BmsEmptyScreen, BmsPagination, BmsServerTable, BmsTable, BmsCocarde, BmsProblem, BmsRelativeTime, };
+export { BmsButton, BmsIconButton, BmsAlert, BmsBadge, BmsCaption, BmsCircularProgress, BmsLoader, BmsTooltip, BmsAutocomplete, BmsBetweenInput, BmsChip, BmsFilePicker, BmsInputBooleanCheckbox, BmsInputCheckboxGroup, BmsInputCheckboxCaption, BmsInputCheckboxCaptionGroup, BmsInputCode, BmsInputDateTime, BmsInputFile, BmsInputNumber, BmsInputRadio, BmsInputRadioGroup, BmsInputRadioCaption, BmsInputRadioCaptionGroup, BmsInputText, BmsInputToggle, BmsMultiSelect, BmsSearch, BmsSelect, BmsTag, BmsTextArea, BmsContentPageLayout, BmsCard, BmsForm, BmsHeader, BmsHeaderTitle, BmsModal, BmsOverlay, BmsSection, BmsStep, BmsStepper, BmsBackButton, BmsBreadcrumb, BmsLink, BmsMenu, BmsMenuNav, BmsShortLinkMenu, BmsTabs, BmsTenantSwitcher, BmsDraggableList, BmsEmptyScreen, BmsPagination, BmsServerTable, BmsTable, BmsCocarde, BmsProblem, BmsRelativeTime, };

package/dist/mockServiceWorker.js

@@ -7,7 +7,7 @@
  * - Please do NOT modify this file.
  */
 
-const PACKAGE_VERSION = '2.10.2'
+const PACKAGE_VERSION = '2.10.3'
 const INTEGRITY_CHECKSUM = 'f5825c521429caf22a4dd13b66e243af'
 const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
 const activeClientIds = new Set()

package/dist/models/table.model.d.ts

@@ -1,3 +1,4 @@
+import { InputType } from './form.model';
 import { Sort, SortFunction } from './sort.model';
 export interface TableHeader {
     label: string;
@@ -20,7 +21,7 @@ export interface ServerTableRequestParams {
 export type FilterType = 'select' | 'input' | 'inputDate' | 'boolean' | 'autocomplete' | 'betweenNumber' | 'betweenDate' | 'betweenDateTime';
 export interface Filter {
     label: string;
-    inputType?: string;
+    inputType?: InputType;
     key: string;
     type: FilterType;
     value?: any;

package/dist/sipa-bms-ui.css

@@ -1083,61 +1083,60 @@ input[type=radio][data-v-cb26402d]:checked::before {
 }
 .input-toggle[data-v-2d2ac60e]:hover {
   cursor: var(--cursor);
-}.clean-icon[data-v-66c267f2]:hover {
-  cursor: pointer;
-}.field__input[data-v-32aead3c] {
+}.field__input[data-v-c57d6d77] {
   --field-border-color: var(--bms-grey-50);
   --field-border-color-active: var(--bms-main-100);
   --input-background-color: var(--bms-white);
 }
-.field__input .select-wrapper[data-v-32aead3c] {
+.field__input .select-wrapper[data-v-c57d6d77] {
   width: 100%;
-  padding: 0;
+  padding: 0 0 0 1em;
   margin: 0.5em 0;
   border-radius: var(--bms-border-radius);
   border: 1px solid var(--field-border-color);
   background-color: var(--input-background-color);
-  height: 48px;
+  min-height: 48px;
   display: flex;
   align-items: center;
+  justify-content: space-between;
 }
-.field__input .select-wrapper .icon-down-container[data-v-32aead3c] {
+.field__input .select-wrapper .icon-down-container[data-v-c57d6d77] {
   height: 100%;
   display: flex;
   align-items: center;
 }
-.field__input .select-wrapper .icon-down-container[data-v-32aead3c]:hover {
+.field__input .select-wrapper .icon-down-container[data-v-c57d6d77]:hover {
   cursor: pointer;
 }
-.field__input .select-wrapper .icon-down-button[data-v-32aead3c] {
+.field__input .select-wrapper .icon-down-button[data-v-c57d6d77] {
   width: 1em;
   margin: 0 1em 0 0.5em;
   display: block;
 }
-.field__input .select-wrapper[data-v-32aead3c]:hover {
+.field__input .select-wrapper[data-v-c57d6d77]:hover {
   --field-border-color: var(--bms-grey-100);
 }
-.field__input .select-wrapper[data-v-32aead3c]:has(input:focus) {
+.field__input .select-wrapper[data-v-c57d6d77]:has(input:focus) {
   --field-border-color: var(--field-border-color-active);
 }
-.field__input .select-wrapper.is-error[data-v-32aead3c] {
+.field__input .select-wrapper.is-error[data-v-c57d6d77] {
   --field-border-color: var(--bms-red-100);
   --input-background-color: var(--bms-red-25);
 }
-.field__input .select-wrapper.is-disabled[data-v-32aead3c] {
+.field__input .select-wrapper.is-disabled[data-v-c57d6d77] {
   --field-border-color: var(--bms-grey-25);
   --input-background-color: var(--bms-grey-25);
   pointer-events: none;
 }
-.field__input .select-wrapper input[data-v-32aead3c] {
+.field__input .select-wrapper input[data-v-c57d6d77] {
   border: none;
   background-color: transparent;
   caret-color: transparent;
   cursor: pointer;
   outline: none;
   appearance: none;
-  padding: 0 0 0 1em;
   margin: 0;
+  padding: 0;
   font: inherit;
   color: inherit;
   height: 24px;
@@ -1205,6 +1204,33 @@ input[type=radio][data-v-cb26402d]:checked::before {
 }
 .tag .dismiss-button[data-v-3c04a9f9] .bms-button:hover {
   background-color: var(--tag-background-color);
+}.tags[data-v-a6e4687c] {
+  display: flex;
+  gap: 0.5em;
+  padding: 10px 0;
+  flex-wrap: wrap;
+  width: 100%;
+}
+.tags .search[data-v-a6e4687c] {
+  outline: none;
+  border: none;
+  background-color: transparent;
+  flex-grow: 1;
+}
+.icon-container[data-v-a6e4687c] {
+  height: 100%;
+  display: flex;
+  align-items: center;
+}
+.icon-container[data-v-a6e4687c]:hover {
+  cursor: pointer;
+}
+.icon-button[data-v-a6e4687c] {
+  width: 1em;
+  margin: 0 1em 0 0.5em;
+  display: block;
+}.clean-icon[data-v-66c267f2]:hover {
+  cursor: pointer;
 }.field__input textarea[data-v-ec1c11a0] {
   display: flex;
   align-items: center;
@@ -2067,13 +2093,48 @@ nav .additional[data-v-f1abaa99] {
 .bms-pagination__select[data-v-e10f3b80] .field__wrapper {
   min-width: 10em;
   width: 10em;
-}.bms-table[data-v-a100cc9a] {
+}.bms-table__row[data-v-e0f602cf] {
+  --table-cell-padding: 1em;
+  background-color: rgb(255, 255, 255);
+}
+.bms-table__row td[data-v-e0f602cf] {
+  padding: var(--table-cell-padding);
+  background-color: rgb(255, 255, 255);
+}
+.bms-table__row--dense[data-v-e0f602cf] {
+  --table-cell-padding: 0.5em 1em;
+}
+.bms-table__row--selected td[data-v-e0f602cf] {
+  background-color: var(--bms-main-10);
+}
+.bms-table__row--disabled td[data-v-e0f602cf] {
+  color: var(--bms-grey-50);
+}
+.bms-table__row__cell__checkbox[data-v-e0f602cf] {
+  width: 4em;
+}
+.bms-table__row__cell--action[data-v-e0f602cf] {
+  display: flex;
+  justify-content: end;
+}
+.bms-table__row__cell--empty[data-v-e0f602cf] {
+  height: 360px;
+}
+.bms-table__row__cell--child-element[data-v-e0f602cf] {
+  display: inline-flex;
+  align-items: flex-end;
+}
+.bms-table__row__cell--child-element__icon[data-v-e0f602cf] {
+  display: flex;
+  min-width: 1em;
+  margin-right: 1em;
+}.bms-table[data-v-9cbfc981] {
   --table-cell-padding: 1em;
   --table-cell-radius: var(--bms-border-radius-large);
   --dynamic-border-height: 2px;
   --table-border: 1px solid var(--bms-grey-10);
 }
-.bms-table__loader[data-v-a100cc9a] {
+.bms-table__loader[data-v-9cbfc981] {
   position: absolute;
   background: rgba(255, 255, 255, 0.72);
   inset: 0;
@@ -2083,103 +2144,103 @@ nav .additional[data-v-f1abaa99] {
   font-size: 3em;
   z-index: 10;
 }
-.bms-table__actions[data-v-a100cc9a] {
+.bms-table__actions[data-v-9cbfc981] {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 16px;
 }
-.bms-table__actions__saved-filters[data-v-a100cc9a] {
+.bms-table__actions__saved-filters[data-v-9cbfc981] {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 1em;
 }
-.bms-table__actions__search[data-v-a100cc9a] {
+.bms-table__actions__search[data-v-9cbfc981] {
   display: flex;
   align-items: center;
   gap: 1em;
 }
-.bms-table__actions__custom[data-v-a100cc9a] {
+.bms-table__actions__custom[data-v-9cbfc981] {
   display: flex;
   gap: 1em;
 }
-.bms-table__actions__custom[data-v-a100cc9a]:empty {
+.bms-table__actions__custom[data-v-9cbfc981]:empty {
   display: none;
 }
-.bms-table__selected[data-v-a100cc9a] {
+.bms-table__selected[data-v-9cbfc981] {
   margin-bottom: 1em;
 }
-.bms-table__selected .select-mode-all[data-v-a100cc9a] {
+.bms-table__selected .select-mode-all[data-v-9cbfc981] {
   cursor: pointer;
   color: var(--bms-main-100);
 }
-.bms-table__cell__checkbox[data-v-a100cc9a] {
+.bms-table__cell__checkbox[data-v-9cbfc981] {
   width: 4em;
 }
-.bms-table__cell--action[data-v-a100cc9a] {
+.bms-table__cell--action[data-v-9cbfc981] {
   display: flex;
   justify-content: end;
 }
-.bms-table__cell--empty[data-v-a100cc9a] {
+.bms-table__cell--empty[data-v-9cbfc981] {
   height: 360px;
 }
-.bms-table__table[data-v-a100cc9a] {
+.bms-table__table[data-v-9cbfc981] {
   width: 100%;
   border-spacing: 0 var(--dynamic-border-height);
   border-radius: var(--bms-border-radius-large);
   border: var(--table-border);
   position: relative;
 }
-.bms-table__table-wrapper[data-v-a100cc9a] {
+.bms-table__table-wrapper[data-v-9cbfc981] {
   position: relative;
 }
-.bms-table__table thead[data-v-a100cc9a] {
+.bms-table__table thead[data-v-9cbfc981] {
   position: sticky;
   z-index: 2;
   top: var(--header-height, 0);
 }
-.bms-table__table--dense[data-v-a100cc9a] {
+.bms-table__table--dense[data-v-9cbfc981] {
   --table-cell-padding: 0.5em 1em;
 }
-.bms-table__table[data-v-a100cc9a] tr td {
+.bms-table__table[data-v-9cbfc981] tr td {
   padding: var(--table-cell-padding);
 }
-.bms-table__table[data-v-a100cc9a] tr th {
+.bms-table__table th[data-v-9cbfc981] {
   --header-content-sort-icon-color: var(--bms-grey-25);
   --header-content-justify: start;
   width: var(--table-cell-width, auto);
   padding: var(--table-cell-padding);
 }
-.bms-table__table[data-v-a100cc9a] tr th.sortable:hover {
+.bms-table__table th.sortable[data-v-9cbfc981]:hover {
   --header-content-sort-icon-color: var(--bms-grey-100);
   cursor: pointer;
 }
-.bms-table__table[data-v-a100cc9a] tr th.u-text-align-start {
+.bms-table__table th.u-text-align-start[data-v-9cbfc981] {
   --header-content-justify: start;
 }
-.bms-table__table[data-v-a100cc9a] tr th.u-text-align-center {
+.bms-table__table th.u-text-align-center[data-v-9cbfc981] {
   --header-content-justify: center;
 }
-.bms-table__table[data-v-a100cc9a] tr th.u-text-align-end {
+.bms-table__table th.u-text-align-end[data-v-9cbfc981] {
   --header-content-justify: end;
 }
-.bms-table__table[data-v-a100cc9a] tr th.sorted {
+.bms-table__table th.sorted[data-v-9cbfc981] {
   --header-content-sort-icon-color: var(--bms-grey-100);
 }
-.bms-table__table[data-v-a100cc9a] tr th .header-content {
+.bms-table__table th .header-content[data-v-9cbfc981] {
   display: flex;
   align-items: center;
   justify-content: var(--header-content-justify);
   gap: 0.5em;
 }
-.bms-table__table[data-v-a100cc9a] tr th .header-content-sort {
+.bms-table__table th .header-content-sort[data-v-9cbfc981] {
   color: var(--header-content-sort-icon-color);
 }
-.bms-table__footer[data-v-a100cc9a] {
+.bms-table__footer[data-v-9cbfc981] {
   padding-top: 16px;
 }
-.bms-table .blob[data-v-a100cc9a] {
+.bms-table .blob[data-v-9cbfc981] {
   visibility: hidden;
   --table-blob-height: 80px;
   width: 200px;
@@ -2190,41 +2251,39 @@ nav .additional[data-v-f1abaa99] {
   z-index: -5;
   filter: blur(20px);
 }
-.bms-table .blob.dense[data-v-a100cc9a] {
+.bms-table .blob.dense[data-v-9cbfc981] {
   --table-blob-height: 50px;
 }
-[data-v-a100cc9a] table {
+[data-v-9cbfc981] table {
   padding: 0 var(--dynamic-border-height);
 }
-[data-v-a100cc9a] table th:first-child {
+[data-v-9cbfc981] table th:first-child {
   border-top-left-radius: var(--table-cell-radius);
 }
-[data-v-a100cc9a] table .stuck th:first-child {
+[data-v-9cbfc981] table .stuck th:first-child {
   border-top-left-radius: 0;
 }
-[data-v-a100cc9a] table .stuck th:last-child {
+[data-v-9cbfc981] table .stuck th:last-child {
   border-top-right-radius: 0;
 }
-[data-v-a100cc9a] table th:last-child {
+[data-v-9cbfc981] table th:last-child {
   border-top-right-radius: var(--table-cell-radius);
 }
-[data-v-a100cc9a] table tr:last-child td:first-child {
+[data-v-9cbfc981] table tr:last-child td:first-child {
   border-bottom-left-radius: var(--table-cell-radius);
 }
-[data-v-a100cc9a] table tr:last-child td:last-child {
+[data-v-9cbfc981] table tr:last-child td:last-child {
   border-bottom-right-radius: var(--table-cell-radius);
 }
-[data-v-a100cc9a] table td,[data-v-a100cc9a] table th {
+[data-v-9cbfc981] table th {
   background-color: rgb(255, 255, 255);
 }
-[data-v-a100cc9a] table tbody {
+[data-v-9cbfc981] table tbody {
   overflow: hidden;
+  background: white;
 }
-[data-v-a100cc9a] table tbody tr {
+[data-v-9cbfc981] table tbody tr {
   position: relative;
-}
-[data-v-a100cc9a] table tbody tr.selected td {
-  background-color: var(--bms-main-10);
 }.filter-button-container[data-v-6047ada7] {
   position: relative;
 }