@morscherlab/mint-sdk 1.0.0-alpha.8 → 1.0.0-beta.1

package/src/__tests__/components/DataFrame.test.ts

@@ -21,15 +21,15 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      expect(wrapper.find('.mld-dataframe').exists()).toBe(true)
-      expect(wrapper.find('.mld-dataframe__table').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__table').exists()).toBe(true)
     })
 
     it('should render column headers', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const headers = wrapper.findAll('.mld-dataframe__th')
+      const headers = wrapper.findAll('.mint-dataframe__th')
       expect(headers).toHaveLength(3)
       expect(headers[0].text()).toBe('Name')
       expect(headers[1].text()).toBe('Age')
@@ -40,7 +40,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(3)
     })
 
@@ -48,8 +48,8 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const firstRow = wrapper.findAll('.mld-dataframe__row')[0]
-      const cells = firstRow.findAll('.mld-dataframe__td')
+      const firstRow = wrapper.findAll('.mint-dataframe__row')[0]
+      const cells = firstRow.findAll('.mint-dataframe__td')
       expect(cells[0].text()).toBe('Alice')
       expect(cells[1].text()).toBe('30')
       expect(cells[2].text()).toBe('alice@example.com')
@@ -59,15 +59,15 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      expect(wrapper.find('.mld-dataframe--bordered').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe--bordered').exists()).toBe(true)
     })
 
     it('should apply striped rows by default', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const rows = wrapper.findAll('.mld-dataframe__row')
-      expect(rows[1].classes()).toContain('mld-dataframe__row--striped')
+      const rows = wrapper.findAll('.mint-dataframe__row')
+      expect(rows[1].classes()).toContain('mint-dataframe__row--striped')
     })
   })
 
@@ -76,8 +76,8 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const ageHeader = wrapper.findAll('.mld-dataframe__th')[1]
-      expect(ageHeader.classes()).toContain('mld-dataframe__th--align-right')
+      const ageHeader = wrapper.findAll('.mint-dataframe__th')[1]
+      expect(ageHeader.classes()).toContain('mint-dataframe__th--align-right')
     })
 
     it('should apply column width', () => {
@@ -87,7 +87,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns },
       })
-      const header = wrapper.find('.mld-dataframe__th')
+      const header = wrapper.find('.mint-dataframe__th')
       expect(header.attributes('style')).toContain('width: 200px')
     })
 
@@ -98,7 +98,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns },
       })
-      const header = wrapper.find('.mld-dataframe__th')
+      const header = wrapper.find('.mint-dataframe__th')
       expect(header.attributes('style')).toContain('width: 20rem')
     })
 
@@ -109,7 +109,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns },
       })
-      const header = wrapper.find('.mld-dataframe__th')
+      const header = wrapper.find('.mint-dataframe__th')
       expect(header.attributes('style')).toContain('min-width: 150px')
     })
 
@@ -120,8 +120,8 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns },
       })
-      const cell = wrapper.find('.mld-dataframe__td')
-      expect(cell.classes()).toContain('mld-dataframe__td--ellipsis')
+      const cell = wrapper.find('.mint-dataframe__td')
+      expect(cell.classes()).toContain('mint-dataframe__td--ellipsis')
     })
 
     it('should use custom formatter', () => {
@@ -135,7 +135,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns },
       })
-      const ageCell = wrapper.findAll('.mld-dataframe__row')[0].findAll('.mld-dataframe__td')[0]
+      const ageCell = wrapper.findAll('.mint-dataframe__row')[0].findAll('.mint-dataframe__td')[0]
       expect(ageCell.text()).toBe('30 years old')
     })
   })
@@ -150,7 +150,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: sortableColumns },
       })
-      const sortIcons = wrapper.findAll('.mld-dataframe__sort-icon')
+      const sortIcons = wrapper.findAll('.mint-dataframe__sort-icon')
       expect(sortIcons).toHaveLength(2)
     })
 
@@ -158,15 +158,15 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: sortableColumns },
       })
-      const headers = wrapper.findAll('.mld-dataframe__th')
-      expect(headers[0].classes()).toContain('mld-dataframe__th--sortable')
+      const headers = wrapper.findAll('.mint-dataframe__th')
+      expect(headers[0].classes()).toContain('mint-dataframe__th--sortable')
     })
 
     it('should sort ascending on first click', async () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: sortableColumns },
       })
-      const nameHeader = wrapper.findAll('.mld-dataframe__th')[0]
+      const nameHeader = wrapper.findAll('.mint-dataframe__th')[0]
       await nameHeader.trigger('click')
 
       expect(wrapper.emitted('update:sort')).toHaveLength(1)
@@ -183,7 +183,7 @@ describe('DataFrame', () => {
           sort: { key: 'name', direction: 'asc' },
         },
       })
-      const nameHeader = wrapper.findAll('.mld-dataframe__th')[0]
+      const nameHeader = wrapper.findAll('.mint-dataframe__th')[0]
       await nameHeader.trigger('click')
 
       const sortState = wrapper.emitted('update:sort')?.[0]?.[0] as SortState
@@ -198,7 +198,7 @@ describe('DataFrame', () => {
           sort: { key: 'name', direction: 'desc' },
         },
       })
-      const nameHeader = wrapper.findAll('.mld-dataframe__th')[0]
+      const nameHeader = wrapper.findAll('.mint-dataframe__th')[0]
       await nameHeader.trigger('click')
 
       const sortState = wrapper.emitted('update:sort')?.[0]?.[0]
@@ -209,12 +209,12 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: sortableColumns },
       })
-      const nameHeader = wrapper.findAll('.mld-dataframe__th')[0]
+      const nameHeader = wrapper.findAll('.mint-dataframe__th')[0]
       await nameHeader.trigger('click')
 
       // After sorting, first row should have name starting with 'A'
-      const firstRow = wrapper.findAll('.mld-dataframe__row')[0]
-      const cells = firstRow.findAll('.mld-dataframe__td')
+      const firstRow = wrapper.findAll('.mint-dataframe__row')[0]
+      const cells = firstRow.findAll('.mint-dataframe__td')
       expect(cells[0].text()).toBe('Alice')
     })
 
@@ -222,12 +222,12 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: sortableColumns },
       })
-      const ageHeader = wrapper.findAll('.mld-dataframe__th')[1]
+      const ageHeader = wrapper.findAll('.mint-dataframe__th')[1]
       await ageHeader.trigger('click')
 
       // After sorting ascending, first row should have age 25
-      const firstRow = wrapper.findAll('.mld-dataframe__row')[0]
-      const cells = firstRow.findAll('.mld-dataframe__td')
+      const firstRow = wrapper.findAll('.mint-dataframe__row')[0]
+      const cells = firstRow.findAll('.mint-dataframe__td')
       expect(cells[1].text()).toBe('25')
     })
 
@@ -239,8 +239,8 @@ describe('DataFrame', () => {
           sort: { key: 'name', direction: 'asc' },
         },
       })
-      const nameHeader = wrapper.findAll('.mld-dataframe__th')[0]
-      expect(nameHeader.classes()).toContain('mld-dataframe__th--sorted')
+      const nameHeader = wrapper.findAll('.mint-dataframe__th')[0]
+      expect(nameHeader.classes()).toContain('mint-dataframe__th--sorted')
     })
 
     it('should enable sorting globally with sortable prop', () => {
@@ -251,7 +251,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns, sortable: true },
       })
-      const sortableHeaders = wrapper.findAll('.mld-dataframe__th--sortable')
+      const sortableHeaders = wrapper.findAll('.mint-dataframe__th--sortable')
       expect(sortableHeaders).toHaveLength(2)
     })
   })
@@ -261,17 +261,17 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, searchable: true },
       })
-      expect(wrapper.find('.mld-dataframe__search').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__search').exists()).toBe(true)
     })
 
     it('should filter data based on search query', async () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, searchable: true },
       })
-      const searchInput = wrapper.find('.mld-dataframe__search')
+      const searchInput = wrapper.find('.mint-dataframe__search')
       await searchInput.setValue('Alice')
 
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(1)
       expect(rows[0].text()).toContain('Alice')
     })
@@ -280,10 +280,10 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, searchable: true },
       })
-      const searchInput = wrapper.find('.mld-dataframe__search')
+      const searchInput = wrapper.find('.mint-dataframe__search')
       await searchInput.setValue('bob@example.com')
 
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(1)
       expect(rows[0].text()).toContain('Bob')
     })
@@ -297,11 +297,11 @@ describe('DataFrame', () => {
           searchKeys: ['name'],
         },
       })
-      const searchInput = wrapper.find('.mld-dataframe__search')
+      const searchInput = wrapper.find('.mint-dataframe__search')
       await searchInput.setValue('bob@example.com')
 
       // Should not find Bob by email since we're only searching name
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(0)
     })
 
@@ -309,10 +309,10 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, searchable: true },
       })
-      const searchInput = wrapper.find('.mld-dataframe__search')
+      const searchInput = wrapper.find('.mint-dataframe__search')
       await searchInput.setValue('ALICE')
 
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(1)
     })
 
@@ -325,7 +325,7 @@ describe('DataFrame', () => {
           searchPlaceholder: 'Type to search...',
         },
       })
-      const searchInput = wrapper.find('.mld-dataframe__search')
+      const searchInput = wrapper.find('.mint-dataframe__search')
       expect(searchInput.attributes('placeholder')).toBe('Type to search...')
     })
   })
@@ -341,15 +341,15 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: paginationState },
       })
-      expect(wrapper.find('.mld-dataframe__footer').exists()).toBe(true)
-      expect(wrapper.find('.mld-dataframe__page-controls').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__footer').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__page-controls').exists()).toBe(true)
     })
 
     it('should display page info', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: paginationState },
       })
-      const pageInfo = wrapper.find('.mld-dataframe__page-info')
+      const pageInfo = wrapper.find('.mint-dataframe__page-info')
       expect(pageInfo.text()).toContain('1')
       expect(pageInfo.text()).toContain('3')
     })
@@ -358,7 +358,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: paginationState },
       })
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(2) // pageSize is 2
     })
 
@@ -366,7 +366,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: paginationState },
       })
-      const nextButton = wrapper.findAll('.mld-dataframe__page-btn')[1]
+      const nextButton = wrapper.findAll('.mint-dataframe__page-btn')[1]
       await nextButton.trigger('click')
 
       expect(wrapper.emitted('update:pagination')).toHaveLength(1)
@@ -378,7 +378,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: paginationState },
       })
-      const prevButton = wrapper.findAll('.mld-dataframe__page-btn')[0]
+      const prevButton = wrapper.findAll('.mint-dataframe__page-btn')[0]
       expect(prevButton.attributes('disabled')).toBeDefined()
     })
 
@@ -387,7 +387,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: lastPageState },
       })
-      const nextButton = wrapper.findAll('.mld-dataframe__page-btn')[1]
+      const nextButton = wrapper.findAll('.mint-dataframe__page-btn')[1]
       expect(nextButton.attributes('disabled')).toBeDefined()
     })
 
@@ -395,7 +395,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, pagination: false },
       })
-      expect(wrapper.find('.mld-dataframe__footer').exists()).toBe(false)
+      expect(wrapper.find('.mint-dataframe__footer').exists()).toBe(false)
     })
   })
 
@@ -404,14 +404,14 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, selectable: true },
       })
-      expect(wrapper.find('.mld-dataframe__th--checkbox').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__th--checkbox').exists()).toBe(true)
     })
 
     it('should show checkboxes for each row', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, selectable: true },
       })
-      const checkboxes = wrapper.findAll('.mld-dataframe__checkbox')
+      const checkboxes = wrapper.findAll('.mint-dataframe__checkbox')
       // One for header + one for each row
       expect(checkboxes.length).toBeGreaterThan(mockData.length)
     })
@@ -420,7 +420,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, selectable: true, rowKey: 'id' },
       })
-      const rowCheckboxes = wrapper.findAll('.mld-dataframe__td--checkbox .mld-dataframe__checkbox')
+      const rowCheckboxes = wrapper.findAll('.mint-dataframe__td--checkbox .mint-dataframe__checkbox')
       await rowCheckboxes[0].trigger('change')
 
       expect(wrapper.emitted('update:selectedKeys')).toHaveLength(1)
@@ -438,7 +438,7 @@ describe('DataFrame', () => {
           selectedKeys: [1],
         },
       })
-      const rowCheckboxes = wrapper.findAll('.mld-dataframe__td--checkbox .mld-dataframe__checkbox')
+      const rowCheckboxes = wrapper.findAll('.mint-dataframe__td--checkbox .mint-dataframe__checkbox')
       await rowCheckboxes[0].trigger('change')
 
       const keys = wrapper.emitted('update:selectedKeys')?.[0]?.[0] as number[]
@@ -449,7 +449,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, selectable: true, rowKey: 'id' },
       })
-      const headerCheckbox = wrapper.find('.mld-dataframe__th--checkbox .mld-dataframe__checkbox')
+      const headerCheckbox = wrapper.find('.mint-dataframe__th--checkbox .mint-dataframe__checkbox')
       await headerCheckbox.trigger('change')
 
       const keys = wrapper.emitted('update:selectedKeys')?.[0]?.[0] as number[]
@@ -466,7 +466,7 @@ describe('DataFrame', () => {
           selectedKeys: [1],
         },
       })
-      const selectedRow = wrapper.find('.mld-dataframe__row--selected')
+      const selectedRow = wrapper.find('.mint-dataframe__row--selected')
       expect(selectedRow.exists()).toBe(true)
     })
   })
@@ -476,7 +476,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const firstRow = wrapper.findAll('.mld-dataframe__row')[0]
+      const firstRow = wrapper.findAll('.mint-dataframe__row')[0]
       await firstRow.trigger('click')
 
       expect(wrapper.emitted('row-click')).toHaveLength(1)
@@ -489,7 +489,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns },
       })
-      const firstCell = wrapper.find('.mld-dataframe__td')
+      const firstCell = wrapper.find('.mint-dataframe__td')
       await firstCell.trigger('click')
 
       expect(wrapper.emitted('cell-click')).toHaveLength(1)
@@ -505,28 +505,28 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: [], columns: mockColumns },
       })
-      expect(wrapper.find('.mld-dataframe__empty').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__empty').exists()).toBe(true)
     })
 
     it('should display empty text', () => {
       const wrapper = mount(DataFrame, {
         props: { data: [], columns: mockColumns },
       })
-      expect(wrapper.find('.mld-dataframe__empty-text').text()).toBe('No data')
+      expect(wrapper.find('.mint-dataframe__empty-text').text()).toBe('No data')
     })
 
     it('should use custom empty text', () => {
       const wrapper = mount(DataFrame, {
         props: { data: [], columns: mockColumns, emptyText: 'No records found' },
       })
-      expect(wrapper.find('.mld-dataframe__empty-text').text()).toBe('No records found')
+      expect(wrapper.find('.mint-dataframe__empty-text').text()).toBe('No records found')
     })
 
     it('should not show empty state when loading', () => {
       const wrapper = mount(DataFrame, {
         props: { data: [], columns: mockColumns, loading: true },
       })
-      expect(wrapper.find('.mld-dataframe__empty').exists()).toBe(false)
+      expect(wrapper.find('.mint-dataframe__empty').exists()).toBe(false)
     })
   })
 
@@ -535,14 +535,14 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, loading: true },
       })
-      expect(wrapper.find('.mld-dataframe__loading').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__loading').exists()).toBe(true)
     })
 
     it('should show loading spinner', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, loading: true },
       })
-      expect(wrapper.find('.mld-dataframe__loading-spinner').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__loading-spinner').exists()).toBe(true)
     })
   })
 
@@ -551,36 +551,36 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, striped: false },
       })
-      expect(wrapper.find('.mld-dataframe__row--striped').exists()).toBe(false)
+      expect(wrapper.find('.mint-dataframe__row--striped').exists()).toBe(false)
     })
 
     it('should not apply bordered when bordered is false', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, bordered: false },
       })
-      expect(wrapper.find('.mld-dataframe--bordered').exists()).toBe(false)
+      expect(wrapper.find('.mint-dataframe--bordered').exists()).toBe(false)
     })
 
     it('should apply size class to cells', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, size: 'sm' },
       })
-      const cell = wrapper.find('.mld-dataframe__td')
-      expect(cell.classes()).toContain('mld-dataframe__td--sm')
+      const cell = wrapper.find('.mint-dataframe__td')
+      expect(cell.classes()).toContain('mint-dataframe__td--sm')
     })
 
     it('should apply sticky header class', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, stickyHeader: true },
       })
-      expect(wrapper.find('.mld-dataframe__thead--sticky').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__thead--sticky').exists()).toBe(true)
     })
 
     it('should apply maxHeight style', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, maxHeight: 400 },
       })
-      const tableWrapper = wrapper.find('.mld-dataframe__table-wrapper')
+      const tableWrapper = wrapper.find('.mint-dataframe__table-wrapper')
       expect(tableWrapper.attributes('style')).toContain('max-height: 400px')
     })
 
@@ -588,7 +588,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: mockColumns, maxHeight: '50vh' },
       })
-      const tableWrapper = wrapper.find('.mld-dataframe__table-wrapper')
+      const tableWrapper = wrapper.find('.mint-dataframe__table-wrapper')
       expect(tableWrapper.attributes('style')).toContain('max-height: 50vh')
     })
   })
@@ -605,7 +605,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: nestedData, columns: nestedColumns },
       })
-      const cells = wrapper.findAll('.mld-dataframe__td')
+      const cells = wrapper.findAll('.mint-dataframe__td')
       expect(cells[0].text()).toBe('Alice')
       expect(cells[1].text()).toBe('alice@example.com')
     })
@@ -621,7 +621,7 @@ describe('DataFrame', () => {
           rowKey: 'id',
         },
       })
-      expect(wrapper.find('.mld-dataframe').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe').exists()).toBe(true)
     })
 
     it('should use function rowKey', () => {
@@ -633,7 +633,7 @@ describe('DataFrame', () => {
           rowKey: (row) => `row-${row.id}`,
         },
       })
-      expect(wrapper.find('.mld-dataframe').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe').exists()).toBe(true)
     })
   })
 
@@ -703,7 +703,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: dataWithNulls, columns: mockColumns },
       })
-      const cells = wrapper.findAll('.mld-dataframe__td')
+      const cells = wrapper.findAll('.mint-dataframe__td')
       expect(cells[0].text()).toBe('')
       expect(cells[1].text()).toBe('')
     })
@@ -712,7 +712,7 @@ describe('DataFrame', () => {
       const wrapper = mount(DataFrame, {
         props: { data: mockData, columns: [] },
       })
-      expect(wrapper.find('.mld-dataframe__table').exists()).toBe(true)
+      expect(wrapper.find('.mint-dataframe__table').exists()).toBe(true)
     })
 
     it('should handle large datasets efficiently', () => {
@@ -728,7 +728,7 @@ describe('DataFrame', () => {
           pagination: { page: 1, pageSize: 10, total: 1000 },
         },
       })
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(10)
     })
 
@@ -741,10 +741,10 @@ describe('DataFrame', () => {
           pagination: { page: 1, pageSize: 2, total: 3 },
         },
       })
-      const searchInput = wrapper.find('.mld-dataframe__search')
+      const searchInput = wrapper.find('.mint-dataframe__search')
       await searchInput.setValue('Alice')
 
-      const rows = wrapper.findAll('.mld-dataframe__row')
+      const rows = wrapper.findAll('.mint-dataframe__row')
       expect(rows).toHaveLength(1)
     })
 
@@ -757,7 +757,7 @@ describe('DataFrame', () => {
           rowKey: 'id',
         },
       })
-      const checkbox = wrapper.find('.mld-dataframe__td--checkbox .mld-dataframe__checkbox')
+      const checkbox = wrapper.find('.mint-dataframe__td--checkbox .mint-dataframe__checkbox')
       await checkbox.trigger('click')
 
       // Row click should not be emitted