@tcn/ui-table 2.2.0 → 2.3.0

package/src/__stories__/sample_data.ts

@@ -0,0 +1,1398 @@
+export type DataItem = {
+  id: string;
+  name: string;
+  age: number;
+  skillLevel: number;
+  email: string;
+  city: string;
+  country: string;
+  occupation: string;
+  isActive: boolean;
+  birthdate: Date;
+};
+
+export const items = [
+  {
+    id: 'one',
+    name: 'Sam Spade And the Longest Name that you have ever seen and it will just keep going cause we are going to test the table and see how it handles this',
+    age: 22,
+    email: 'sam.spade@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Detective',
+    isActive: true,
+    birthdate: new Date('2002-03-15'),
+    skillLevel: 48,
+  },
+  {
+    id: 'two',
+    name: 'Kelsier',
+    age: 166,
+    email: 'kelsier@scadrial.com',
+    city: 'Luthadel',
+    country: 'Scadrial',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1858-07-22'),
+    skillLevel: 11,
+  },
+  {
+    id: 'three',
+    name: 'Tress',
+    age: 17,
+    email: 'tress@lumar.com',
+    city: 'Diggen’s Point',
+    country: 'Lumar',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2007-11-08'),
+    skillLevel: 38,
+  },
+  {
+    id: 'four',
+    name: 'Breeze',
+    age: 45,
+    email: 'breeze@scadrial.com',
+    city: 'Fadrex',
+    country: 'Scadrial',
+    occupation: 'Soother',
+    isActive: false,
+    birthdate: new Date('1979-05-14'),
+    skillLevel: 52,
+  },
+  {
+    id: 'five',
+    name: 'Spook',
+    age: 17,
+    email: 'spook@scadrial.com',
+    city: 'Urteau',
+    country: 'Scadrial',
+    occupation: 'Tin-eye',
+    isActive: true,
+    birthdate: new Date('2007-09-30'),
+    skillLevel: 22,
+  },
+  {
+    id: 'six',
+    name: 'Anne',
+    age: 32,
+    email: 'anne@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Writer',
+    isActive: true,
+    birthdate: new Date('1992-12-03'),
+    skillLevel: 49,
+  },
+  {
+    id: 'seven',
+    name: 'Hoid',
+    age: 1934,
+    email: 'hoid@scadrial.com',
+    city: 'Urteau',
+    country: 'Scadrial',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('0090-01-01'),
+    skillLevel: 16,
+  },
+  {
+    id: 'eight',
+    name: 'Vasher',
+    age: 320,
+    email: 'vasher@scadrial.com',
+    city: 'Luthadel',
+    country: 'Scadrial',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1704-06-18'),
+    skillLevel: 81,
+  },
+  {
+    id: 'nine',
+    name: 'Vin',
+    age: 21,
+    email: 'vin@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Detective',
+    isActive: true,
+    birthdate: new Date('2003-08-25'),
+    skillLevel: 91,
+  },
+  {
+    id: 'ten',
+    name: 'Elend',
+    age: 24,
+    email: 'elend@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'King',
+    isActive: true,
+    birthdate: new Date('2000-04-12'),
+    skillLevel: 29,
+  },
+  {
+    id: 'eleven',
+    name: 'Sazed',
+    age: 45,
+    email: 'sazed@scadrial.com',
+    city: 'Luthadel',
+    country: 'Scadrial',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1979-10-07'),
+    skillLevel: 6,
+  },
+  {
+    id: 'twelve',
+    name: 'Marsh',
+    age: 170,
+    email: 'marsh@example.com',
+    city: 'Boston',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1854-02-28'),
+    skillLevel: 83,
+  },
+  {
+    id: 'thirteen',
+    name: 'Dockson',
+    age: 42,
+    email: 'dockson@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Merchant',
+    isActive: true,
+    birthdate: new Date('1982-11-15'),
+    skillLevel: 92,
+  },
+  {
+    id: 'fourteen',
+    name: 'Ham',
+    age: 38,
+    email: 'ham@example.com',
+    city: 'Paris',
+    country: 'France',
+    occupation: 'Chef',
+    isActive: true,
+    birthdate: new Date('1986-07-09'),
+    skillLevel: 94,
+  },
+  {
+    id: 'fifteen',
+    name: 'Clubs',
+    age: 55,
+    email: 'clubs@example.com',
+    city: 'Berlin',
+    country: 'Germany',
+    occupation: 'Musician',
+    isActive: true,
+    birthdate: new Date('1969-03-21'),
+    skillLevel: 71,
+  },
+  {
+    id: 'sixteen',
+    name: 'OreSeur',
+    age: 400,
+    email: 'oreseur@example.com',
+    city: 'Tokyo',
+    country: 'Japan',
+    occupation: 'Scientist',
+    isActive: true,
+    birthdate: new Date('1624-12-05'),
+    skillLevel: 15,
+  },
+  {
+    id: 'seventeen',
+    name: 'TenSoon',
+    age: 350,
+    email: 'tensoon@example.com',
+    city: 'Sydney',
+    country: 'Australia',
+    occupation: 'Artist',
+    isActive: true,
+    birthdate: new Date('1674-08-14'),
+    skillLevel: 60,
+  },
+  {
+    id: 'eighteen',
+    name: 'Kaladin',
+    age: 25,
+    email: 'kaladin@example.com',
+    city: 'Chicago',
+    country: 'USA',
+    occupation: 'Soldier',
+    isActive: true,
+    birthdate: new Date('1999-01-30'),
+    skillLevel: 68,
+  },
+  {
+    id: 'nineteen',
+    name: 'Shallan',
+    age: 20,
+    email: 'shallan@example.com',
+    city: 'Miami',
+    country: 'USA',
+    occupation: 'Student',
+    isActive: true,
+    birthdate: new Date('2004-06-17'),
+    skillLevel: 88,
+  },
+  {
+    id: 'twenty',
+    name: 'Dalinar',
+    age: 53,
+    email: 'dalinar@example.com',
+    city: 'Los Angeles',
+    country: 'USA',
+    occupation: 'King',
+    isActive: true,
+    birthdate: new Date('1971-09-23'),
+    skillLevel: 31,
+  },
+  {
+    id: 'twentyone',
+    name: 'Adolin',
+    age: 25,
+    email: 'adolin@example.com',
+    city: 'San Diego',
+    country: 'USA',
+    occupation: 'Soldier',
+    isActive: true,
+    birthdate: new Date('1999-05-11'),
+    skillLevel: 45,
+  },
+  {
+    id: 'twentytwo',
+    name: 'Renarin',
+    age: 21,
+    email: 'renarin@example.com',
+    city: 'Austin',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2003-12-08'),
+    skillLevel: 53,
+  },
+  {
+    id: 'twentythree',
+    name: 'Jasnah',
+    age: 35,
+    email: 'jasnah@example.com',
+    city: 'Dallas',
+    country: 'USA',
+    occupation: 'Queen',
+    isActive: true,
+    birthdate: new Date('1989-04-16'),
+    skillLevel: 10,
+  },
+  {
+    id: 'twentyfour',
+    name: 'Navani',
+    age: 50,
+    email: 'navani@example.com',
+    city: 'Phoenix',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1974-11-29'),
+    skillLevel: 67,
+  },
+  {
+    id: 'twentyfive',
+    name: 'Szeth',
+    age: 35,
+    email: 'szeth@example.com',
+    city: 'Denver',
+    country: 'USA',
+    occupation: 'Assassin',
+    isActive: true,
+    birthdate: new Date('1989-07-04'),
+    skillLevel: 28,
+  },
+  {
+    id: 'twentysix',
+    name: 'Lift',
+    age: 13,
+    email: 'lift@example.com',
+    city: 'Atlanta',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2011-10-31'),
+    skillLevel: 98,
+  },
+  {
+    id: 'twentyseven',
+    name: 'Rock',
+    age: 40,
+    email: 'rock@example.com',
+    city: 'Houston',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1984-02-12'),
+    skillLevel: 55,
+  },
+  {
+    id: 'twentyeight',
+    name: 'Teft',
+    age: 50,
+    email: 'teft@example.com',
+    city: 'Miami',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1974-06-25'),
+    skillLevel: 54,
+  },
+  {
+    id: 'twentynine',
+    name: 'Bridge Four',
+    age: 30,
+    email: 'bridgefour@example.com',
+    city: 'New Orleans',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1994-03-18'),
+    skillLevel: 95,
+  },
+  {
+    id: 'thirty',
+    name: 'Moash',
+    age: 25,
+    email: 'moash@example.com',
+    city: 'Chicago',
+    country: 'USA',
+    occupation: 'King',
+    isActive: true,
+    birthdate: new Date('1999-08-07'),
+    skillLevel: 96,
+  },
+  {
+    id: 'thirtyone',
+    name: 'Wit',
+    age: 2000,
+    email: 'wit@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('0024-01-01'),
+    skillLevel: 54,
+  },
+  {
+    id: 'thirtytwo',
+    name: 'Sadeas',
+    age: 55,
+    email: 'sadeas@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1969-12-13'),
+    skillLevel: 98,
+  },
+  {
+    id: 'thirtythree',
+    name: 'Amaram',
+    age: 45,
+    email: 'amaram@example.com',
+    city: 'Los Angeles',
+    country: 'USA',
+    occupation: 'King',
+    isActive: true,
+    birthdate: new Date('1979-05-20'),
+    skillLevel: 96,
+  },
+  {
+    id: 'thirtyfour',
+    name: 'Gavilar',
+    age: 55,
+    email: 'gavilar@example.com',
+    city: 'Boston',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1969-09-05'),
+    skillLevel: 99,
+  },
+  {
+    id: 'thirtyfive',
+    name: 'Taravangian',
+    age: 70,
+    email: 'taravangian@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1954-11-22'),
+    skillLevel: 46,
+  },
+  {
+    id: 'thirtysix',
+    name: 'Rysn',
+    age: 20,
+    email: 'rysn@example.com',
+    city: 'Sydney',
+    country: 'Australia',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2004-04-09'),
+    skillLevel: 14,
+  },
+  {
+    id: 'thirtyseven',
+    name: 'Raboniel',
+    age: 7000,
+    email: 'raboniel@example.com',
+    city: 'Tokyo',
+    country: 'Japan',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-4976-06-15'),
+    skillLevel: 66,
+  },
+  {
+    id: 'thirtyeight',
+    name: 'Leshwi',
+    age: 6000,
+    email: 'leshwi@example.com',
+    city: 'Berlin',
+    country: 'Germany',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-3976-03-28'),
+    skillLevel: 20,
+  },
+  {
+    id: 'thirtynine',
+    name: 'Venli',
+    age: 25,
+    email: 'venli@example.com',
+    city: 'Paris',
+    country: 'France',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1999-10-14'),
+    skillLevel: 61,
+  },
+  {
+    id: 'forty',
+    name: 'Eshonai',
+    age: 27,
+    email: 'eshonai@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1997-07-26'),
+    skillLevel: 34,
+  },
+  {
+    id: 'fortyone',
+    name: 'Steris',
+    age: 28,
+    email: 'steris@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1996-01-19'),
+    skillLevel: 85,
+  },
+  {
+    id: 'fortytwo',
+    name: 'Marasi',
+    age: 25,
+    email: 'marasi@example.com',
+    city: 'Chicago',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1999-12-02'),
+    skillLevel: 26,
+  },
+  {
+    id: 'fortythree',
+    name: 'Wayne',
+    age: 32,
+    email: 'wayne@example.com',
+    city: 'Miami',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1992-08-11'),
+    skillLevel: 40,
+  },
+  {
+    id: 'fortyfour',
+    name: 'Waxillium',
+    age: 42,
+    email: 'waxillium@example.com',
+    city: 'San Diego',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1982-04-30'),
+    skillLevel: 46,
+  },
+  {
+    id: 'fortyfive',
+    name: 'Miles',
+    age: 40,
+    email: 'miles@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1984-06-08'),
+    skillLevel: 84,
+  },
+  {
+    id: 'fortysix',
+    name: 'Ranette',
+    age: 38,
+    email: 'ranette@example.com',
+    city: 'Boston',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1986-09-17'),
+    skillLevel: 35,
+  },
+  {
+    id: 'fortyseven',
+    name: 'MeLaan',
+    age: 300,
+    email: 'melaan@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1724-11-03'),
+    skillLevel: 18,
+  },
+  {
+    id: 'fortyeight',
+    name: 'Suit',
+    age: 50,
+    email: 'suit@example.com',
+    city: 'Paris',
+    country: 'France',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1974-02-14'),
+    skillLevel: 72,
+  },
+  {
+    id: 'fortynine',
+    name: 'Edwarn',
+    age: 65,
+    email: 'edwarn@example.com',
+    city: 'Berlin',
+    country: 'Germany',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1959-07-25'),
+    skillLevel: 52,
+  },
+  {
+    id: 'fifty',
+    name: 'Telsin',
+    age: 40,
+    email: 'telsin@example.com',
+    city: 'Tokyo',
+    country: 'Japan',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1984-10-12'),
+    skillLevel: 83,
+  },
+  {
+    id: 'fiftyone',
+    name: 'Raoden',
+    age: 25,
+    email: 'raoden@example.com',
+    city: 'Sydney',
+    country: 'Australia',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1999-05-28'),
+    skillLevel: 17,
+  },
+  {
+    id: 'fiftytwo',
+    name: 'Sarene',
+    age: 25,
+    email: 'sarene@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1999-11-15'),
+    skillLevel: 22,
+  },
+  {
+    id: 'fiftythree',
+    name: 'Hrathen',
+    age: 40,
+    email: 'hrathen@example.com',
+    city: 'Chicago',
+    country: 'USA',
+    occupation: 'King',
+    isActive: true,
+    birthdate: new Date('1984-01-07'),
+    skillLevel: 90,
+  },
+  {
+    id: 'fiftyfour',
+    name: 'Dilaf',
+    age: 45,
+    email: 'dilaf@example.com',
+    city: 'Miami',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1979-08-20'),
+    skillLevel: 57,
+  },
+  {
+    id: 'fiftyfive',
+    name: 'Galladon',
+    age: 35,
+    email: 'galladon@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1989-12-04'),
+    skillLevel: 32,
+  },
+  {
+    id: 'fiftysix',
+    name: 'Lightsong',
+    age: 5,
+    email: 'lightsong@example.com',
+    city: 'Los Angeles',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('2019-06-18'),
+    skillLevel: 79,
+  },
+  {
+    id: 'fiftyseven',
+    name: 'Siri',
+    age: 18,
+    email: 'siri@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('2006-03-22'),
+    skillLevel: 67,
+  },
+  {
+    id: 'fiftyeight',
+    name: 'Vivenna',
+    age: 22,
+    email: 'vivenna@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('2002-09-11'),
+    skillLevel: 5,
+  },
+  {
+    id: 'fiftynine',
+    name: 'Denth',
+    age: 400,
+    email: 'denth@example.com',
+    city: 'Tokyo',
+    country: 'Japan',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1624-05-16'),
+    skillLevel: 98,
+  },
+  {
+    id: 'sixty',
+    name: 'Tonk Fah',
+    age: 45,
+    email: 'tonkfah@example.com',
+    city: 'Sydney',
+    country: 'Australia',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1979-04-03'),
+    skillLevel: 80,
+  },
+  {
+    id: 'sixtyone',
+    name: 'Susebron',
+    age: 23,
+    email: 'susebron@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('2001-07-29'),
+    skillLevel: 60,
+  },
+  {
+    id: 'sixtytwo',
+    name: 'Bluefingers',
+    age: 50,
+    email: 'bluefingers@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1974-10-08'),
+    skillLevel: 99,
+  },
+  {
+    id: 'sixtythree',
+    name: 'Trelagist',
+    age: 45,
+    email: 'trelagist@example.com',
+    city: 'Chicago',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1979-01-26'),
+    skillLevel: 3,
+  },
+  {
+    id: 'sixtyfour',
+    name: 'Blushweaver',
+    age: 30,
+    email: 'blushweaver@example.com',
+    city: 'Miami',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1994-12-19'),
+    skillLevel: 68,
+  },
+  {
+    id: 'sixtyfive',
+    name: 'Llarimar',
+    age: 45,
+    email: 'llarimar@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1979-06-12'),
+    skillLevel: 86,
+  },
+  {
+    id: 'sixtysix',
+    name: 'Stephen Leeds',
+    age: 35,
+    email: 'stephenleeds@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1989-08-05'),
+    skillLevel: 74,
+  },
+  {
+    id: 'sixtyseven',
+    name: 'Baon',
+    age: 45,
+    email: 'baon@example.com',
+    city: 'Boston',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1979-11-30'),
+    skillLevel: 22,
+  },
+  {
+    id: 'sixtyeight',
+    name: 'Silence Montane',
+    age: 35,
+    email: 'silencemontane@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1989-02-14'),
+    skillLevel: 89,
+  },
+  {
+    id: 'sixtynine',
+    name: 'William Ann',
+    age: 25,
+    email: 'williamann@example.com',
+    city: 'Paris',
+    country: 'France',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1999-04-25'),
+    skillLevel: 16,
+  },
+  {
+    id: 'seventy',
+    name: 'Grandpa Smedry',
+    age: 70,
+    email: 'grandpasmedry@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1954-07-08'),
+    skillLevel: 61,
+  },
+  {
+    id: 'seventyone',
+    name: 'Alcatraz Smedry',
+    age: 13,
+    email: 'alcatrazsmedry@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2011-12-24'),
+    skillLevel: 90,
+  },
+  {
+    id: 'seventytwo',
+    name: 'Bastille',
+    age: 13,
+    email: 'bastille@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2011-05-17'),
+    skillLevel: 64,
+  },
+  {
+    id: 'seventythree',
+    name: 'Khriss',
+    age: 35,
+    email: 'khriss@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1989-10-31'),
+    skillLevel: 86,
+  },
+  {
+    id: 'seventyfour',
+    name: 'Nazh',
+    age: 45,
+    email: 'nazh@example.com',
+    city: 'Paris',
+    country: 'France',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1979-03-09'),
+    skillLevel: 54,
+  },
+  {
+    id: 'seventyfive',
+    name: 'Demoux',
+    age: 25,
+    email: 'demoux@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1999-01-15'),
+    skillLevel: 68,
+  },
+  {
+    id: 'seventysix',
+    name: 'Felt',
+    age: 50,
+    email: 'felt@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1974-08-27'),
+    skillLevel: 43,
+  },
+  {
+    id: 'seventyseven',
+    name: 'Captain Goradel',
+    age: 35,
+    email: 'captaingoradel@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1989-06-13'),
+    skillLevel: 68,
+  },
+  {
+    id: 'seventyeight',
+    name: 'Allrianne',
+    age: 20,
+    email: 'allrianne@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('2004-02-28'),
+    skillLevel: 91,
+  },
+  {
+    id: 'seventynine',
+    name: 'Cett',
+    age: 50,
+    email: 'cett@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1974-09-16'),
+    skillLevel: 28,
+  },
+  {
+    id: 'eighty',
+    name: 'Zane',
+    age: 25,
+    email: 'zane@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1999-11-09'),
+    skillLevel: 73,
+  },
+  {
+    id: 'eightyone',
+    name: 'Straff Venture',
+    age: 45,
+    email: 'straffventure@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1979-12-21'),
+    skillLevel: 97,
+  },
+  {
+    id: 'eightytwo',
+    name: 'Yomen',
+    age: 40,
+    email: 'yomen@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1984-05-04'),
+    skillLevel: 33,
+  },
+  {
+    id: 'eightythree',
+    name: 'Beldre',
+    age: 20,
+    email: 'beldre@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2004-07-11'),
+    skillLevel: 86,
+  },
+  {
+    id: 'eightyfour',
+    name: 'Quellion',
+    age: 35,
+    email: 'quellion@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1989-01-25'),
+    skillLevel: 100,
+  },
+  {
+    id: 'eightyfive',
+    name: 'Fatren',
+    age: 30,
+    email: 'fatren@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1994-10-18'),
+    skillLevel: 56,
+  },
+  {
+    id: 'eightysix',
+    name: 'Human',
+    age: 30,
+    email: 'human@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1994-06-29'),
+    skillLevel: 28,
+  },
+  {
+    id: 'eightyseven',
+    name: 'Alendi',
+    age: 25,
+    email: 'alendi@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1999-03-12'),
+    skillLevel: 4,
+  },
+  {
+    id: 'eightyeight',
+    name: 'Kwaan',
+    age: 60,
+    email: 'kwaan@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1964-11-07'),
+    skillLevel: 37,
+  },
+  {
+    id: 'eightynine',
+    name: 'Rashek',
+    age: 1000,
+    email: 'rashek@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1024-04-20'),
+    skillLevel: 72,
+  },
+  {
+    id: 'ninety',
+    name: 'Tindwyl',
+    age: 42,
+    email: 'tindwyl@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1982-08-03'),
+    skillLevel: 9,
+  },
+  {
+    id: 'ninetyone',
+    name: 'Philen Frandel',
+    age: 35,
+    email: 'philenfrandel@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1989-12-15'),
+    skillLevel: 47,
+  },
+  {
+    id: 'ninetytwo',
+    name: 'Elhokar',
+    age: 30,
+    email: 'elhokar@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1994-01-28'),
+    skillLevel: 68,
+  },
+  {
+    id: 'ninetythree',
+    name: 'Tien',
+    age: 12,
+    email: 'tien@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('2012-09-14'),
+    skillLevel: 89,
+  },
+  {
+    id: 'ninetyfour',
+    name: 'Roshone',
+    age: 45,
+    email: 'roshone@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1979-07-06'),
+    skillLevel: 91,
+  },
+  {
+    id: 'ninetyfive',
+    name: 'Lirin',
+    age: 45,
+    email: 'lirin@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1979-02-19'),
+    skillLevel: 15,
+  },
+  {
+    id: 'ninetysix',
+    name: 'Hesina',
+    age: 40,
+    email: 'hesina@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1984-12-01'),
+    skillLevel: 35,
+  },
+  {
+    id: 'ninetyseven',
+    name: 'Pattern',
+    age: 1000,
+    email: 'pattern@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1024-05-10'),
+    skillLevel: 61,
+  },
+  {
+    id: 'ninetyeight',
+    name: 'Sylphrena',
+    age: 1000,
+    email: 'sylphrena@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1024-08-22'),
+    skillLevel: 20,
+  },
+  {
+    id: 'ninetynine',
+    name: 'Ivory',
+    age: 2000,
+    email: 'ivory@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('0024-06-13'),
+    skillLevel: 50,
+  },
+  {
+    id: 'hundred',
+    name: 'Wyndle',
+    age: 1000,
+    email: 'wyndle@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Adventurer',
+    isActive: true,
+    birthdate: new Date('1024-11-05'),
+    skillLevel: 35,
+  },
+  {
+    id: 'hundredone',
+    name: 'Nightblood',
+    age: 300,
+    email: 'nightblood@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1724-03-17'),
+    skillLevel: 31,
+  },
+  {
+    id: 'hundredtwo',
+    name: 'Azure',
+    age: 35,
+    email: 'azure@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1989-07-30'),
+    skillLevel: 59,
+  },
+  {
+    id: 'hundredthree',
+    name: 'Zahel',
+    age: 400,
+    email: 'zahel@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1624-09-08'),
+    skillLevel: 22,
+  },
+  {
+    id: 'hundredfour',
+    name: 'Cultivation',
+    age: 10000,
+    email: 'cultivation@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-01-01'),
+    skillLevel: 39,
+  },
+  {
+    id: 'hundredfive',
+    name: 'Honor',
+    age: 10000,
+    email: 'honor@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-02-14'),
+    skillLevel: 42,
+  },
+  {
+    id: 'hundredsix',
+    name: 'Odium',
+    age: 10000,
+    email: 'odium@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-03-21'),
+    skillLevel: 3,
+  },
+  {
+    id: 'hundredseven',
+    name: 'Preservation',
+    age: 10000,
+    email: 'preservation@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-04-15'),
+    skillLevel: 2,
+  },
+  {
+    id: 'hundredeight',
+    name: 'Ruin',
+    age: 10000,
+    email: 'ruin@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-05-30'),
+    skillLevel: 71,
+  },
+  {
+    id: 'hundrednine',
+    name: 'Harmony',
+    age: 1000,
+    email: 'harmony@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('1024-07-12'),
+    skillLevel: 11,
+  },
+  {
+    id: 'hundredten',
+    name: 'Endowment',
+    age: 10000,
+    email: 'endowment@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-06-18'),
+    skillLevel: 85,
+  },
+  {
+    id: 'hundredtwenty',
+    name: 'Autonomy',
+    age: 10000,
+    email: 'autonomy@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-07-25'),
+    skillLevel: 53,
+  },
+  {
+    id: 'hundredthirty',
+    name: 'Devotion',
+    age: 10000,
+    email: 'devotion@example.com',
+    city: 'New York',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-08-09'),
+    skillLevel: 6,
+  },
+  {
+    id: 'hundredforty',
+    name: 'Dominion',
+    age: 10000,
+    email: 'dominion@example.com',
+    city: 'San Francisco',
+    country: 'USA',
+    occupation: 'Mistborn',
+    isActive: true,
+    birthdate: new Date('-7976-09-03'),
+    skillLevel: 8,
+  },
+];
+
+export const stickyItems = [
+  {
+    id: 'two',
+    name: 'Milo',
+    age: 14,
+    email: 'milo@example.com',
+    city: 'Boston',
+    country: 'USA',
+    occupation: 'Student',
+    isActive: true,
+    birthdate: new Date('2010-04-22'),
+    skillLevel: 75,
+  },
+  {
+    id: 'three',
+    name: 'Tock',
+    age: 6,
+    email: 'tock@example.com',
+    city: 'London',
+    country: 'UK',
+    occupation: 'Child',
+    isActive: false,
+    birthdate: new Date('2018-11-16'),
+    skillLevel: 61,
+  },
+];