diff --git a/src/components/DynamicViewportHeights/index.js b/src/components/DynamicViewportHeights/index.js
new file mode 100644
index 000000000..46c903b27
--- /dev/null
+++ b/src/components/DynamicViewportHeights/index.js
@@ -0,0 +1,249 @@
+import React, { useState, useRef, useEffect } from 'react'
+import { motion, useElementScroll } from 'framer-motion'
+import clsx from 'clsx'
+
+const viewport = {
+ lvh: 491,
+ svh: 443,
+ navBarHeight: 48,
+ width: 300,
+ padding: 5,
+}
+
+const transition = {
+ duration: 0.2,
+ ease: 'linear',
+ type: 'tween',
+}
+export function DynamicViewportExample({
+ unit = 'dvh',
+ colorStyles = 'dark:bg-blue-500 bg-blue-500 border border-blue-400',
+ containerBackground = 'bg-stripes-blue',
+}) {
+ const [hidden, setHidden] = useState(false)
+ const parent = useRef(null)
+
+ const { scrollY } = useElementScroll(parent)
+
+ useEffect(() => {
+ const unsub = scrollY.onChange((latest) => {
+ const previous = scrollY.getPrevious()
+ if (latest > previous) {
+ setHidden(true)
+ } else {
+ setHidden(false)
+ }
+ })
+
+ return () => unsub()
+ })
+
+ // NOTE:When upgrading Framer Motion we can use useMotionValueEvent instead:
+
+ // import { motion, useScroll, useMotionValueEvent } from 'framer-motion'
+
+ // const { scrollY } = useScroll({ container: parent })
+
+ // useMotionValueEvent(scrollY, 'change', (latest) => {
+ // const previous = scrollY.getPrevious()
+ // if (latest > previous) {
+ // setHidden(true)
+ // } else {
+ // setHidden(false)
+ // }
+ // })
+
+ return (
+ <>
+
+
+ )
+}
diff --git a/src/components/Editor.js b/src/components/Editor.js
index 888eae719..b184361fe 100644
--- a/src/components/Editor.js
+++ b/src/components/Editor.js
@@ -26,7 +26,7 @@ export function Frame({ className, color = 'sky', children }) {
export function EditorPane({ filename, scroll = false, code, children }) {
return (
-
+ {filename &&
}
+
)
diff --git a/src/components/Header.js b/src/components/Header.js
index 499760a5e..43b2aa531 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -3,7 +3,7 @@ import { VersionSwitcher } from '@/components/VersionSwitcher'
import { SearchButton } from '@/components/Search'
import Router from 'next/router'
import { Logo } from '@/components/Logo'
-import { Dialog } from '@headlessui/react'
+import { Dialog, DialogPanel } from '@headlessui/react'
import { useEffect, useState } from 'react'
import clsx from 'clsx'
import { ThemeSelect, ThemeToggle } from './ThemeToggle'
@@ -11,10 +11,10 @@ import { ThemeSelect, ThemeToggle } from './ThemeToggle'
function Featured() {
return (
- Connect 2023 Recap
+ Introducing Catalyst
- Everything that was announced at our special event
+ A modern application UI kit for React
-
)
diff --git a/src/components/Heading.js b/src/components/Heading.js
index ef8b9ab82..8eb12d0d9 100644
--- a/src/components/Heading.js
+++ b/src/components/Heading.js
@@ -39,9 +39,14 @@ export function Heading({
className={clsx('group relative border-none', hidden ? 'sr-only' : 'lg:-ml-2 lg:pl-2')}
href={`#${id}`}
>
-
+
+
{children}
diff --git a/src/components/HeadlessUIV2Examples.js b/src/components/HeadlessUIV2Examples.js
new file mode 100644
index 000000000..5bf55e06d
--- /dev/null
+++ b/src/components/HeadlessUIV2Examples.js
@@ -0,0 +1,1376 @@
+import { Example } from '@/components/Example'
+import {
+ Button,
+ Checkbox,
+ Combobox,
+ ComboboxButton,
+ ComboboxInput,
+ ComboboxOption,
+ ComboboxOptions,
+ Description,
+ Field,
+ Fieldset,
+ Input,
+ Label,
+ Legend,
+ Select,
+ Transition,
+} from '@headlessui/react'
+import { ChevronDownIcon } from '@heroicons/react/20/solid'
+import { CheckIcon } from '@heroicons/react/16/solid'
+import clsx from 'clsx'
+import { useState } from 'react'
+
+export function CheckboxExample() {
+ return (
+
+
+
+
+
+
+ Enable beta features
+
+
+ This will give you early access to any awesome new features we're developing.
+
+
+
+
+ )
+}
+
+export function FormExample() {
+ const [country, setCountry] = useState('')
+
+ return (
+
+
+
+
+ Shipping details
+
+
+
+ Street address
+
+
+
+
+ Country
+
+
+ We currently only ship to North America.
+
+
+ setCountry(event.target.value)}
+ >
+ Canada
+ Mexico
+ United States
+
+
+
+
+
+ Region
+
+
+
+ {region} )}
+
+
+
+
+
+ Submit
+
+
+
+
+ )
+}
+
+export function StateAttributesExample() {
+ return (
+
+
+
+
+ Submit
+
+
+
+
+
+ <!-- Rendered `Button` -->
+
+
+ < button
+
+
+ {' '}
+ data-active
+
+
+ {' '}
+ data-hover
+
+
+ {' '}
+ data-focus
+ {' '}
+ class
+
+ =
+ " bg-indigo-600 data-[active]:bg-indigo-700
+ data-[hover]:bg-indigo-500 data-[focus]:outline ...
+ "
+
+ >
+
+
+
+ </ button
+
+ >
+
+
+
+
+ )
+}
+
+export function ComboboxExample() {
+ const [query, setQuery] = useState('')
+ const [selected, setSelected] = useState(people[0])
+
+ const filteredPeople =
+ query === ''
+ ? people
+ : people.filter((person) => {
+ return person.name.toLowerCase().includes(query.toLowerCase())
+ })
+
+ return (
+
+
+
+ Select user
+
+ setSelected(value)}
+ >
+
+ person?.name}
+ onChange={(event) => setQuery(event.target.value)}
+ />
+
+
+
+ setQuery('')}
+ >
+
+ {({ option: person }) => (
+
+ {person.name}
+
+ )}
+
+
+
+
+
+ )
+}
+
+const regions = {
+ Canada: [
+ 'Alberta',
+ 'British Columbia',
+ 'Manitoba',
+ 'New Brunswick',
+ 'Newfoundland and Labrador',
+ 'Northwest Territories',
+ 'Nova Scotia',
+ 'Nunavut',
+ 'Ontario',
+ 'Prince Edward Island',
+ 'Quebec',
+ 'Saskatchewan',
+ 'Yukon',
+ ],
+ Mexico: [
+ 'Aguascalientes',
+ 'Baja California',
+ 'Baja California Sur',
+ 'Campeche',
+ 'Chiapas',
+ 'Chihuahua',
+ 'Ciudad de Mexico',
+ 'Coahuila',
+ 'Colima',
+ 'Durango',
+ 'Guanajuato',
+ 'Guerrero',
+ 'Hidalgo',
+ 'Jalisco',
+ 'Mexico State',
+ 'Michoacán',
+ 'Morelos',
+ 'Nayarit',
+ 'Nuevo León',
+ 'Oaxaca',
+ 'Puebla',
+ 'Querétaro',
+ 'Quintana Roo',
+ 'San Luis Potosí',
+ 'Sinaloa',
+ 'Sonora',
+ 'Tabasco',
+ 'Tamaulipas',
+ 'Tlaxcala',
+ 'Veracruz',
+ 'Yucatán',
+ 'Zacatecas',
+ ],
+ 'United States': [
+ 'Alabama',
+ 'Alaska',
+ 'American Samoa',
+ 'Arizona',
+ 'Arkansas',
+ 'California',
+ 'Colorado',
+ 'Connecticut',
+ 'Delaware',
+ 'Washington DC',
+ 'Micronesia',
+ 'Florida',
+ 'Georgia',
+ 'Guam',
+ 'Hawaii',
+ 'Idaho',
+ 'Illinois',
+ 'Indiana',
+ 'Iowa',
+ 'Kansas',
+ 'Kentucky',
+ 'Louisiana',
+ 'Maine',
+ 'Marshall Islands',
+ 'Maryland',
+ 'Massachusetts',
+ 'Michigan',
+ 'Minnesota',
+ 'Mississippi',
+ 'Missouri',
+ 'Montana',
+ 'Nebraska',
+ 'Nevada',
+ 'New Hampshire',
+ 'New Jersey',
+ 'New Mexico',
+ 'New York',
+ 'North Carolina',
+ 'North Dakota',
+ 'Northern Mariana Islands',
+ 'Ohio',
+ 'Oklahoma',
+ 'Oregon',
+ 'Palau',
+ 'Pennsylvania',
+ 'Puerto Rico',
+ 'Rhode Island',
+ 'South Carolina',
+ 'South Dakota',
+ 'Tennessee',
+ 'Texas',
+ 'Utah',
+ 'Vermont',
+ 'U.S. Virgin Islands',
+ 'Virginia',
+ 'Washington',
+ 'West Virginia',
+ 'Wisconsin',
+ 'Wyoming',
+ 'Armed Forces Americas',
+ 'Armed Forces Europe',
+ 'Armed Forces Pacific',
+ ],
+}
+
+const people = [
+ { id: 1, name: 'Rossie Abernathy' },
+ { id: 2, name: 'Juana Abshire' },
+ { id: 3, name: 'Leonel Abshire' },
+ { id: 4, name: 'Llewellyn Abshire' },
+ { id: 5, name: 'Ramon Abshire' },
+ { id: 6, name: 'Vita Adams' },
+ { id: 7, name: 'Chelsie Altenwerth' },
+ { id: 8, name: 'Priscilla Altenwerth' },
+ { id: 9, name: 'Hilma Anderson' },
+ { id: 10, name: 'Rebekah Anderson' },
+ { id: 11, name: 'Lillie Ankunding' },
+ { id: 12, name: 'Alfredo Armstrong' },
+ { id: 13, name: 'Bulah Armstrong' },
+ { id: 14, name: 'Ofelia Armstrong' },
+ { id: 15, name: 'Nella Auer' },
+ { id: 16, name: 'Breanne Aufderhar' },
+ { id: 17, name: 'Joe Aufderhar' },
+ { id: 18, name: 'Kathryne Aufderhar' },
+ { id: 19, name: 'Luis Bahringer' },
+ { id: 20, name: 'Madyson Bahringer' },
+ { id: 21, name: 'Jimmie Bailey' },
+ { id: 22, name: 'Kailyn Balistreri' },
+ { id: 23, name: 'Elroy Barrows' },
+ { id: 24, name: 'Shaina Barrows' },
+ { id: 25, name: 'Ari Bartell' },
+ { id: 26, name: 'Rahsaan Bartell' },
+ { id: 27, name: 'Jalon Bartoletti' },
+ { id: 28, name: 'Jane Bartoletti' },
+ { id: 29, name: 'Leanne Bartoletti' },
+ { id: 30, name: 'Efren Barton' },
+ { id: 31, name: 'Cathrine Batz' },
+ { id: 32, name: 'Ceasar Batz' },
+ { id: 33, name: 'Jairo Batz' },
+ { id: 34, name: 'Marielle Batz' },
+ { id: 35, name: 'Carlos Bauch' },
+ { id: 36, name: 'Aurore Baumbach' },
+ { id: 37, name: 'Leora Baumbach' },
+ { id: 38, name: 'Monroe Baumbach' },
+ { id: 39, name: 'Kasey Bayer' },
+ { id: 40, name: 'Marcella Bayer' },
+ { id: 41, name: 'Randy Beahan' },
+ { id: 42, name: 'Roman Beahan' },
+ { id: 43, name: 'Mack Beatty' },
+ { id: 44, name: 'Shaylee Beatty' },
+ { id: 45, name: 'Abel Bechtelar' },
+ { id: 46, name: 'Clara Bechtelar' },
+ { id: 47, name: 'Cristobal Bechtelar' },
+ { id: 48, name: 'Eulalia Bechtelar' },
+ { id: 49, name: 'Kayla Bechtelar' },
+ { id: 50, name: 'Oceane Bechtelar' },
+ { id: 51, name: 'Dariana Becker' },
+ { id: 52, name: 'Velva Becker' },
+ { id: 53, name: 'Ceasar Bednar' },
+ { id: 54, name: 'Estrella Bednar' },
+ { id: 55, name: 'Gabriella Bednar' },
+ { id: 56, name: 'Quincy Beer' },
+ { id: 57, name: 'Breanne Beier' },
+ { id: 58, name: 'Dawn Beier' },
+ { id: 59, name: 'Felipe Beier' },
+ { id: 60, name: 'Lane Beier' },
+ { id: 61, name: 'Clemmie Berge' },
+ { id: 62, name: 'Earl Berge' },
+ { id: 63, name: 'Alberto Bergnaum' },
+ { id: 64, name: 'Fritz Bergstrom' },
+ { id: 65, name: 'Joel Bergstrom' },
+ { id: 66, name: 'Magnolia Bergstrom' },
+ { id: 67, name: 'Montana Bergstrom' },
+ { id: 68, name: 'Gianni Bernhard' },
+ { id: 69, name: 'Malika Bernhard' },
+ { id: 70, name: 'Prince Bernhard' },
+ { id: 71, name: 'Walton Bernier' },
+ { id: 72, name: 'Alessia Bins' },
+ { id: 73, name: 'Corbin Bins' },
+ { id: 74, name: 'Euna Bins' },
+ { id: 75, name: 'Shaun Bins' },
+ { id: 76, name: 'Sterling Bins' },
+ { id: 77, name: 'Alejandrin Blanda' },
+ { id: 78, name: 'Turner Blanda' },
+ { id: 79, name: 'Lesley Blick' },
+ { id: 80, name: 'Violet Blick' },
+ { id: 81, name: 'Chase Block' },
+ { id: 82, name: 'Golden Block' },
+ { id: 83, name: 'Armando Bode' },
+ { id: 84, name: 'Willis Bode' },
+ { id: 85, name: 'Isabel Boehm' },
+ { id: 86, name: 'Jermey Boehm' },
+ { id: 87, name: 'Milan Bogan' },
+ { id: 88, name: 'Furman Botsford' },
+ { id: 89, name: 'Gayle Botsford' },
+ { id: 90, name: 'Marilou Botsford' },
+ { id: 91, name: 'Brody Boyer' },
+ { id: 92, name: 'Emory Boyer' },
+ { id: 93, name: 'Rachelle Boyer' },
+ { id: 94, name: 'Rebeca Boyer' },
+ { id: 95, name: 'Eladio Boyle' },
+ { id: 96, name: 'George Brakus' },
+ { id: 97, name: 'Retta Brakus' },
+ { id: 98, name: 'Skylar Brakus' },
+ { id: 99, name: 'Talia Brakus' },
+ { id: 100, name: 'Alexis Braun' },
+ { id: 101, name: 'Guido Braun' },
+ { id: 102, name: 'Austyn Breitenberg' },
+ { id: 103, name: 'Corine Breitenberg' },
+ { id: 104, name: 'Dejon Breitenberg' },
+ { id: 105, name: 'Isai Brekke' },
+ { id: 106, name: 'Braeden Brown' },
+ { id: 107, name: 'Forrest Brown' },
+ { id: 108, name: 'Granville Brown' },
+ { id: 109, name: 'Lela Brown' },
+ { id: 110, name: 'Emiliano Bruen' },
+ { id: 111, name: 'Jaunita Buckridge' },
+ { id: 112, name: 'Laurie Buckridge' },
+ { id: 113, name: 'Aylin Carroll' },
+ { id: 114, name: 'Rae Carroll' },
+ { id: 115, name: 'Stuart Carroll' },
+ { id: 116, name: 'Lilla Carter' },
+ { id: 117, name: 'Rose Carter' },
+ { id: 118, name: 'Teagan Carter' },
+ { id: 119, name: 'Ettie Cartwright' },
+ { id: 120, name: 'Everette Cartwright' },
+ { id: 121, name: 'Leone Cartwright' },
+ { id: 122, name: 'Twila Cartwright' },
+ { id: 123, name: 'Abagail Casper' },
+ { id: 124, name: 'Laron Casper' },
+ { id: 125, name: 'Derick Cassin' },
+ { id: 126, name: 'Joanie Cassin' },
+ { id: 127, name: 'Lonnie Cassin' },
+ { id: 128, name: 'Adrianna Champlin' },
+ { id: 129, name: 'Alexis Champlin' },
+ { id: 130, name: 'Imogene Christiansen' },
+ { id: 131, name: 'Prudence Christiansen' },
+ { id: 132, name: 'Webster Christiansen' },
+ { id: 133, name: 'Glen Cole' },
+ { id: 134, name: 'Jordane Cole' },
+ { id: 135, name: 'Maria Cole' },
+ { id: 136, name: 'Karelle Conn' },
+ { id: 137, name: 'Abner Connelly' },
+ { id: 138, name: 'Adele Connelly' },
+ { id: 139, name: 'Durward Connelly' },
+ { id: 140, name: 'Koby Connelly' },
+ { id: 141, name: 'Albina Conroy' },
+ { id: 142, name: 'Annabelle Conroy' },
+ { id: 143, name: 'Chaz Conroy' },
+ { id: 144, name: 'Meaghan Conroy' },
+ { id: 145, name: 'Donna Considine' },
+ { id: 146, name: 'Cordell Corkery' },
+ { id: 147, name: 'Marcelina Corkery' },
+ { id: 148, name: 'Calista Cormier' },
+ { id: 149, name: 'Garret Cormier' },
+ { id: 150, name: 'Thaddeus Cormier' },
+ { id: 151, name: 'Grady Corwin' },
+ { id: 152, name: 'Camryn Cremin' },
+ { id: 153, name: 'Valentin Cremin' },
+ { id: 154, name: 'Myron Crist' },
+ { id: 155, name: 'Aleen Crona' },
+ { id: 156, name: 'Flavie Crona' },
+ { id: 157, name: 'Helena Cronin' },
+ { id: 158, name: 'Magdalen Cronin' },
+ { id: 159, name: 'Osbaldo Cronin' },
+ { id: 160, name: 'Rafael Cronin' },
+ { id: 161, name: 'Brant Cruickshank' },
+ { id: 162, name: 'Kamille Cummerata' },
+ { id: 163, name: 'Maymie Cummerata' },
+ { id: 164, name: 'Austin Cummings' },
+ { id: 165, name: 'Mathias Cummings' },
+ { id: 166, name: 'Minerva Cummings' },
+ { id: 167, name: "Anahi D'Amore" },
+ { id: 168, name: "Marjorie D'Amore" },
+ { id: 169, name: "Maximo D'Amore" },
+ { id: 170, name: "Milo D'Amore" },
+ { id: 171, name: 'Chance Dach' },
+ { id: 172, name: 'Enos Dach' },
+ { id: 173, name: 'Erika Dach' },
+ { id: 174, name: 'Kailyn Dach' },
+ { id: 175, name: 'Violet Dach' },
+ { id: 176, name: 'Ward Dach' },
+ { id: 177, name: 'Bell Daniel' },
+ { id: 178, name: 'Chelsey Daniel' },
+ { id: 179, name: 'Jamir Daniel' },
+ { id: 180, name: 'Mae Daniel' },
+ { id: 181, name: 'Tillman Daniel' },
+ { id: 182, name: 'Betsy Dare' },
+ { id: 183, name: 'Dasia Dare' },
+ { id: 184, name: 'Jacynthe Dare' },
+ { id: 185, name: 'Fernando Daugherty' },
+ { id: 186, name: 'Natasha Daugherty' },
+ { id: 187, name: 'Richmond Davis' },
+ { id: 188, name: 'Willis Davis' },
+ { id: 189, name: 'Geoffrey Deckow' },
+ { id: 190, name: 'Macie Deckow' },
+ { id: 191, name: 'Margarett Deckow' },
+ { id: 192, name: 'Xander Deckow' },
+ { id: 193, name: 'Beryl Denesik' },
+ { id: 194, name: 'Peggie Denesik' },
+ { id: 195, name: 'Pansy Dibbert' },
+ { id: 196, name: 'Arden Dickens' },
+ { id: 197, name: 'Leonor Dickens' },
+ { id: 198, name: 'Leonard Dicki' },
+ { id: 199, name: 'Sherwood Dicki' },
+ { id: 200, name: 'Kurt Dickinson' },
+ { id: 201, name: 'Nathen Dickinson' },
+ { id: 202, name: 'Ocie Dickinson' },
+ { id: 203, name: 'Giovanna Dietrich' },
+ { id: 204, name: 'Rahsaan Donnelly' },
+ { id: 205, name: 'Stacy Donnelly' },
+ { id: 206, name: 'Clement Dooley' },
+ { id: 207, name: 'Miller Dooley' },
+ { id: 208, name: 'Zachary Dooley' },
+ { id: 209, name: 'Ara Douglas' },
+ { id: 210, name: 'Tito Douglas' },
+ { id: 211, name: 'Joey Doyle' },
+ { id: 212, name: 'Ophelia Doyle' },
+ { id: 213, name: 'Barrett DuBuque' },
+ { id: 214, name: 'Bernardo DuBuque' },
+ { id: 215, name: 'Kamryn DuBuque' },
+ { id: 216, name: 'Alessandro Durgan' },
+ { id: 217, name: 'Deanna Durgan' },
+ { id: 218, name: 'Ewell Durgan' },
+ { id: 219, name: 'Gay Durgan' },
+ { id: 220, name: 'Jaqueline Durgan' },
+ { id: 221, name: 'Larissa Durgan' },
+ { id: 222, name: 'Nikita Durgan' },
+ { id: 223, name: 'Evelyn Ebert' },
+ { id: 224, name: 'Hadley Ebert' },
+ { id: 225, name: 'Neal Ebert' },
+ { id: 226, name: 'Evie Effertz' },
+ { id: 227, name: 'Enrique Emard' },
+ { id: 228, name: 'Kylie Emard' },
+ { id: 229, name: 'Gerald Emmerich' },
+ { id: 230, name: 'Karen Emmerich' },
+ { id: 231, name: 'Pat Erdman' },
+ { id: 232, name: 'Reymundo Erdman' },
+ { id: 233, name: 'Kassandra Ernser' },
+ { id: 234, name: 'Soledad Ernser' },
+ { id: 235, name: 'Cyrus Fadel' },
+ { id: 236, name: 'Ericka Fadel' },
+ { id: 237, name: 'Jessika Fadel' },
+ { id: 238, name: 'Norval Fadel' },
+ { id: 239, name: 'Lela Farrell' },
+ { id: 240, name: 'Raheem Farrell' },
+ { id: 241, name: 'Sunny Farrell' },
+ { id: 242, name: 'Vidal Farrell' },
+ { id: 243, name: 'Cheyenne Fay' },
+ { id: 244, name: 'Gerda Fay' },
+ { id: 245, name: 'Selina Fay' },
+ { id: 246, name: 'Paolo Feeney' },
+ { id: 247, name: 'Yoshiko Feeney' },
+ { id: 248, name: 'Earnestine Feest' },
+ { id: 249, name: 'Sydney Feest' },
+ { id: 250, name: 'Delmer Feil' },
+ { id: 251, name: 'Vivianne Feil' },
+ { id: 252, name: 'Augustus Ferry' },
+ { id: 253, name: 'Zoie Ferry' },
+ { id: 254, name: 'Aniyah Fisher' },
+ { id: 255, name: 'Mackenzie Fisher' },
+ { id: 256, name: 'Stacey Fisher' },
+ { id: 257, name: 'Alexander Flatley' },
+ { id: 258, name: 'Luisa Frami' },
+ { id: 259, name: 'Sincere Frami' },
+ { id: 260, name: 'Flavio Franecki' },
+ { id: 261, name: 'Roy Franecki' },
+ { id: 262, name: 'Maybell Fritsch' },
+ { id: 263, name: 'Tod Fritsch' },
+ { id: 264, name: 'Germaine Funk' },
+ { id: 265, name: 'Johathan Funk' },
+ { id: 266, name: 'Lulu Funk' },
+ { id: 267, name: 'Myron Funk' },
+ { id: 268, name: 'Myrtle Funk' },
+ { id: 269, name: 'Natalie Funk' },
+ { id: 270, name: 'Emely Gaylord' },
+ { id: 271, name: 'Liliane Gerlach' },
+ { id: 272, name: 'Neha Gerlach' },
+ { id: 273, name: 'Salvatore Gerlach' },
+ { id: 274, name: 'Elna Gislason' },
+ { id: 275, name: 'Felix Gislason' },
+ { id: 276, name: 'Joelle Gislason' },
+ { id: 277, name: 'Kaci Gislason' },
+ { id: 278, name: 'Taryn Gislason' },
+ { id: 279, name: 'Trystan Gislason' },
+ { id: 280, name: 'Annabell Gleason' },
+ { id: 281, name: 'Cindy Gleason' },
+ { id: 282, name: 'Coty Gleason' },
+ { id: 283, name: 'Felicia Gleason' },
+ { id: 284, name: 'Torey Gleason' },
+ { id: 285, name: 'Cecile Gleichner' },
+ { id: 286, name: 'Terrence Glover' },
+ { id: 287, name: 'Willie Glover' },
+ { id: 288, name: 'Jaime Goldner' },
+ { id: 289, name: 'Jeramy Goldner' },
+ { id: 290, name: 'Sarai Goodwin' },
+ { id: 291, name: 'Ollie Gorczany' },
+ { id: 292, name: 'Tabitha Gorczany' },
+ { id: 293, name: 'Benedict Gottlieb' },
+ { id: 294, name: 'Lilly Gottlieb' },
+ { id: 295, name: 'Lindsay Gottlieb' },
+ { id: 296, name: 'Serena Gottlieb' },
+ { id: 297, name: 'Veronica Grady' },
+ { id: 298, name: 'Alvera Graham' },
+ { id: 299, name: 'August Grant' },
+ { id: 300, name: 'Irving Grant' },
+ { id: 301, name: 'Lenora Grant' },
+ { id: 302, name: 'Pinkie Greenfelder' },
+ { id: 303, name: 'Charity Greenholt' },
+ { id: 304, name: 'Ludwig Greenholt' },
+ { id: 305, name: 'Mario Grimes' },
+ { id: 306, name: 'Clemmie Gulgowski' },
+ { id: 307, name: 'Edna Gulgowski' },
+ { id: 308, name: 'Phyllis Gulgowski' },
+ { id: 309, name: 'Agustina Gusikowski' },
+ { id: 310, name: 'Ernestine Gusikowski' },
+ { id: 311, name: 'Jacinto Gusikowski' },
+ { id: 312, name: 'Marisol Gutkowski' },
+ { id: 313, name: 'Otis Gutkowski' },
+ { id: 314, name: 'Serena Gutkowski' },
+ { id: 315, name: 'Herminia Gutmann' },
+ { id: 316, name: 'Mariela Gutmann' },
+ { id: 317, name: 'Mikayla Gutmann' },
+ { id: 318, name: 'Moshe Gutmann' },
+ { id: 319, name: 'Roscoe Gutmann' },
+ { id: 320, name: 'Chad Haag' },
+ { id: 321, name: 'Beau Hahn' },
+ { id: 322, name: 'Noelia Hahn' },
+ { id: 323, name: 'Gus Haley' },
+ { id: 324, name: 'Eliza Halvorson' },
+ { id: 325, name: 'Cathryn Hamill' },
+ { id: 326, name: 'Lysanne Hamill' },
+ { id: 327, name: 'Reva Hamill' },
+ { id: 328, name: 'Dax Hammes' },
+ { id: 329, name: 'Deonte Hammes' },
+ { id: 330, name: 'Jordon Hammes' },
+ { id: 331, name: 'Viviane Hammes' },
+ { id: 332, name: 'Ana Hand' },
+ { id: 333, name: 'Eugenia Hand' },
+ { id: 334, name: 'Agustin Hansen' },
+ { id: 335, name: 'Demarcus Hansen' },
+ { id: 336, name: 'Kadin Hansen' },
+ { id: 337, name: 'Osbaldo Hansen' },
+ { id: 338, name: 'Tressie Hansen' },
+ { id: 339, name: 'Amaya Harber' },
+ { id: 340, name: 'Eric Harris' },
+ { id: 341, name: 'Abelardo Hartmann' },
+ { id: 342, name: 'Abner Hartmann' },
+ { id: 343, name: 'Dillon Hartmann' },
+ { id: 344, name: 'Nicholaus Hartmann' },
+ { id: 345, name: 'Edwin Harvey' },
+ { id: 346, name: 'Gisselle Harvey' },
+ { id: 347, name: 'Sylvan Harvey' },
+ { id: 348, name: 'Alexandro Hauck' },
+ { id: 349, name: 'Anastacio Hauck' },
+ { id: 350, name: 'Renee Heaney' },
+ { id: 351, name: 'Floy Hegmann' },
+ { id: 352, name: 'Mason Hegmann' },
+ { id: 353, name: 'Samson Hegmann' },
+ { id: 354, name: 'Kaelyn Heidenreich' },
+ { id: 355, name: 'Elijah Herman' },
+ { id: 356, name: 'Erling Herman' },
+ { id: 357, name: 'Grayson Herman' },
+ { id: 358, name: 'Hallie Herman' },
+ { id: 359, name: 'Lupe Herman' },
+ { id: 360, name: 'Maryse Herman' },
+ { id: 361, name: 'Millie Hermann' },
+ { id: 362, name: 'Breanna Hermiston' },
+ { id: 363, name: 'Paxton Hermiston' },
+ { id: 364, name: 'Stephany Hermiston' },
+ { id: 365, name: 'Yoshiko Hermiston' },
+ { id: 366, name: 'Aglae Herzog' },
+ { id: 367, name: 'Dalton Herzog' },
+ { id: 368, name: 'Gia Hessel' },
+ { id: 369, name: 'Jude Hessel' },
+ { id: 370, name: 'Mollie Hettinger' },
+ { id: 371, name: 'Prince Hettinger' },
+ { id: 372, name: 'Ramon Hettinger' },
+ { id: 373, name: 'Allen Hickle' },
+ { id: 374, name: 'Judge Hickle' },
+ { id: 375, name: 'Lee Hickle' },
+ { id: 376, name: 'Alexie Hill' },
+ { id: 377, name: 'Marcia Hills' },
+ { id: 378, name: 'Hailie Hilpert' },
+ { id: 379, name: 'Tobin Hilpert' },
+ { id: 380, name: 'Carolina Hintz' },
+ { id: 381, name: 'Don Hintz' },
+ { id: 382, name: 'Delfina Hirthe' },
+ { id: 383, name: 'Johnpaul Hirthe' },
+ { id: 384, name: 'Queenie Hirthe' },
+ { id: 385, name: 'Berta Hodkiewicz' },
+ { id: 386, name: 'Jaquelin Hodkiewicz' },
+ { id: 387, name: 'Jerod Homenick' },
+ { id: 388, name: 'Erna Howe' },
+ { id: 389, name: 'Juliet Howe' },
+ { id: 390, name: 'Otho Howe' },
+ { id: 391, name: 'Abbigail Howell' },
+ { id: 392, name: 'Alvina Howell' },
+ { id: 393, name: 'Bonita Hudson' },
+ { id: 394, name: 'Noah Hudson' },
+ { id: 395, name: 'Alex Huel' },
+ { id: 396, name: 'Ramona Huel' },
+ { id: 397, name: 'Garnett Huels' },
+ { id: 398, name: 'Isom Hyatt' },
+ { id: 399, name: 'Jordan Hyatt' },
+ { id: 400, name: 'Justen Hyatt' },
+ { id: 401, name: 'Rosendo Hyatt' },
+ { id: 402, name: 'Mac Jacobi' },
+ { id: 403, name: 'Renee Jacobi' },
+ { id: 404, name: 'Santos Jacobi' },
+ { id: 405, name: 'Shaniya Jacobi' },
+ { id: 406, name: 'Darion Jacobs' },
+ { id: 407, name: 'Enoch Jacobson' },
+ { id: 408, name: 'Alexa Jakubowski' },
+ { id: 409, name: 'Alysha Jakubowski' },
+ { id: 410, name: 'Cornelius Jakubowski' },
+ { id: 411, name: 'Lucas Jakubowski' },
+ { id: 412, name: 'Maximillian Jakubowski' },
+ { id: 413, name: 'Raheem Jakubowski' },
+ { id: 414, name: 'Kathleen Jaskolski' },
+ { id: 415, name: 'Lauretta Jaskolski' },
+ { id: 416, name: 'Twila Jaskolski' },
+ { id: 417, name: 'Alfred Jast' },
+ { id: 418, name: 'Meghan Jast' },
+ { id: 419, name: 'Arturo Jenkins' },
+ { id: 420, name: 'Marcia Jerde' },
+ { id: 421, name: 'Corine Johns' },
+ { id: 422, name: 'Noble Johns' },
+ { id: 423, name: 'Santa Johns' },
+ { id: 424, name: 'Chanelle Johnston' },
+ { id: 425, name: 'Dan Johnston' },
+ { id: 426, name: 'Furman Jones' },
+ { id: 427, name: 'Norwood Jones' },
+ { id: 428, name: 'Alva Kautzer' },
+ { id: 429, name: 'Chelsea Kautzer' },
+ { id: 430, name: 'Greyson Kautzer' },
+ { id: 431, name: 'Juana Kautzer' },
+ { id: 432, name: 'Sierra Kautzer' },
+ { id: 433, name: 'Sydnie Keeling' },
+ { id: 434, name: 'Alycia Kemmer' },
+ { id: 435, name: 'Camilla Kemmer' },
+ { id: 436, name: 'Erika Kemmer' },
+ { id: 437, name: 'Jayden Kemmer' },
+ { id: 438, name: 'Jaylon Kemmer' },
+ { id: 439, name: 'Julius Kemmer' },
+ { id: 440, name: 'Samantha Kemmer' },
+ { id: 441, name: 'Alanis Kerluke' },
+ { id: 442, name: 'Marcelino Kerluke' },
+ { id: 443, name: 'Elta Kertzmann' },
+ { id: 444, name: 'Erwin Kertzmann' },
+ { id: 445, name: 'Wilber Kertzmann' },
+ { id: 446, name: 'Devan Kessler' },
+ { id: 447, name: 'Spencer Kessler' },
+ { id: 448, name: 'Kiera Kiehn' },
+ { id: 449, name: 'Leda Kiehn' },
+ { id: 450, name: 'Suzanne Kiehn' },
+ { id: 451, name: 'Gaston Kihn' },
+ { id: 452, name: 'Rashad Kihn' },
+ { id: 453, name: 'Clark Kilback' },
+ { id: 454, name: 'Dorthy Kilback' },
+ { id: 455, name: 'Eunice Kilback' },
+ { id: 456, name: 'Johanna Kilback' },
+ { id: 457, name: 'Bradford King' },
+ { id: 458, name: 'Francisca King' },
+ { id: 459, name: 'Lacey King' },
+ { id: 460, name: 'Cyril Kirlin' },
+ { id: 461, name: 'Nayeli Kirlin' },
+ { id: 462, name: 'Bonnie Klein' },
+ { id: 463, name: 'Keanu Klein' },
+ { id: 464, name: 'Ollie Klein' },
+ { id: 465, name: 'Garrett Kling' },
+ { id: 466, name: 'Cade Klocko' },
+ { id: 467, name: 'Clarabelle Klocko' },
+ { id: 468, name: 'Gerald Koch' },
+ { id: 469, name: 'Wyman Koch' },
+ { id: 470, name: 'Loyal Koelpin' },
+ { id: 471, name: 'Prince Koelpin' },
+ { id: 472, name: 'Angelo Koepp' },
+ { id: 473, name: 'Branson Koepp' },
+ { id: 474, name: 'Lilliana Koepp' },
+ { id: 475, name: 'Ruth Koepp' },
+ { id: 476, name: 'Chelsey Kohler' },
+ { id: 477, name: 'Dock Konopelski' },
+ { id: 478, name: 'Trey Konopelski' },
+ { id: 479, name: 'Koby Koss' },
+ { id: 480, name: 'Abraham Kovacek' },
+ { id: 481, name: 'Bret Kovacek' },
+ { id: 482, name: 'Deondre Kovacek' },
+ { id: 483, name: 'Nigel Kovacek' },
+ { id: 484, name: 'Trey Kovacek' },
+ { id: 485, name: 'Braeden Kozey' },
+ { id: 486, name: 'Lenna Kozey' },
+ { id: 487, name: 'Vicente Kozey' },
+ { id: 488, name: 'Fiona Krajcik' },
+ { id: 489, name: 'Toni Kreiger' },
+ { id: 490, name: 'Ada Kris' },
+ { id: 491, name: 'Alysson Kshlerin' },
+ { id: 492, name: 'Gregoria Kshlerin' },
+ { id: 493, name: 'Margarita Kshlerin' },
+ { id: 494, name: 'Santino Kshlerin' },
+ { id: 495, name: 'Aisha Kub' },
+ { id: 496, name: 'Dexter Kub' },
+ { id: 497, name: 'Willie Kub' },
+ { id: 498, name: 'Eliseo Kuhlman' },
+ { id: 499, name: 'Lawson Kuhlman' },
+ { id: 500, name: 'Dolores Kulas' },
+ { id: 501, name: 'Hadley Kulas' },
+ { id: 502, name: 'Jane Kulas' },
+ { id: 503, name: 'Elmo Kunze' },
+ { id: 504, name: 'Kaden Kunze' },
+ { id: 505, name: 'Lucio Kunze' },
+ { id: 506, name: 'Roselyn Kunze' },
+ { id: 507, name: 'Sonia Kunze' },
+ { id: 508, name: 'Lavada Kuphal' },
+ { id: 509, name: 'Caitlyn Kutch' },
+ { id: 510, name: 'Elnora Kutch' },
+ { id: 511, name: 'Priscilla Kutch' },
+ { id: 512, name: 'Cara Labadie' },
+ { id: 513, name: 'Earl Labadie' },
+ { id: 514, name: 'Pearl Labadie' },
+ { id: 515, name: 'Shanie Labadie' },
+ { id: 516, name: 'Hildegard Lakin' },
+ { id: 517, name: 'Jovan Lakin' },
+ { id: 518, name: 'Llewellyn Langosh' },
+ { id: 519, name: 'Aleen Langworth' },
+ { id: 520, name: 'Alfredo Langworth' },
+ { id: 521, name: 'Felix Langworth' },
+ { id: 522, name: 'Marcelo Langworth' },
+ { id: 523, name: 'Anais Larkin' },
+ { id: 524, name: 'Israel Larkin' },
+ { id: 525, name: 'Louvenia Larkin' },
+ { id: 526, name: 'Marcella Larkin' },
+ { id: 527, name: 'Waylon Larson' },
+ { id: 528, name: 'Jettie Leannon' },
+ { id: 529, name: 'Julia Leannon' },
+ { id: 530, name: 'Kirstin Leannon' },
+ { id: 531, name: 'Elvie Lebsack' },
+ { id: 532, name: 'Leonor Lebsack' },
+ { id: 533, name: 'Zita Lebsack' },
+ { id: 534, name: 'Mittie Ledner' },
+ { id: 535, name: 'Pinkie Ledner' },
+ { id: 536, name: 'Ashley Leffler' },
+ { id: 537, name: 'Haven Leffler' },
+ { id: 538, name: 'Maryjane Leffler' },
+ { id: 539, name: 'Reginald Leffler' },
+ { id: 540, name: 'Ruthe Leffler' },
+ { id: 541, name: 'Celia Lehner' },
+ { id: 542, name: 'Dandre Lemke' },
+ { id: 543, name: 'Drake Lesch' },
+ { id: 544, name: 'Arturo Leuschke' },
+ { id: 545, name: 'Cora Leuschke' },
+ { id: 546, name: 'Nicolas Leuschke' },
+ { id: 547, name: 'Maudie Lindgren' },
+ { id: 548, name: 'Peggie Lindgren' },
+ { id: 549, name: 'Kiel Littel' },
+ { id: 550, name: 'Nick Littel' },
+ { id: 551, name: 'Adelia Lockman' },
+ { id: 552, name: 'Abdul Lowe' },
+ { id: 553, name: 'Maci Lowe' },
+ { id: 554, name: 'Rowan Lowe' },
+ { id: 555, name: 'Adonis Lubowitz' },
+ { id: 556, name: 'Celine Lubowitz' },
+ { id: 557, name: 'Derek Macejkovic' },
+ { id: 558, name: 'Hope Macejkovic' },
+ { id: 559, name: 'Melisa Macejkovic' },
+ { id: 560, name: 'Ryan Maggio' },
+ { id: 561, name: 'Wendell Maggio' },
+ { id: 562, name: 'Robin Malfait' },
+ { id: 563, name: 'Albina Mann' },
+ { id: 564, name: 'Benny Mann' },
+ { id: 565, name: 'Maritza Mante' },
+ { id: 566, name: 'Manuel Marks' },
+ { id: 567, name: 'Orrin Marks' },
+ { id: 568, name: 'Alfreda Marquardt' },
+ { id: 569, name: 'Marlon Marquardt' },
+ { id: 570, name: 'Princess Marvin' },
+ { id: 571, name: 'Tressa Marvin' },
+ { id: 572, name: 'Billie Mayer' },
+ { id: 573, name: 'Eldora Mayer' },
+ { id: 574, name: 'Urban Mayer' },
+ { id: 575, name: 'Rylan Mayert' },
+ { id: 576, name: 'Miller McClure' },
+ { id: 577, name: 'Nia McClure' },
+ { id: 578, name: 'Gay McCullough' },
+ { id: 579, name: 'Gerda McCullough' },
+ { id: 580, name: 'Jamil McCullough' },
+ { id: 581, name: 'Myles McCullough' },
+ { id: 582, name: 'Andre McDermott' },
+ { id: 583, name: 'Dane McDermott' },
+ { id: 584, name: 'Felton McDermott' },
+ { id: 585, name: 'Shane McDermott' },
+ { id: 586, name: 'Jesse McGlynn' },
+ { id: 587, name: 'Sibyl McGlynn' },
+ { id: 588, name: 'Cyril McKenzie' },
+ { id: 589, name: 'Anthony McLaughlin' },
+ { id: 590, name: 'Mariane McLaughlin' },
+ { id: 591, name: 'Naomie McLaughlin' },
+ { id: 592, name: 'Cassandre Medhurst' },
+ { id: 593, name: 'Nellie Medhurst' },
+ { id: 594, name: 'Rasheed Mertz' },
+ { id: 595, name: 'Leonor Metz' },
+ { id: 596, name: 'Nicholaus Metz' },
+ { id: 597, name: 'Tyshawn Metz' },
+ { id: 598, name: 'Fidel Miller' },
+ { id: 599, name: 'Friedrich Miller' },
+ { id: 600, name: 'Mabelle Miller' },
+ { id: 601, name: 'Myles Miller' },
+ { id: 602, name: 'Gia Mills' },
+ { id: 603, name: 'Laila Mills' },
+ { id: 604, name: 'Lindsay Mills' },
+ { id: 605, name: 'Eldon Mitchell' },
+ { id: 606, name: 'Judah Mitchell' },
+ { id: 607, name: 'Dillon Moen' },
+ { id: 608, name: 'Hobart Moen' },
+ { id: 609, name: 'Layla Moen' },
+ { id: 610, name: 'Savannah Moen' },
+ { id: 611, name: 'Larissa Mohr' },
+ { id: 612, name: 'Ray Mohr' },
+ { id: 613, name: 'Ophelia Monahan' },
+ { id: 614, name: 'Demetrius Moore' },
+ { id: 615, name: 'Jack Moore' },
+ { id: 616, name: 'Luther Moore' },
+ { id: 617, name: 'Mario Moore' },
+ { id: 618, name: 'Lucas Mosciski' },
+ { id: 619, name: 'Lavonne Mraz' },
+ { id: 620, name: 'Camryn Mueller' },
+ { id: 621, name: 'Vivienne Mueller' },
+ { id: 622, name: 'Asha Muller' },
+ { id: 623, name: 'Opal Muller' },
+ { id: 624, name: 'Florida Murazik' },
+ { id: 625, name: 'Marcelino Murazik' },
+ { id: 626, name: 'Henderson Murphy' },
+ { id: 627, name: 'Queen Murphy' },
+ { id: 628, name: 'Loma Murray' },
+ { id: 629, name: 'Adell Nader' },
+ { id: 630, name: 'Cordelia Nader' },
+ { id: 631, name: 'Kaci Nader' },
+ { id: 632, name: 'Alford Nicolas' },
+ { id: 633, name: 'Rasheed Nicolas' },
+ { id: 634, name: 'Ima Nienow' },
+ { id: 635, name: 'Bill Nitzsche' },
+ { id: 636, name: 'Kobe Nitzsche' },
+ { id: 637, name: 'Verla Nitzsche' },
+ { id: 638, name: "Amparo O'Connell" },
+ { id: 639, name: "Ceasar O'Connell" },
+ { id: 640, name: "Deondre O'Connell" },
+ { id: 641, name: "Holly O'Connell" },
+ { id: 642, name: "Jerrod O'Connell" },
+ { id: 643, name: "Carmine O'Conner" },
+ { id: 644, name: "Concepcion O'Conner" },
+ { id: 645, name: "Orin O'Conner" },
+ { id: 646, name: "Sarah O'Conner" },
+ { id: 647, name: "Braxton O'Hara" },
+ { id: 648, name: "Lauretta O'Hara" },
+ { id: 649, name: "Orion O'Hara" },
+ { id: 650, name: "Wiley O'Hara" },
+ { id: 651, name: "Carmella O'Keefe" },
+ { id: 652, name: "Dexter O'Keefe" },
+ { id: 653, name: "Janick O'Keefe" },
+ { id: 654, name: "Mabelle O'Keefe" },
+ { id: 655, name: "Walker O'Keefe" },
+ { id: 656, name: "Haven O'Kon" },
+ { id: 657, name: "Linwood O'Kon" },
+ { id: 658, name: 'Casimir Oberbrunner' },
+ { id: 659, name: 'Gilda Oberbrunner' },
+ { id: 660, name: 'Alison Okuneva' },
+ { id: 661, name: 'Kelly Okuneva' },
+ { id: 662, name: 'Mozelle Okuneva' },
+ { id: 663, name: 'Steve Okuneva' },
+ { id: 664, name: 'Clara Olson' },
+ { id: 665, name: 'Jena Olson' },
+ { id: 666, name: 'Mustafa Ondricka' },
+ { id: 667, name: 'Narciso Ondricka' },
+ { id: 668, name: 'Rachael Ortiz' },
+ { id: 669, name: 'Tianna Ortiz' },
+ { id: 670, name: 'Dolores Osinski' },
+ { id: 671, name: 'Santa Osinski' },
+ { id: 672, name: 'Leann Pacocha' },
+ { id: 673, name: 'Lera Pacocha' },
+ { id: 674, name: 'Madonna Pacocha' },
+ { id: 675, name: 'Name Pacocha' },
+ { id: 676, name: 'Ruthe Pacocha' },
+ { id: 677, name: 'Justen Padberg' },
+ { id: 678, name: 'Torey Padberg' },
+ { id: 679, name: 'Willy Padberg' },
+ { id: 680, name: 'Annabel Pagac' },
+ { id: 681, name: 'Priscilla Pagac' },
+ { id: 682, name: 'Emanuel Parisian' },
+ { id: 683, name: 'Turner Parisian' },
+ { id: 684, name: 'Adele Pfannerstill' },
+ { id: 685, name: 'Celia Pfannerstill' },
+ { id: 686, name: 'Else Pfannerstill' },
+ { id: 687, name: 'Jordan Pittman' },
+ { id: 688, name: 'Alanis Pollich' },
+ { id: 689, name: 'Laurianne Pouros' },
+ { id: 690, name: 'Donavon Powlowski' },
+ { id: 691, name: 'Emanuel Powlowski' },
+ { id: 692, name: 'Kristina Powlowski' },
+ { id: 693, name: 'Woodrow Powlowski' },
+ { id: 694, name: 'Devon Predovic' },
+ { id: 695, name: 'Hailee Predovic' },
+ { id: 696, name: 'Schuyler Predovic' },
+ { id: 697, name: 'Margret Price' },
+ { id: 698, name: 'Rachelle Price' },
+ { id: 699, name: 'Carolyne Prohaska' },
+ { id: 700, name: 'Macy Prosacco' },
+ { id: 701, name: 'Mayra Prosacco' },
+ { id: 702, name: 'Ardith Purdy' },
+ { id: 703, name: 'Jeff Quigley' },
+ { id: 704, name: 'Nicolette Quigley' },
+ { id: 705, name: 'Deon Quitzon' },
+ { id: 706, name: 'Ron Rath' },
+ { id: 707, name: 'Shane Ratke' },
+ { id: 708, name: 'Kiara Rau' },
+ { id: 709, name: 'Kylee Raynor' },
+ { id: 710, name: 'Mathias Raynor' },
+ { id: 711, name: 'Maymie Raynor' },
+ { id: 712, name: 'Rory Raynor' },
+ { id: 713, name: 'Troy Raynor' },
+ { id: 714, name: 'Mikayla Reichel' },
+ { id: 715, name: 'Callie Reichert' },
+ { id: 716, name: 'Jabari Reilly' },
+ { id: 717, name: 'Keyshawn Reinger' },
+ { id: 718, name: 'Lenna Reinger' },
+ { id: 719, name: 'Jonathan Reinink' },
+ { id: 720, name: 'Clemmie Rempel' },
+ { id: 721, name: 'Johan Rempel' },
+ { id: 722, name: 'Sanford Rempel' },
+ { id: 723, name: 'Anne Renner' },
+ { id: 724, name: 'Blanche Renner' },
+ { id: 725, name: 'Kaycee Renner' },
+ { id: 726, name: 'Quincy Reynolds' },
+ { id: 727, name: 'Brad Rice' },
+ { id: 728, name: 'Clement Rice' },
+ { id: 729, name: 'Daniella Rice' },
+ { id: 730, name: 'Giovani Rice' },
+ { id: 731, name: 'Jacquelyn Rice' },
+ { id: 732, name: 'Lafayette Rice' },
+ { id: 733, name: 'Maegan Rice' },
+ { id: 734, name: 'Alessia Rippin' },
+ { id: 735, name: 'Emelia Rippin' },
+ { id: 736, name: 'Gregorio Rippin' },
+ { id: 737, name: 'Tillman Rippin' },
+ { id: 738, name: 'Keenan Ritchie' },
+ { id: 739, name: 'Asha Robel' },
+ { id: 740, name: 'Cassandre Robel' },
+ { id: 741, name: 'Daron Robel' },
+ { id: 742, name: 'Edgar Roberts' },
+ { id: 743, name: 'Ernest Roberts' },
+ { id: 744, name: 'Hudson Roberts' },
+ { id: 745, name: 'Moshe Roberts' },
+ { id: 746, name: 'Alda Rodriguez' },
+ { id: 747, name: 'Chanel Rodriguez' },
+ { id: 748, name: 'Brent Rogahn' },
+ { id: 749, name: 'Dallas Rogahn' },
+ { id: 750, name: 'Justine Rohan' },
+ { id: 751, name: 'Alan Rolfson' },
+ { id: 752, name: 'Boyd Rolfson' },
+ { id: 753, name: 'Otho Rolfson' },
+ { id: 754, name: 'Alysa Romaguera' },
+ { id: 755, name: 'Kelley Rosenbaum' },
+ { id: 756, name: 'Lelia Rosenbaum' },
+ { id: 757, name: 'Keara Rowe' },
+ { id: 758, name: 'Briana Ruecker' },
+ { id: 759, name: 'Sabryna Ruecker' },
+ { id: 760, name: 'Vicenta Ruecker' },
+ { id: 761, name: 'Elwin Runolfsdottir' },
+ { id: 762, name: 'Bryce Runolfsson' },
+ { id: 763, name: 'Dorcas Runolfsson' },
+ { id: 764, name: 'Rosa Runolfsson' },
+ { id: 765, name: 'Sallie Runolfsson' },
+ { id: 766, name: 'Annette Runte' },
+ { id: 767, name: 'Ellsworth Runte' },
+ { id: 768, name: 'Rossie Runte' },
+ { id: 769, name: 'Bailey Russel' },
+ { id: 770, name: 'Cecilia Russel' },
+ { id: 771, name: 'Richmond Russel' },
+ { id: 772, name: 'Violette Russel' },
+ { id: 773, name: 'Yadira Russel' },
+ { id: 774, name: 'Cornell Ryan' },
+ { id: 775, name: 'Mittie Ryan' },
+ { id: 776, name: 'Rachel Sanford' },
+ { id: 777, name: 'Valentin Sanford' },
+ { id: 778, name: 'Araceli Satterfield' },
+ { id: 779, name: 'Burley Satterfield' },
+ { id: 780, name: 'Hudson Satterfield' },
+ { id: 781, name: 'Callie Sauer' },
+ { id: 782, name: 'Dell Sauer' },
+ { id: 783, name: 'Samara Sawayn' },
+ { id: 784, name: 'Abdiel Schaden' },
+ { id: 785, name: 'Arvid Schaden' },
+ { id: 786, name: 'Buddy Schaden' },
+ { id: 787, name: 'Mabelle Schaden' },
+ { id: 788, name: 'Maxime Schaden' },
+ { id: 789, name: 'Salma Schaden' },
+ { id: 790, name: 'Uriah Schaden' },
+ { id: 791, name: 'Bud Schaefer' },
+ { id: 792, name: 'Emiliano Schamberger' },
+ { id: 793, name: 'Rubye Schiller' },
+ { id: 794, name: 'Zack Schiller' },
+ { id: 795, name: 'Ethelyn Schinner' },
+ { id: 796, name: 'Kaden Schinner' },
+ { id: 797, name: 'Nestor Schinner' },
+ { id: 798, name: 'Nona Schmeler' },
+ { id: 799, name: 'Petra Schmeler' },
+ { id: 800, name: 'Arnulfo Schmidt' },
+ { id: 801, name: 'Janessa Schmitt' },
+ { id: 802, name: 'Belle Schneider' },
+ { id: 803, name: 'Camryn Schneider' },
+ { id: 804, name: 'Casper Schneider' },
+ { id: 805, name: 'Hellen Schneider' },
+ { id: 806, name: 'Ludwig Schneider' },
+ { id: 807, name: 'Helene Schoen' },
+ { id: 808, name: 'Javier Schoen' },
+ { id: 809, name: 'Sheldon Schoen' },
+ { id: 810, name: 'Susana Schoen' },
+ { id: 811, name: 'Steve Schoger' },
+ { id: 812, name: 'Bettye Schroeder' },
+ { id: 813, name: 'Reinhold Schroeder' },
+ { id: 814, name: 'Viva Schroeder' },
+ { id: 815, name: 'Janick Schulist' },
+ { id: 816, name: 'Beaulah Schultz' },
+ { id: 817, name: 'Eladio Schultz' },
+ { id: 818, name: 'Geraldine Schultz' },
+ { id: 819, name: 'Jazmin Schultz' },
+ { id: 820, name: 'Lysanne Schultz' },
+ { id: 821, name: 'Simone Schultz' },
+ { id: 822, name: 'Wilma Schultz' },
+ { id: 823, name: 'Jarrod Schumm' },
+ { id: 824, name: 'Cordie Schuppe' },
+ { id: 825, name: 'Betsy Schuster' },
+ { id: 826, name: 'Eli Schuster' },
+ { id: 827, name: 'Vernie Schuster' },
+ { id: 828, name: 'Ed Senger' },
+ { id: 829, name: 'Kieran Senger' },
+ { id: 830, name: 'Ubaldo Senger' },
+ { id: 831, name: 'Hector Shanahan' },
+ { id: 832, name: 'Jazmin Shanahan' },
+ { id: 833, name: 'Melissa Shanahan' },
+ { id: 834, name: 'Theresa Shanahan' },
+ { id: 835, name: 'Braeden Simonis' },
+ { id: 836, name: 'Raquel Simonis' },
+ { id: 837, name: 'Juvenal Sipes' },
+ { id: 838, name: 'Nicholaus Sipes' },
+ { id: 839, name: 'Donna Skiles' },
+ { id: 840, name: 'Noemi Skiles' },
+ { id: 841, name: 'Nicolas Smith' },
+ { id: 842, name: 'Erik Smitham' },
+ { id: 843, name: 'Ezra Smitham' },
+ { id: 844, name: 'Fletcher Smitham' },
+ { id: 845, name: 'Gayle Smitham' },
+ { id: 846, name: 'Zita Smitham' },
+ { id: 847, name: 'Stevie Spinka' },
+ { id: 848, name: 'Spencer Stamm' },
+ { id: 849, name: 'Garret Stanton' },
+ { id: 850, name: 'Ozella Stanton' },
+ { id: 851, name: 'Westley Stanton' },
+ { id: 852, name: 'Cheyenne Stark' },
+ { id: 853, name: 'Terence Stark' },
+ { id: 854, name: 'Esta Stehr' },
+ { id: 855, name: 'Reagan Stehr' },
+ { id: 856, name: 'Marietta Steuber' },
+ { id: 857, name: 'Kaylah Stiedemann' },
+ { id: 858, name: 'Sally Stiedemann' },
+ { id: 859, name: 'Tressa Stiedemann' },
+ { id: 860, name: 'Jody Stokes' },
+ { id: 861, name: 'Luther Stokes' },
+ { id: 862, name: 'Jany Stoltenberg' },
+ { id: 863, name: 'Saige Stoltenberg' },
+ { id: 864, name: 'Violet Stoltenberg' },
+ { id: 865, name: 'Madelyn Stracke' },
+ { id: 866, name: 'Santina Stracke' },
+ { id: 867, name: 'Juana Streich' },
+ { id: 868, name: 'Magnolia Streich' },
+ { id: 869, name: 'Koby Strosin' },
+ { id: 870, name: 'Peter Suhm' },
+ { id: 871, name: 'Alanis Swaniawski' },
+ { id: 872, name: 'Delphia Swaniawski' },
+ { id: 873, name: 'Gina Swaniawski' },
+ { id: 874, name: 'Justice Thiel' },
+ { id: 875, name: 'Clementina Thompson' },
+ { id: 876, name: 'Jackie Thompson' },
+ { id: 877, name: 'Gerhard Tillman' },
+ { id: 878, name: 'Lorna Tillman' },
+ { id: 879, name: 'Sydnie Torp' },
+ { id: 880, name: 'Katlyn Toy' },
+ { id: 881, name: 'Shemar Toy' },
+ { id: 882, name: 'Adelbert Trantow' },
+ { id: 883, name: 'Antonina Tremblay' },
+ { id: 884, name: 'Juana Tremblay' },
+ { id: 885, name: 'Meghan Tremblay' },
+ { id: 886, name: 'Will Tremblay' },
+ { id: 887, name: 'Madisyn Treutel' },
+ { id: 888, name: 'Madge Turcotte' },
+ { id: 889, name: 'Hardy Turner' },
+ { id: 890, name: 'Janice Turner' },
+ { id: 891, name: 'Nicola Turner' },
+ { id: 892, name: 'Russell Ullrich' },
+ { id: 893, name: 'Dayna Upton' },
+ { id: 894, name: 'Shanon Upton' },
+ { id: 895, name: 'Dayna Vandervort' },
+ { id: 896, name: 'Jevon Vandervort' },
+ { id: 897, name: 'Joanne Vandervort' },
+ { id: 898, name: 'Weston Vandervort' },
+ { id: 899, name: 'Zachery Vandervort' },
+ { id: 900, name: 'Gina Veum' },
+ { id: 901, name: 'Harmony Veum' },
+ { id: 902, name: 'Janiya Veum' },
+ { id: 903, name: 'Regan Volkman' },
+ { id: 904, name: 'Baby Waelchi' },
+ { id: 905, name: 'Sam Waelchi' },
+ { id: 906, name: 'Leila Walker' },
+ { id: 907, name: 'Trevor Walker' },
+ { id: 908, name: 'Virginia Walker' },
+ { id: 909, name: 'Jalyn Walsh' },
+ { id: 910, name: 'Aidan Walter' },
+ { id: 911, name: 'Gina Ward' },
+ { id: 912, name: 'Manley Waters' },
+ { id: 913, name: 'Myra Waters' },
+ { id: 914, name: 'Adam Wathan' },
+ { id: 915, name: 'Chyna Watsica' },
+ { id: 916, name: 'Damon Watsica' },
+ { id: 917, name: 'Justina Watsica' },
+ { id: 918, name: 'Eleazar Weber' },
+ { id: 919, name: 'Florian Weber' },
+ { id: 920, name: 'Jedediah Weber' },
+ { id: 921, name: 'Deron Wehner' },
+ { id: 922, name: 'Jadyn Wehner' },
+ { id: 923, name: 'Pedro Wehner' },
+ { id: 924, name: 'Cielo Weimann' },
+ { id: 925, name: 'Harold Weimann' },
+ { id: 926, name: 'Mylene Weimann' },
+ { id: 927, name: 'Cade Weissnat' },
+ { id: 928, name: 'Daniela Weissnat' },
+ { id: 929, name: 'Kraig Weissnat' },
+ { id: 930, name: 'Krystina Weissnat' },
+ { id: 931, name: 'Liza Weissnat' },
+ { id: 932, name: 'Catherine Welch' },
+ { id: 933, name: 'Ellen Welch' },
+ { id: 934, name: 'Andreanne West' },
+ { id: 935, name: 'Georgiana West' },
+ { id: 936, name: 'Penelope West' },
+ { id: 937, name: 'Mikel White' },
+ { id: 938, name: 'Angelica Wiegand' },
+ { id: 939, name: 'Regan Wilderman' },
+ { id: 940, name: 'Roman Wilkinson' },
+ { id: 941, name: 'Tianna Wilkinson' },
+ { id: 942, name: 'Armand Will' },
+ { id: 943, name: 'Obie Williamson' },
+ { id: 944, name: 'Sydnie Williamson' },
+ { id: 945, name: 'Aileen Willms' },
+ { id: 946, name: 'Ashlynn Willms' },
+ { id: 947, name: 'Gilda Willms' },
+ { id: 948, name: 'Sylvia Willms' },
+ { id: 949, name: 'Wilburn Willms' },
+ { id: 950, name: 'Aric Wintheiser' },
+ { id: 951, name: 'Rosalia Wintheiser' },
+ { id: 952, name: 'Liam Wisoky' },
+ { id: 953, name: 'Sallie Wisoky' },
+ { id: 954, name: 'Sammie Wisoky' },
+ { id: 955, name: 'Candida Wisozk' },
+ { id: 956, name: 'Keagan Wisozk' },
+ { id: 957, name: 'Benton Witting' },
+ { id: 958, name: 'Cheyanne Witting' },
+ { id: 959, name: 'Cristal Witting' },
+ { id: 960, name: 'Maynard Witting' },
+ { id: 961, name: 'Kallie Wiza' },
+ { id: 962, name: 'Marco Wiza' },
+ { id: 963, name: 'Dock Wolf' },
+ { id: 964, name: 'Jade Wolf' },
+ { id: 965, name: 'Kaleigh Wolf' },
+ { id: 966, name: 'Matilde Wolf' },
+ { id: 967, name: 'Romaine Wolf' },
+ { id: 968, name: 'Alena Wolff' },
+ { id: 969, name: 'Kyler Wolff' },
+ { id: 970, name: 'Euna Wunsch' },
+ { id: 971, name: 'Buster Wyman' },
+ { id: 972, name: 'Diana Wyman' },
+ { id: 973, name: 'Kiley Wyman' },
+ { id: 974, name: 'Everett Yost' },
+ { id: 975, name: 'Randy Yost' },
+ { id: 976, name: 'Wilma Yost' },
+ { id: 977, name: 'Abigayle Yundt' },
+ { id: 978, name: 'Darron Yundt' },
+ { id: 979, name: 'Erika Yundt' },
+ { id: 980, name: 'Josiah Yundt' },
+ { id: 981, name: 'Litzy Yundt' },
+ { id: 982, name: 'Loren Yundt' },
+ { id: 983, name: 'Pansy Yundt' },
+ { id: 984, name: 'Warren Yundt' },
+ { id: 985, name: 'Elmer Zboncak' },
+ { id: 986, name: 'Emelia Zboncak' },
+ { id: 987, name: 'Ewald Zboncak' },
+ { id: 988, name: 'Lon Zboncak' },
+ { id: 989, name: 'Brielle Zemlak' },
+ { id: 990, name: 'Elsa Zemlak' },
+ { id: 991, name: 'Adah Ziemann' },
+ { id: 992, name: 'Ashtyn Ziemann' },
+ { id: 993, name: 'Kaycee Ziemann' },
+ { id: 994, name: 'Lessie Ziemann' },
+ { id: 995, name: 'Garland Zieme' },
+ { id: 996, name: 'Jeff Zieme' },
+ { id: 997, name: 'Johnnie Zieme' },
+ { id: 998, name: 'Antonette Zulauf' },
+ { id: 999, name: 'Cooper Zulauf' },
+ { id: 1000, name: 'Genevieve Zulauf' },
+]
diff --git a/src/components/PostItem.js b/src/components/PostItem.js
index 39ff0e629..f5a15d60a 100644
--- a/src/components/PostItem.js
+++ b/src/components/PostItem.js
@@ -3,6 +3,12 @@ import clsx from 'clsx'
import { Button } from '@/components/Button'
import { formatDate } from '@/utils/formatDate'
+const dateFormat = {
+ month: 'long',
+ day: 'numeric',
+ year: 'numeric',
+}
+
export default function PostItem({ title, category, slug, date, children, wide = false }) {
return (
- {formatDate(date, '{MMMM} {DD}, {YYYY}')}
+ {formatDate(date, dateFormat)}
+
+
+ {children}
+
+
+
+ )
+}
+
+const TIMINGS = {
+ initial: [1500, 'highlighted'],
+ highlighted: [1000, 'exiting'],
+ exiting: [2500, 'settled'],
+ settled: [4000, 'highlighted'],
+}
+
+export function WhitespaceDemo() {
+ let [activeState, setActiveState] = useState('initial')
+
+ useTimeout(() => {
+ setActiveState(TIMINGS[activeState][1])
+ }, TIMINGS[activeState][0])
+
+ return (
+
+
+
+ function {' '}
+
+ MyComponent
+
+ (
+
+ {'{'} children{' '}
+ {'}'}
+
+ ) {' '}
+ {'{'}
+ {'\n'}
+ {' '}
+ return {' '}
+ (
+ {'\n'}
+ {' '}
+
+
+ < div
+ {' '}
+ className
+
+ =
+ "
+ "
+
+ >
+
+
+ {'\n'}
+ {' '}
+
+ {'{'} children
+ {'}'}
+
+ {'\n'}
+ {' '}
+
+
+
+ </ div
+
+ >
+
+ {'\n'}
+ {' '}
+ )
+ {'\n'}
+ {'}'}
+
+
+
+ )
+}
+
+export function DuplicationDemo() {
+ let [activeState, setActiveState] = useState('initial')
+
+ useTimeout(() => {
+ setActiveState(TIMINGS[activeState][1])
+ }, TIMINGS[activeState][0])
+
+ return (
+
+
+
+ function {' '}
+
+ MyComponent
+
+ (
+
+ {'{'} children{' '}
+ {'}'}
+
+ ) {' '}
+ {'{'}
+ {'\n'}
+ {' '}
+ return {' '}
+ (
+ {'\n'}
+ {' '}
+
+
+ < div
+ {' '}
+ className
+
+ =
+ "
+ flex{' '}
+
+ bg-zinc-100
+ {' '}
+
+
+ bg-zinc-100
+ {' '}
+
+ px-4
+ "
+
+ >
+
+
+ {'\n'}
+ {' '}
+
+ {'{'} children
+ {'}'}
+
+ {'\n'}
+ {' '}
+
+
+
+ </ div
+
+ >
+
+ {'\n'}
+ {' '}
+ )
+ {'\n'}
+ {'}'}
+
+
+
+ )
+}
+
+function useTimeout(callback, delay) {
+ const timeoutRef = useRef(null)
+ const savedCallback = useRef(callback)
+ useEffect(() => {
+ savedCallback.current = callback
+ }, [callback])
+ useEffect(() => {
+ const tick = () => savedCallback.current()
+ if (typeof delay === 'number') {
+ timeoutRef.current = window.setTimeout(tick, delay)
+ return () => window.clearTimeout(timeoutRef.current)
+ }
+ }, [delay])
+ return timeoutRef
+}
diff --git a/src/components/SnippetGroup.js b/src/components/SnippetGroup.js
index d1ba22404..fe6c52a08 100644
--- a/src/components/SnippetGroup.js
+++ b/src/components/SnippetGroup.js
@@ -111,7 +111,7 @@ export function SnippetGroup({ children, style = 'plain', actions, ...props }) {
return (
-
+
{children.map((child, tabIndex) => (
diff --git a/src/components/Steps.js b/src/components/Steps.js
index 63411c40c..8e6693e29 100644
--- a/src/components/Steps.js
+++ b/src/components/Steps.js
@@ -92,7 +92,6 @@ function CopyButton({ code }) {
-
diff --git a/src/components/ThemeReference.js b/src/components/ThemeReference.js
index e0237da9e..2d9fbfce8 100644
--- a/src/components/ThemeReference.js
+++ b/src/components/ThemeReference.js
@@ -7,6 +7,7 @@ const descriptions = {
container: 'Configuration for the `container` plugin',
inset: 'Values for the `top`, `right`, `bottom`, and `left` properties',
keyframes: 'Keyframe values used in the `animation` plugin',
+ textColor: 'Values for the `color` property',
...Object.fromEntries(
[
'placeholderColor',
diff --git a/src/components/ThemeToggle.js b/src/components/ThemeToggle.js
index 0be224728..00bba5cc6 100644
--- a/src/components/ThemeToggle.js
+++ b/src/components/ThemeToggle.js
@@ -196,7 +196,7 @@ export function ThemeToggle({ panelClassName = 'mt-4' }) {
{settings.map(({ value, label, icon: Icon }) => (
{({ active, selected }) => (
-
)}
))}
diff --git a/src/components/home/BuildAnything.js b/src/components/home/BuildAnything.js
index c8ae5617b..fdd9ff10e 100644
--- a/src/components/home/BuildAnything.js
+++ b/src/components/home/BuildAnything.js
@@ -22,7 +22,7 @@ const code = {