a tool for shared writing and social publishing
scaffolded themeing!
* installed Radix Popover Component
* tailwind colors now tied to css variables that can be manipulated by user
* added a dropdown to select different colors for page and card backgrounds (very WIP and ugly)
+1004
-199
+68
-42
app/globals.css
+68
-42
app/globals.css
···
2
2
@tailwind components;
3
3
@tailwind utilities;
4
4
5
-
html,
6
-
body {
7
-
@apply bg-bg-page;
8
-
@apply h-full;
9
-
@apply p-0;
10
-
@apply text-grey-15;
11
-
@apply overscroll-y-none;
12
-
min-height: -webkit-fill-available;
13
-
@apply font-sans;
14
-
}
5
+
@layer base {
6
+
:root {
7
+
--bg-page: 240 247 250;
8
+
--bg-card: 255 255 255;
9
+
--accent: 0 0 225;
10
+
}
15
11
16
-
#__next {
17
-
height: 100%;
18
-
}
12
+
html,
13
+
body {
14
+
@apply bg-bg-page;
15
+
@apply h-full;
16
+
@apply p-0;
17
+
@apply text-grey-15;
18
+
@apply overscroll-y-none;
19
+
min-height: -webkit-fill-available;
20
+
@apply font-sans;
21
+
}
19
22
20
-
/* START FONT STYLING */
21
-
h1 {
22
-
@apply text-2xl;
23
-
@apply font-bold;
24
-
}
23
+
#__next {
24
+
height: 100%;
25
+
}
25
26
26
-
h2 {
27
-
@apply text-xl;
28
-
@apply font-bold;
29
-
}
27
+
/* START FONT STYLING */
28
+
h1 {
29
+
@apply text-2xl;
30
+
@apply font-bold;
31
+
}
30
32
31
-
h3 {
32
-
@apply text-lg;
33
-
@apply font-bold;
34
-
}
33
+
h2 {
34
+
@apply text-xl;
35
+
@apply font-bold;
36
+
}
35
37
36
-
h4 {
37
-
@apply text-base;
38
-
@apply font-bold;
39
-
}
38
+
h3 {
39
+
@apply text-lg;
40
+
@apply font-bold;
41
+
}
40
42
41
-
p {
42
-
@apply text-base;
43
-
}
43
+
h4 {
44
+
@apply text-base;
45
+
@apply font-bold;
46
+
}
44
47
45
-
small {
46
-
@apply text-sm;
47
-
}
48
+
p {
49
+
@apply text-base;
50
+
}
51
+
52
+
small {
53
+
@apply text-sm;
54
+
}
55
+
56
+
a {
57
+
color: inherit;
58
+
text-decoration: none;
59
+
}
60
+
61
+
pre {
62
+
font-family: "Quattro" !important;
63
+
}
64
+
/*END FONT STYLING*/
48
65
49
-
a {
50
-
color: inherit;
51
-
text-decoration: none;
52
-
}
66
+
/* START GLOBAL STYLING */
67
+
input,
68
+
textarea {
69
+
@apply bg-white;
70
+
@apply rounded-md;
71
+
@apply border;
72
+
@apply border-grey-80;
73
+
@apply px-2 py-0.5;
74
+
@apply box-border !important;
75
+
}
53
76
54
-
pre {
55
-
font-family: "Quattro" !important;
77
+
::placeholder {
78
+
@apply !text-grey-80;
79
+
@apply italic;
80
+
}
81
+
/* END GLOBAL STYLING */
56
82
}
+145
app/test/card.tsx
+145
app/test/card.tsx
···
1
+
import { ButtonPrimary } from "../../components/Buttons";
2
+
3
+
export const Card = (props: {
4
+
children: React.ReactNode;
5
+
first?: boolean;
6
+
focused?: boolean;
7
+
id: string;
8
+
index: number;
9
+
setFocusedCardIndex: (index: number) => void;
10
+
setCards: ([]) => void;
11
+
cards: number[];
12
+
card: number;
13
+
cardWidth: number;
14
+
}) => {
15
+
return (
16
+
<>
17
+
{/* if the card is the first one in the list, remove this div... can we do with :before? */}
18
+
{!props.first && <div className="w-6 md:snap-center" />}
19
+
<div
20
+
id={props.id}
21
+
className={`
22
+
p-3 w-[calc(100vw-12px)] md:w-[calc(50vw-24px)] max-w-prose
23
+
bg-bg-card border rounded-lg
24
+
grow flex flex-col gap-2
25
+
snap-center
26
+
${props.focused ? "drop-shadow-lg border-grey-80" : "border-grey-90 "}`}
27
+
>
28
+
{props.children}
29
+
<AddCardButton
30
+
setCards={props.setCards}
31
+
cards={props.cards}
32
+
card={props.card}
33
+
setFocusedCardIndex={props.setFocusedCardIndex}
34
+
index={props.index}
35
+
/>
36
+
{props.index !== 0 && (
37
+
<RemoveCardButton
38
+
setCards={props.setCards}
39
+
cards={props.cards}
40
+
index={props.index}
41
+
/>
42
+
)}
43
+
<div className="flex justify-between">
44
+
<FocusCardButton
45
+
setFocusedCardIndex={props.setFocusedCardIndex}
46
+
index={props.index}
47
+
cardWidth={props.cardWidth}
48
+
/>
49
+
<FocusCardButton
50
+
setFocusedCardIndex={props.setFocusedCardIndex}
51
+
index={props.index}
52
+
cardWidth={props.cardWidth}
53
+
/>
54
+
</div>
55
+
</div>
56
+
</>
57
+
);
58
+
};
59
+
60
+
const AddCardButton = (props: {
61
+
setCards: ([]) => void;
62
+
setFocusedCardIndex: (index: number) => void;
63
+
cards: number[];
64
+
card: number;
65
+
index: number;
66
+
}) => {
67
+
return (
68
+
<ButtonPrimary
69
+
onClick={() => {
70
+
//add a new card after this one
71
+
props.setCards([...props.cards, props.card + 1]);
72
+
73
+
// focus the new card
74
+
props.setFocusedCardIndex(props.index + 1);
75
+
76
+
//scroll the new card into view
77
+
setTimeout(() => {
78
+
let newCardID = document.getElementById((props.index + 1).toString());
79
+
newCardID?.scrollIntoView({
80
+
behavior: "smooth",
81
+
inline: "nearest",
82
+
});
83
+
}, 100);
84
+
}}
85
+
>
86
+
add card
87
+
</ButtonPrimary>
88
+
);
89
+
};
90
+
91
+
const RemoveCardButton = (props: {
92
+
setCards: ([]) => void;
93
+
cards: number[];
94
+
index: number;
95
+
}) => {
96
+
return (
97
+
<ButtonPrimary
98
+
onClick={() => {
99
+
props.cards.splice(props.index, 1);
100
+
props.setCards([...props.cards]);
101
+
}}
102
+
>
103
+
remove card
104
+
</ButtonPrimary>
105
+
);
106
+
};
107
+
108
+
const FocusCardButton = (props: {
109
+
setFocusedCardIndex: (index: number) => void;
110
+
index: number;
111
+
cardWidth: number;
112
+
}) => {
113
+
return (
114
+
<ButtonPrimary
115
+
onClick={() => {
116
+
//set the focused card to this one
117
+
props.setFocusedCardIndex(props.index);
118
+
119
+
// check if the card is off screen to the right or left
120
+
let cardPosition =
121
+
document
122
+
.getElementById(props.index.toString())
123
+
?.getBoundingClientRect().left || 0;
124
+
let isOffScreenLeft = cardPosition < 0;
125
+
let isOffScreenRight =
126
+
cardPosition + props.cardWidth > window.innerWidth;
127
+
128
+
//if card is off screen, scroll one card width to the left or right so that the card is in view
129
+
setTimeout(() => {
130
+
document.getElementById("card-carousel")?.scrollBy({
131
+
top: 0,
132
+
left: isOffScreenLeft
133
+
? -props.cardWidth
134
+
: isOffScreenRight
135
+
? props.cardWidth
136
+
: 0,
137
+
behavior: "smooth",
138
+
});
139
+
}, 100);
140
+
}}
141
+
>
142
+
focus this card
143
+
</ButtonPrimary>
144
+
);
145
+
};
+137
-9
app/test/header.tsx
+137
-9
app/test/header.tsx
···
1
-
import { Home } from "../../components/Icons";
1
+
import { HomeMedium } from "../../components/Icons";
2
+
import * as Popover from "@radix-ui/react-popover";
3
+
4
+
function setBGPage(newBGPageColor: string) {
5
+
let root = document.querySelector(":root") as HTMLElement;
6
+
root?.style.setProperty("--bg-page", newBGPageColor);
7
+
}
8
+
9
+
function setBGCard(newBGCardColor: string) {
10
+
let root = document.querySelector(":root") as HTMLElement;
11
+
root?.style.setProperty("--bg-card", newBGCardColor);
12
+
}
13
+
14
+
function setAccent(newAccentColor: string) {
15
+
let root = document.querySelector(":root") as HTMLElement;
16
+
root?.style.setProperty("--accent", newAccentColor);
17
+
}
2
18
3
19
export const PageHeader = () => {
4
20
return (
5
-
<div className="pageHeader shrink-0 flex justify-between grow-0 mx-4">
6
-
<div className="w-[3px] bg-test h-6 mx-auto" />
7
-
{/* <div className="flex gap-4 items-center">
8
-
<div className="text-grey-55">
9
-
<Home />
21
+
<div className="pageHeader shrink-0 flex justify-between gap-4 grow-0 mx-4">
22
+
<div className="flex gap-4 items-center w-fit grow-0 shrink-0">
23
+
<button className="home text-grey-55">
24
+
<HomeMedium />
25
+
</button>
10
26
</div>
11
27
12
-
<ButtonPrimary>Share!</ButtonPrimary>
28
+
<div className="flex gap-3 items-center ">
29
+
<ThemePopover />
30
+
<InvitePopover />
31
+
</div>
13
32
</div>
14
-
<div>theme</div> */}
15
-
</div>
33
+
);
34
+
};
35
+
36
+
const ThemePopover = () => {
37
+
return (
38
+
<Popover.Root>
39
+
<Popover.Trigger>
40
+
{" "}
41
+
<div className="rounded-full w-6 h-6 border" />
42
+
</Popover.Trigger>
43
+
<Popover.Portal>
44
+
<Popover.Content
45
+
className="w-64 py-2 px-3 bg-white rounded-md border border-grey-80 flex flex-col gap-1"
46
+
align="center"
47
+
sideOffset={4}
48
+
collisionPadding={16}
49
+
>
50
+
<div className="flex gap-1">
51
+
<strong>page bg color</strong>
52
+
<button
53
+
onClick={() => {
54
+
setBGPage("240 247 250");
55
+
}}
56
+
>
57
+
blue
58
+
</button>
59
+
<button
60
+
onClick={() => {
61
+
setBGPage("255 234 234");
62
+
}}
63
+
>
64
+
pink
65
+
</button>
66
+
<button
67
+
onClick={() => {
68
+
setBGPage("226 251 201");
69
+
}}
70
+
>
71
+
green
72
+
</button>
73
+
</div>
74
+
<div>page bg image</div>
75
+
<div className="flex gap-1">
76
+
<strong>card bg</strong>
77
+
<button
78
+
onClick={() => {
79
+
setBGCard("255 255 255");
80
+
}}
81
+
>
82
+
white
83
+
</button>
84
+
<button
85
+
onClick={() => {
86
+
setBGCard("255 242 194");
87
+
}}
88
+
>
89
+
yellow
90
+
</button>
91
+
<button
92
+
onClick={() => {
93
+
setBGCard("245 228 255");
94
+
}}
95
+
>
96
+
purple
97
+
</button>
98
+
</div>
99
+
<div>text color</div>
100
+
<div className="flex gap-1">
101
+
<strong>accent color</strong>
102
+
<button>blue</button>
103
+
<button>magenta</button>
104
+
<button>gold</button>
105
+
</div>
106
+
107
+
<Popover.Arrow />
108
+
</Popover.Content>
109
+
</Popover.Portal>
110
+
</Popover.Root>
111
+
);
112
+
};
113
+
114
+
const InvitePopover = () => {
115
+
return (
116
+
<Popover.Root>
117
+
<Popover.Trigger> Invite </Popover.Trigger>
118
+
<Popover.Portal>
119
+
<Popover.Content
120
+
className="bg-white rounded-md border border-grey-80 py-1"
121
+
align="end"
122
+
sideOffset={4}
123
+
>
124
+
<div className="px-3 py-1 flex items-stretch justify-end gap-2 hover:bg-bg-accent ">
125
+
<div className="flex flex-col text-right">
126
+
<strong>Share</strong>
127
+
<small>read only</small>
128
+
</div>
129
+
<div className="w-6 bg-test my-1" />
130
+
</div>
131
+
132
+
<div className="py-1 px-3 flex items-stretch justify-end gap-2 hover:bg-bg-accent">
133
+
<div className="flex flex-col text-right">
134
+
<strong>Invite Collaborators</strong>
135
+
<small>full edit access</small>
136
+
</div>
137
+
<div className="w-6 bg-test my-1" />
138
+
</div>
139
+
140
+
<Popover.Arrow />
141
+
</Popover.Content>
142
+
</Popover.Portal>
143
+
</Popover.Root>
16
144
);
17
145
};
+11
-141
app/test/page.tsx
+11
-141
app/test/page.tsx
···
4
4
import { useState } from "react";
5
5
import useMeasure from "react-use-measure";
6
6
import { PageHeader } from "./header";
7
+
import { Card } from "./card";
7
8
8
9
export default function Index() {
9
10
let [cardRef, { width: cardWidth }] = useMeasure();
···
11
12
let [focusedCardIndex, setFocusedCardIndex] = useState(0);
12
13
13
14
return (
14
-
<div className="pageWrapper h-screen flex flex-col gap-4 py-4">
15
+
<div className="pageWrapper h-screen flex flex-col gap-4 py-4 !text">
15
16
<PageHeader />
16
17
17
18
<div
18
19
className="pageContentWrapper w-full relative overflow-x-scroll snap-x snap-mandatory grow items-stretch flex "
19
20
id="card-carousel"
20
21
>
21
-
<div className="pageContent flex ">
22
+
<div className="pageContent flex ">
22
23
<div style={{ width: `calc((100vw - ${cardWidth}px)/2)` }} />
23
24
24
25
{cards.map((card, index) => (
···
27
28
ref={index === 0 ? cardRef : null}
28
29
>
29
30
<Card
31
+
key={index}
30
32
first={index === 0}
31
33
focused={index === focusedCardIndex}
32
34
id={index.toString()}
33
-
key={index}
35
+
index={index}
36
+
setFocusedCardIndex={setFocusedCardIndex}
37
+
setCards={setCards}
38
+
cards={cards}
39
+
card={card}
40
+
cardWidth={cardWidth}
34
41
>
35
42
Card {card}
36
-
<AddCardButton
37
-
setCards={setCards}
38
-
cards={cards}
39
-
card={card}
40
-
setFocusedCardIndex={setFocusedCardIndex}
41
-
index={index}
42
-
/>
43
-
{index !== 0 && (
44
-
<RemoveCardButton
45
-
setCards={setCards}
46
-
cards={cards}
47
-
index={index}
48
-
/>
49
-
)}
50
-
<FocusCardButton
51
-
setFocusedCardIndex={setFocusedCardIndex}
52
-
index={index}
53
-
cardWidth={cardWidth}
54
-
/>
55
43
</Card>
56
44
</div>
57
45
))}
58
-
59
-
<div
60
-
style={{
61
-
width: `max(calc((100vw / 2) - ${cardWidth}px + 12px ), 300px)`,
62
-
}}
63
-
/>
46
+
<div style={{ width: `calc((100vw - ${cardWidth}px)/2)` }} />
64
47
</div>
65
48
</div>
66
49
</div>
67
50
);
68
51
}
69
-
70
-
const Card = (props: {
71
-
children: React.ReactNode;
72
-
first?: boolean;
73
-
focused?: boolean;
74
-
id: string;
75
-
}) => {
76
-
return (
77
-
<>
78
-
{/* if the card is the first one in the list, remove this div... can we do with :before? */}
79
-
{!props.first && <div className="w-6 md:snap-center" />}
80
-
<div
81
-
id={props.id}
82
-
className={`
83
-
p-3 w-[calc(100vw-12px)] md:w-[calc(50vw-24px)] max-w-prose
84
-
bg-bg-card border rounded-lg
85
-
grow flex flex-col gap-2
86
-
snap-center md:snap-align-none
87
-
${props.first && "snap-center"}
88
-
${props.focused ? "drop-shadow-lg border-grey-80" : "border-grey-90 "}`}
89
-
>
90
-
{props.children}
91
-
</div>
92
-
</>
93
-
);
94
-
};
95
-
96
-
const AddCardButton = (props: {
97
-
setCards: ([]) => void;
98
-
setFocusedCardIndex: (index: number) => void;
99
-
cards: number[];
100
-
card: number;
101
-
index: number;
102
-
}) => {
103
-
return (
104
-
<ButtonPrimary
105
-
onClick={() => {
106
-
//add a new card after this one
107
-
props.setCards([...props.cards, props.card + 1]);
108
-
109
-
// focus the new card
110
-
props.setFocusedCardIndex(props.index + 1);
111
-
112
-
//scroll the new card into view
113
-
setTimeout(() => {
114
-
let newCardID = document.getElementById((props.index + 1).toString());
115
-
newCardID?.scrollIntoView({
116
-
behavior: "smooth",
117
-
inline: "nearest",
118
-
});
119
-
}, 100);
120
-
}}
121
-
>
122
-
add card
123
-
</ButtonPrimary>
124
-
);
125
-
};
126
-
127
-
const RemoveCardButton = (props: {
128
-
setCards: ([]) => void;
129
-
cards: number[];
130
-
index: number;
131
-
}) => {
132
-
return (
133
-
<ButtonPrimary
134
-
onClick={() => {
135
-
props.cards.splice(props.index, 1);
136
-
props.setCards([...props.cards]);
137
-
}}
138
-
>
139
-
remove card
140
-
</ButtonPrimary>
141
-
);
142
-
};
143
-
144
-
const FocusCardButton = (props: {
145
-
setFocusedCardIndex: (index: number) => void;
146
-
index: number;
147
-
cardWidth: number;
148
-
}) => {
149
-
return (
150
-
<ButtonPrimary
151
-
onClick={() => {
152
-
//set the focused card to this one
153
-
props.setFocusedCardIndex(props.index);
154
-
155
-
// check if the card is off screen to the right or left
156
-
let cardPosition =
157
-
document
158
-
.getElementById(props.index.toString())
159
-
?.getBoundingClientRect().left || 0;
160
-
let isOffScreenLeft = cardPosition < 0;
161
-
let isOffScreenRight =
162
-
cardPosition + props.cardWidth > window.innerWidth;
163
-
164
-
//if card is off screen, scroll one card width to the left or right so that the card is in view
165
-
setTimeout(() => {
166
-
document.getElementById("card-carousel")?.scrollBy({
167
-
top: 0,
168
-
left: isOffScreenLeft
169
-
? -props.cardWidth
170
-
: isOffScreenRight
171
-
? props.cardWidth
172
-
: 0,
173
-
behavior: "smooth",
174
-
});
175
-
}, 100);
176
-
}}
177
-
>
178
-
focus this card
179
-
</ButtonPrimary>
180
-
);
181
-
};
+22
-2
components/Icons.tsx
+22
-2
components/Icons.tsx
···
2
2
3
3
type Props = SVGProps<SVGSVGElement>;
4
4
5
-
export const Home = (props: Props) => {
5
+
export const HomeMedium = (props: Props) => {
6
6
return (
7
7
<svg
8
-
width="33"
8
+
width="32"
9
9
height="32"
10
10
viewBox="0 0 33 32"
11
11
fill="none"
···
21
21
</svg>
22
22
);
23
23
};
24
+
25
+
export const SearchTiny = (props: Props) => {
26
+
return (
27
+
<svg
28
+
width="16"
29
+
height="16"
30
+
viewBox="0 0 16 16"
31
+
fill="none"
32
+
xmlns="http://www.w3.org/2000/svg"
33
+
{...props}
34
+
>
35
+
<path
36
+
fillRule="evenodd"
37
+
clipRule="evenodd"
38
+
d="M2.95685 7.38903C2.5496 5.40568 3.7763 3.51814 5.64053 3.13535C7.50476 2.75255 9.37599 4.00398 9.78324 5.98733C10.1905 7.97069 8.9638 9.85822 7.09957 10.241C5.23534 10.6238 3.36411 9.37239 2.95685 7.38903ZM5.36899 1.81294C2.73276 2.35425 1.08592 4.98923 1.63444 7.66057C2.18297 10.3319 4.73488 12.1047 7.37111 11.5634C8.07196 11.4195 8.70288 11.1276 9.24122 10.7264L13.1848 13.9403C13.613 14.2892 14.2429 14.225 14.5918 13.7969C14.9407 13.3688 14.8764 12.7389 14.4483 12.39L10.5619 9.2227C11.1395 8.20102 11.3616 6.96237 11.1057 5.7158C10.5571 3.04445 8.00522 1.27163 5.36899 1.81294ZM4.83423 6.30333C5.22704 6.22267 5.48009 5.83885 5.39944 5.44604C5.31878 5.05322 4.93496 4.80017 4.54214 4.88083C4.14933 4.96149 3.89628 5.34531 3.97694 5.73812C4.0576 6.13094 4.44142 6.38399 4.83423 6.30333ZM5.22415 7.40592C5.1635 7.06611 4.83887 6.83981 4.49906 6.90045C4.15925 6.9611 3.93295 7.28573 3.99359 7.62554C4.1788 8.66325 5.33436 9.59619 6.85483 9.38256C7.19665 9.33454 7.43481 9.0185 7.38679 8.67668C7.33876 8.33486 7.02273 8.09669 6.68091 8.14472C5.74535 8.27617 5.27738 7.70416 5.22415 7.40592Z"
39
+
fill="currentColor"
40
+
/>
41
+
</svg>
42
+
);
43
+
};
+617
-3
package-lock.json
+617
-3
package-lock.json
···
9
9
"version": "1.0.0",
10
10
"license": "ISC",
11
11
"dependencies": {
12
+
"@radix-ui/react-popover": "^1.0.7",
12
13
"next": "^14.2.3",
13
14
"react": "^18.3.1",
14
15
"react-dom": "^18.3.1",
···
36
37
},
37
38
"funding": {
38
39
"url": "https://github.com/sponsors/sindresorhus"
40
+
}
41
+
},
42
+
"node_modules/@babel/runtime": {
43
+
"version": "7.24.5",
44
+
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.5.tgz",
45
+
"integrity": "sha512-Nms86NXrsaeU9vbBJKni6gXiEXZ4CVpYVzEjDH9Sb8vmZ3UljyA1GSOJl/6LGPO8EHLuSF9H+IxNXHPX8QHJ4g==",
46
+
"dependencies": {
47
+
"regenerator-runtime": "^0.14.0"
48
+
},
49
+
"engines": {
50
+
"node": ">=6.9.0"
39
51
}
40
52
},
41
53
"node_modules/@cloudflare/kv-asset-handler": {
···
531
543
"node": ">=14"
532
544
}
533
545
},
546
+
"node_modules/@floating-ui/core": {
547
+
"version": "1.6.2",
548
+
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.2.tgz",
549
+
"integrity": "sha512-+2XpQV9LLZeanU4ZevzRnGFg2neDeKHgFLjP6YLW+tly0IvrhqT4u8enLGjLH3qeh85g19xY5rsAusfwTdn5lg==",
550
+
"dependencies": {
551
+
"@floating-ui/utils": "^0.2.0"
552
+
}
553
+
},
554
+
"node_modules/@floating-ui/dom": {
555
+
"version": "1.6.5",
556
+
"resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.5.tgz",
557
+
"integrity": "sha512-Nsdud2X65Dz+1RHjAIP0t8z5e2ff/IRbei6BqFrl1urT8sDVzM1HMQ+R0XcU5ceRfyO3I6ayeqIfh+6Wb8LGTw==",
558
+
"dependencies": {
559
+
"@floating-ui/core": "^1.0.0",
560
+
"@floating-ui/utils": "^0.2.0"
561
+
}
562
+
},
563
+
"node_modules/@floating-ui/react-dom": {
564
+
"version": "2.0.9",
565
+
"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.0.9.tgz",
566
+
"integrity": "sha512-q0umO0+LQK4+p6aGyvzASqKbKOJcAHJ7ycE9CuUvfx3s9zTHWmGJTPOIlM/hmSBfUfg/XfY5YhLBLR/LHwShQQ==",
567
+
"dependencies": {
568
+
"@floating-ui/dom": "^1.0.0"
569
+
},
570
+
"peerDependencies": {
571
+
"react": ">=16.8.0",
572
+
"react-dom": ">=16.8.0"
573
+
}
574
+
},
575
+
"node_modules/@floating-ui/utils": {
576
+
"version": "0.2.2",
577
+
"resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.2.tgz",
578
+
"integrity": "sha512-J4yDIIthosAsRZ5CPYP/jQvUAQtlZTTD/4suA08/FEnlxqW3sKS9iAhgsa9VYLZ6vDHn/ixJgIqRQPotoBjxIw=="
579
+
},
534
580
"node_modules/@isaacs/cliui": {
535
581
"version": "8.0.2",
536
582
"resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
···
803
849
"node": ">=14"
804
850
}
805
851
},
852
+
"node_modules/@radix-ui/primitive": {
853
+
"version": "1.0.1",
854
+
"resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.0.1.tgz",
855
+
"integrity": "sha512-yQ8oGX2GVsEYMWGxcovu1uGWPCxV5BFfeeYxqPmuAzUyLT9qmaMXSAhXpb0WrspIeqYzdJpkh2vHModJPgRIaw==",
856
+
"dependencies": {
857
+
"@babel/runtime": "^7.13.10"
858
+
}
859
+
},
860
+
"node_modules/@radix-ui/react-arrow": {
861
+
"version": "1.0.3",
862
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.0.3.tgz",
863
+
"integrity": "sha512-wSP+pHsB/jQRaL6voubsQ/ZlrGBHHrOjmBnr19hxYgtS0WvAFwZhK2WP/YY5yF9uKECCEEDGxuLxq1NBK51wFA==",
864
+
"dependencies": {
865
+
"@babel/runtime": "^7.13.10",
866
+
"@radix-ui/react-primitive": "1.0.3"
867
+
},
868
+
"peerDependencies": {
869
+
"@types/react": "*",
870
+
"@types/react-dom": "*",
871
+
"react": "^16.8 || ^17.0 || ^18.0",
872
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
873
+
},
874
+
"peerDependenciesMeta": {
875
+
"@types/react": {
876
+
"optional": true
877
+
},
878
+
"@types/react-dom": {
879
+
"optional": true
880
+
}
881
+
}
882
+
},
883
+
"node_modules/@radix-ui/react-compose-refs": {
884
+
"version": "1.0.1",
885
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.1.tgz",
886
+
"integrity": "sha512-fDSBgd44FKHa1FRMU59qBMPFcl2PZE+2nmqunj+BWFyYYjnhIDWL2ItDs3rrbJDQOtzt5nIebLCQc4QRfz6LJw==",
887
+
"dependencies": {
888
+
"@babel/runtime": "^7.13.10"
889
+
},
890
+
"peerDependencies": {
891
+
"@types/react": "*",
892
+
"react": "^16.8 || ^17.0 || ^18.0"
893
+
},
894
+
"peerDependenciesMeta": {
895
+
"@types/react": {
896
+
"optional": true
897
+
}
898
+
}
899
+
},
900
+
"node_modules/@radix-ui/react-context": {
901
+
"version": "1.0.1",
902
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.0.1.tgz",
903
+
"integrity": "sha512-ebbrdFoYTcuZ0v4wG5tedGnp9tzcV8awzsxYph7gXUyvnNLuTIcCk1q17JEbnVhXAKG9oX3KtchwiMIAYp9NLg==",
904
+
"dependencies": {
905
+
"@babel/runtime": "^7.13.10"
906
+
},
907
+
"peerDependencies": {
908
+
"@types/react": "*",
909
+
"react": "^16.8 || ^17.0 || ^18.0"
910
+
},
911
+
"peerDependenciesMeta": {
912
+
"@types/react": {
913
+
"optional": true
914
+
}
915
+
}
916
+
},
917
+
"node_modules/@radix-ui/react-dismissable-layer": {
918
+
"version": "1.0.5",
919
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.5.tgz",
920
+
"integrity": "sha512-aJeDjQhywg9LBu2t/At58hCvr7pEm0o2Ke1x33B+MhjNmmZ17sy4KImo0KPLgsnc/zN7GPdce8Cnn0SWvwZO7g==",
921
+
"dependencies": {
922
+
"@babel/runtime": "^7.13.10",
923
+
"@radix-ui/primitive": "1.0.1",
924
+
"@radix-ui/react-compose-refs": "1.0.1",
925
+
"@radix-ui/react-primitive": "1.0.3",
926
+
"@radix-ui/react-use-callback-ref": "1.0.1",
927
+
"@radix-ui/react-use-escape-keydown": "1.0.3"
928
+
},
929
+
"peerDependencies": {
930
+
"@types/react": "*",
931
+
"@types/react-dom": "*",
932
+
"react": "^16.8 || ^17.0 || ^18.0",
933
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
934
+
},
935
+
"peerDependenciesMeta": {
936
+
"@types/react": {
937
+
"optional": true
938
+
},
939
+
"@types/react-dom": {
940
+
"optional": true
941
+
}
942
+
}
943
+
},
944
+
"node_modules/@radix-ui/react-focus-guards": {
945
+
"version": "1.0.1",
946
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-focus-guards/-/react-focus-guards-1.0.1.tgz",
947
+
"integrity": "sha512-Rect2dWbQ8waGzhMavsIbmSVCgYxkXLxxR3ZvCX79JOglzdEy4JXMb98lq4hPxUbLr77nP0UOGf4rcMU+s1pUA==",
948
+
"dependencies": {
949
+
"@babel/runtime": "^7.13.10"
950
+
},
951
+
"peerDependencies": {
952
+
"@types/react": "*",
953
+
"react": "^16.8 || ^17.0 || ^18.0"
954
+
},
955
+
"peerDependenciesMeta": {
956
+
"@types/react": {
957
+
"optional": true
958
+
}
959
+
}
960
+
},
961
+
"node_modules/@radix-ui/react-focus-scope": {
962
+
"version": "1.0.4",
963
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-focus-scope/-/react-focus-scope-1.0.4.tgz",
964
+
"integrity": "sha512-sL04Mgvf+FmyvZeYfNu1EPAaaxD+aw7cYeIB9L9Fvq8+urhltTRaEo5ysKOpHuKPclsZcSUMKlN05x4u+CINpA==",
965
+
"dependencies": {
966
+
"@babel/runtime": "^7.13.10",
967
+
"@radix-ui/react-compose-refs": "1.0.1",
968
+
"@radix-ui/react-primitive": "1.0.3",
969
+
"@radix-ui/react-use-callback-ref": "1.0.1"
970
+
},
971
+
"peerDependencies": {
972
+
"@types/react": "*",
973
+
"@types/react-dom": "*",
974
+
"react": "^16.8 || ^17.0 || ^18.0",
975
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
976
+
},
977
+
"peerDependenciesMeta": {
978
+
"@types/react": {
979
+
"optional": true
980
+
},
981
+
"@types/react-dom": {
982
+
"optional": true
983
+
}
984
+
}
985
+
},
986
+
"node_modules/@radix-ui/react-id": {
987
+
"version": "1.0.1",
988
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.0.1.tgz",
989
+
"integrity": "sha512-tI7sT/kqYp8p96yGWY1OAnLHrqDgzHefRBKQ2YAkBS5ja7QLcZ9Z/uY7bEjPUatf8RomoXM8/1sMj1IJaE5UzQ==",
990
+
"dependencies": {
991
+
"@babel/runtime": "^7.13.10",
992
+
"@radix-ui/react-use-layout-effect": "1.0.1"
993
+
},
994
+
"peerDependencies": {
995
+
"@types/react": "*",
996
+
"react": "^16.8 || ^17.0 || ^18.0"
997
+
},
998
+
"peerDependenciesMeta": {
999
+
"@types/react": {
1000
+
"optional": true
1001
+
}
1002
+
}
1003
+
},
1004
+
"node_modules/@radix-ui/react-popover": {
1005
+
"version": "1.0.7",
1006
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.0.7.tgz",
1007
+
"integrity": "sha512-shtvVnlsxT6faMnK/a7n0wptwBD23xc1Z5mdrtKLwVEfsEMXodS0r5s0/g5P0hX//EKYZS2sxUjqfzlg52ZSnQ==",
1008
+
"dependencies": {
1009
+
"@babel/runtime": "^7.13.10",
1010
+
"@radix-ui/primitive": "1.0.1",
1011
+
"@radix-ui/react-compose-refs": "1.0.1",
1012
+
"@radix-ui/react-context": "1.0.1",
1013
+
"@radix-ui/react-dismissable-layer": "1.0.5",
1014
+
"@radix-ui/react-focus-guards": "1.0.1",
1015
+
"@radix-ui/react-focus-scope": "1.0.4",
1016
+
"@radix-ui/react-id": "1.0.1",
1017
+
"@radix-ui/react-popper": "1.1.3",
1018
+
"@radix-ui/react-portal": "1.0.4",
1019
+
"@radix-ui/react-presence": "1.0.1",
1020
+
"@radix-ui/react-primitive": "1.0.3",
1021
+
"@radix-ui/react-slot": "1.0.2",
1022
+
"@radix-ui/react-use-controllable-state": "1.0.1",
1023
+
"aria-hidden": "^1.1.1",
1024
+
"react-remove-scroll": "2.5.5"
1025
+
},
1026
+
"peerDependencies": {
1027
+
"@types/react": "*",
1028
+
"@types/react-dom": "*",
1029
+
"react": "^16.8 || ^17.0 || ^18.0",
1030
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
1031
+
},
1032
+
"peerDependenciesMeta": {
1033
+
"@types/react": {
1034
+
"optional": true
1035
+
},
1036
+
"@types/react-dom": {
1037
+
"optional": true
1038
+
}
1039
+
}
1040
+
},
1041
+
"node_modules/@radix-ui/react-popper": {
1042
+
"version": "1.1.3",
1043
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.1.3.tgz",
1044
+
"integrity": "sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==",
1045
+
"dependencies": {
1046
+
"@babel/runtime": "^7.13.10",
1047
+
"@floating-ui/react-dom": "^2.0.0",
1048
+
"@radix-ui/react-arrow": "1.0.3",
1049
+
"@radix-ui/react-compose-refs": "1.0.1",
1050
+
"@radix-ui/react-context": "1.0.1",
1051
+
"@radix-ui/react-primitive": "1.0.3",
1052
+
"@radix-ui/react-use-callback-ref": "1.0.1",
1053
+
"@radix-ui/react-use-layout-effect": "1.0.1",
1054
+
"@radix-ui/react-use-rect": "1.0.1",
1055
+
"@radix-ui/react-use-size": "1.0.1",
1056
+
"@radix-ui/rect": "1.0.1"
1057
+
},
1058
+
"peerDependencies": {
1059
+
"@types/react": "*",
1060
+
"@types/react-dom": "*",
1061
+
"react": "^16.8 || ^17.0 || ^18.0",
1062
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
1063
+
},
1064
+
"peerDependenciesMeta": {
1065
+
"@types/react": {
1066
+
"optional": true
1067
+
},
1068
+
"@types/react-dom": {
1069
+
"optional": true
1070
+
}
1071
+
}
1072
+
},
1073
+
"node_modules/@radix-ui/react-portal": {
1074
+
"version": "1.0.4",
1075
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.0.4.tgz",
1076
+
"integrity": "sha512-Qki+C/EuGUVCQTOTD5vzJzJuMUlewbzuKyUy+/iHM2uwGiru9gZeBJtHAPKAEkB5KWGi9mP/CHKcY0wt1aW45Q==",
1077
+
"dependencies": {
1078
+
"@babel/runtime": "^7.13.10",
1079
+
"@radix-ui/react-primitive": "1.0.3"
1080
+
},
1081
+
"peerDependencies": {
1082
+
"@types/react": "*",
1083
+
"@types/react-dom": "*",
1084
+
"react": "^16.8 || ^17.0 || ^18.0",
1085
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
1086
+
},
1087
+
"peerDependenciesMeta": {
1088
+
"@types/react": {
1089
+
"optional": true
1090
+
},
1091
+
"@types/react-dom": {
1092
+
"optional": true
1093
+
}
1094
+
}
1095
+
},
1096
+
"node_modules/@radix-ui/react-presence": {
1097
+
"version": "1.0.1",
1098
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.0.1.tgz",
1099
+
"integrity": "sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==",
1100
+
"dependencies": {
1101
+
"@babel/runtime": "^7.13.10",
1102
+
"@radix-ui/react-compose-refs": "1.0.1",
1103
+
"@radix-ui/react-use-layout-effect": "1.0.1"
1104
+
},
1105
+
"peerDependencies": {
1106
+
"@types/react": "*",
1107
+
"@types/react-dom": "*",
1108
+
"react": "^16.8 || ^17.0 || ^18.0",
1109
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
1110
+
},
1111
+
"peerDependenciesMeta": {
1112
+
"@types/react": {
1113
+
"optional": true
1114
+
},
1115
+
"@types/react-dom": {
1116
+
"optional": true
1117
+
}
1118
+
}
1119
+
},
1120
+
"node_modules/@radix-ui/react-primitive": {
1121
+
"version": "1.0.3",
1122
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz",
1123
+
"integrity": "sha512-yi58uVyoAcK/Nq1inRY56ZSjKypBNKTa/1mcL8qdl6oJeEaDbOldlzrGn7P6Q3Id5d+SYNGc5AJgc4vGhjs5+g==",
1124
+
"dependencies": {
1125
+
"@babel/runtime": "^7.13.10",
1126
+
"@radix-ui/react-slot": "1.0.2"
1127
+
},
1128
+
"peerDependencies": {
1129
+
"@types/react": "*",
1130
+
"@types/react-dom": "*",
1131
+
"react": "^16.8 || ^17.0 || ^18.0",
1132
+
"react-dom": "^16.8 || ^17.0 || ^18.0"
1133
+
},
1134
+
"peerDependenciesMeta": {
1135
+
"@types/react": {
1136
+
"optional": true
1137
+
},
1138
+
"@types/react-dom": {
1139
+
"optional": true
1140
+
}
1141
+
}
1142
+
},
1143
+
"node_modules/@radix-ui/react-slot": {
1144
+
"version": "1.0.2",
1145
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.0.2.tgz",
1146
+
"integrity": "sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==",
1147
+
"dependencies": {
1148
+
"@babel/runtime": "^7.13.10",
1149
+
"@radix-ui/react-compose-refs": "1.0.1"
1150
+
},
1151
+
"peerDependencies": {
1152
+
"@types/react": "*",
1153
+
"react": "^16.8 || ^17.0 || ^18.0"
1154
+
},
1155
+
"peerDependenciesMeta": {
1156
+
"@types/react": {
1157
+
"optional": true
1158
+
}
1159
+
}
1160
+
},
1161
+
"node_modules/@radix-ui/react-use-callback-ref": {
1162
+
"version": "1.0.1",
1163
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz",
1164
+
"integrity": "sha512-D94LjX4Sp0xJFVaoQOd3OO9k7tpBYNOXdVhkltUbGv2Qb9OXdrg/CpsjlZv7ia14Sylv398LswWBVVu5nqKzAQ==",
1165
+
"dependencies": {
1166
+
"@babel/runtime": "^7.13.10"
1167
+
},
1168
+
"peerDependencies": {
1169
+
"@types/react": "*",
1170
+
"react": "^16.8 || ^17.0 || ^18.0"
1171
+
},
1172
+
"peerDependenciesMeta": {
1173
+
"@types/react": {
1174
+
"optional": true
1175
+
}
1176
+
}
1177
+
},
1178
+
"node_modules/@radix-ui/react-use-controllable-state": {
1179
+
"version": "1.0.1",
1180
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.1.tgz",
1181
+
"integrity": "sha512-Svl5GY5FQeN758fWKrjM6Qb7asvXeiZltlT4U2gVfl8Gx5UAv2sMR0LWo8yhsIZh2oQ0eFdZ59aoOOMV7b47VA==",
1182
+
"dependencies": {
1183
+
"@babel/runtime": "^7.13.10",
1184
+
"@radix-ui/react-use-callback-ref": "1.0.1"
1185
+
},
1186
+
"peerDependencies": {
1187
+
"@types/react": "*",
1188
+
"react": "^16.8 || ^17.0 || ^18.0"
1189
+
},
1190
+
"peerDependenciesMeta": {
1191
+
"@types/react": {
1192
+
"optional": true
1193
+
}
1194
+
}
1195
+
},
1196
+
"node_modules/@radix-ui/react-use-escape-keydown": {
1197
+
"version": "1.0.3",
1198
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.3.tgz",
1199
+
"integrity": "sha512-vyL82j40hcFicA+M4Ex7hVkB9vHgSse1ZWomAqV2Je3RleKGO5iM8KMOEtfoSB0PnIelMd2lATjTGMYqN5ylTg==",
1200
+
"dependencies": {
1201
+
"@babel/runtime": "^7.13.10",
1202
+
"@radix-ui/react-use-callback-ref": "1.0.1"
1203
+
},
1204
+
"peerDependencies": {
1205
+
"@types/react": "*",
1206
+
"react": "^16.8 || ^17.0 || ^18.0"
1207
+
},
1208
+
"peerDependenciesMeta": {
1209
+
"@types/react": {
1210
+
"optional": true
1211
+
}
1212
+
}
1213
+
},
1214
+
"node_modules/@radix-ui/react-use-layout-effect": {
1215
+
"version": "1.0.1",
1216
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz",
1217
+
"integrity": "sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==",
1218
+
"dependencies": {
1219
+
"@babel/runtime": "^7.13.10"
1220
+
},
1221
+
"peerDependencies": {
1222
+
"@types/react": "*",
1223
+
"react": "^16.8 || ^17.0 || ^18.0"
1224
+
},
1225
+
"peerDependenciesMeta": {
1226
+
"@types/react": {
1227
+
"optional": true
1228
+
}
1229
+
}
1230
+
},
1231
+
"node_modules/@radix-ui/react-use-rect": {
1232
+
"version": "1.0.1",
1233
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-rect/-/react-use-rect-1.0.1.tgz",
1234
+
"integrity": "sha512-Cq5DLuSiuYVKNU8orzJMbl15TXilTnJKUCltMVQg53BQOF1/C5toAaGrowkgksdBQ9H+SRL23g0HDmg9tvmxXw==",
1235
+
"dependencies": {
1236
+
"@babel/runtime": "^7.13.10",
1237
+
"@radix-ui/rect": "1.0.1"
1238
+
},
1239
+
"peerDependencies": {
1240
+
"@types/react": "*",
1241
+
"react": "^16.8 || ^17.0 || ^18.0"
1242
+
},
1243
+
"peerDependenciesMeta": {
1244
+
"@types/react": {
1245
+
"optional": true
1246
+
}
1247
+
}
1248
+
},
1249
+
"node_modules/@radix-ui/react-use-size": {
1250
+
"version": "1.0.1",
1251
+
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-size/-/react-use-size-1.0.1.tgz",
1252
+
"integrity": "sha512-ibay+VqrgcaI6veAojjofPATwledXiSmX+C0KrBk/xgpX9rBzPV3OsfwlhQdUOFbh+LKQorLYT+xTXW9V8yd0g==",
1253
+
"dependencies": {
1254
+
"@babel/runtime": "^7.13.10",
1255
+
"@radix-ui/react-use-layout-effect": "1.0.1"
1256
+
},
1257
+
"peerDependencies": {
1258
+
"@types/react": "*",
1259
+
"react": "^16.8 || ^17.0 || ^18.0"
1260
+
},
1261
+
"peerDependenciesMeta": {
1262
+
"@types/react": {
1263
+
"optional": true
1264
+
}
1265
+
}
1266
+
},
1267
+
"node_modules/@radix-ui/rect": {
1268
+
"version": "1.0.1",
1269
+
"resolved": "https://registry.npmjs.org/@radix-ui/rect/-/rect-1.0.1.tgz",
1270
+
"integrity": "sha512-fyrgCaedtvMg9NK3en0pnOYJdtfwxUcNolezkNPUsoX57X8oQk+NkqcvzHXD2uKNij6GXmWU9NDru2IWjrO4BQ==",
1271
+
"dependencies": {
1272
+
"@babel/runtime": "^7.13.10"
1273
+
}
1274
+
},
806
1275
"node_modules/@swc/counter": {
807
1276
"version": "0.1.3",
808
1277
"resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.3.tgz",
···
839
1308
"version": "15.7.12",
840
1309
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.12.tgz",
841
1310
"integrity": "sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==",
842
-
"dev": true
1311
+
"devOptional": true
843
1312
},
844
1313
"node_modules/@types/react": {
845
1314
"version": "18.3.2",
846
1315
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.2.tgz",
847
1316
"integrity": "sha512-Btgg89dAnqD4vV7R3hlwOxgqobUQKgx3MmrQRi0yYbs/P0ym8XozIAlkqVilPqHQwXs4e9Tf63rrCgl58BcO4w==",
848
-
"dev": true,
1317
+
"devOptional": true,
849
1318
"dependencies": {
850
1319
"@types/prop-types": "*",
851
1320
"csstype": "^3.0.2"
···
932
1401
"resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
933
1402
"integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==",
934
1403
"dev": true
1404
+
},
1405
+
"node_modules/aria-hidden": {
1406
+
"version": "1.2.4",
1407
+
"resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.4.tgz",
1408
+
"integrity": "sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==",
1409
+
"dependencies": {
1410
+
"tslib": "^2.0.0"
1411
+
},
1412
+
"engines": {
1413
+
"node": ">=10"
1414
+
}
935
1415
},
936
1416
"node_modules/as-table": {
937
1417
"version": "1.0.55",
···
1233
1713
"version": "3.1.3",
1234
1714
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
1235
1715
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
1236
-
"dev": true
1716
+
"devOptional": true
1237
1717
},
1238
1718
"node_modules/data-uri-to-buffer": {
1239
1719
"version": "4.0.1",
···
1265
1745
"optional": true
1266
1746
}
1267
1747
}
1748
+
},
1749
+
"node_modules/detect-node-es": {
1750
+
"version": "1.1.0",
1751
+
"resolved": "https://registry.npmjs.org/detect-node-es/-/detect-node-es-1.1.0.tgz",
1752
+
"integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ=="
1268
1753
},
1269
1754
"node_modules/didyoumean": {
1270
1755
"version": "1.2.2",
···
1496
1981
"url": "https://github.com/sponsors/ljharb"
1497
1982
}
1498
1983
},
1984
+
"node_modules/get-nonce": {
1985
+
"version": "1.0.1",
1986
+
"resolved": "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz",
1987
+
"integrity": "sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==",
1988
+
"engines": {
1989
+
"node": ">=6"
1990
+
}
1991
+
},
1499
1992
"node_modules/get-source": {
1500
1993
"version": "2.0.12",
1501
1994
"resolved": "https://registry.npmjs.org/get-source/-/get-source-2.0.12.tgz",
···
1591
2084
"node": ">=0.8.19"
1592
2085
}
1593
2086
},
2087
+
"node_modules/invariant": {
2088
+
"version": "2.2.4",
2089
+
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
2090
+
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
2091
+
"dependencies": {
2092
+
"loose-envify": "^1.0.0"
2093
+
}
2094
+
},
1594
2095
"node_modules/is-binary-path": {
1595
2096
"version": "2.1.0",
1596
2097
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
···
2349
2850
"react": "^18.3.1"
2350
2851
}
2351
2852
},
2853
+
"node_modules/react-remove-scroll": {
2854
+
"version": "2.5.5",
2855
+
"resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.5.5.tgz",
2856
+
"integrity": "sha512-ImKhrzJJsyXJfBZ4bzu8Bwpka14c/fQt0k+cyFp/PBhTfyDnU5hjOtM4AG/0AMyy8oKzOTR0lDgJIM7pYXI0kw==",
2857
+
"dependencies": {
2858
+
"react-remove-scroll-bar": "^2.3.3",
2859
+
"react-style-singleton": "^2.2.1",
2860
+
"tslib": "^2.1.0",
2861
+
"use-callback-ref": "^1.3.0",
2862
+
"use-sidecar": "^1.1.2"
2863
+
},
2864
+
"engines": {
2865
+
"node": ">=10"
2866
+
},
2867
+
"peerDependencies": {
2868
+
"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
2869
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
2870
+
},
2871
+
"peerDependenciesMeta": {
2872
+
"@types/react": {
2873
+
"optional": true
2874
+
}
2875
+
}
2876
+
},
2877
+
"node_modules/react-remove-scroll-bar": {
2878
+
"version": "2.3.6",
2879
+
"resolved": "https://registry.npmjs.org/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.6.tgz",
2880
+
"integrity": "sha512-DtSYaao4mBmX+HDo5YWYdBWQwYIQQshUV/dVxFxK+KM26Wjwp1gZ6rv6OC3oujI6Bfu6Xyg3TwK533AQutsn/g==",
2881
+
"dependencies": {
2882
+
"react-style-singleton": "^2.2.1",
2883
+
"tslib": "^2.0.0"
2884
+
},
2885
+
"engines": {
2886
+
"node": ">=10"
2887
+
},
2888
+
"peerDependencies": {
2889
+
"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
2890
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
2891
+
},
2892
+
"peerDependenciesMeta": {
2893
+
"@types/react": {
2894
+
"optional": true
2895
+
}
2896
+
}
2897
+
},
2898
+
"node_modules/react-style-singleton": {
2899
+
"version": "2.2.1",
2900
+
"resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.1.tgz",
2901
+
"integrity": "sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g==",
2902
+
"dependencies": {
2903
+
"get-nonce": "^1.0.0",
2904
+
"invariant": "^2.2.4",
2905
+
"tslib": "^2.0.0"
2906
+
},
2907
+
"engines": {
2908
+
"node": ">=10"
2909
+
},
2910
+
"peerDependencies": {
2911
+
"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
2912
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
2913
+
},
2914
+
"peerDependenciesMeta": {
2915
+
"@types/react": {
2916
+
"optional": true
2917
+
}
2918
+
}
2919
+
},
2352
2920
"node_modules/react-use-measure": {
2353
2921
"version": "2.1.1",
2354
2922
"resolved": "https://registry.npmjs.org/react-use-measure/-/react-use-measure-2.1.1.tgz",
···
2390
2958
"engines": {
2391
2959
"node": ">=8.10.0"
2392
2960
}
2961
+
},
2962
+
"node_modules/regenerator-runtime": {
2963
+
"version": "0.14.1",
2964
+
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
2965
+
"integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
2393
2966
},
2394
2967
"node_modules/resolve": {
2395
2968
"version": "1.22.8",
···
2944
3517
},
2945
3518
"peerDependencies": {
2946
3519
"browserslist": ">= 4.21.0"
3520
+
}
3521
+
},
3522
+
"node_modules/use-callback-ref": {
3523
+
"version": "1.3.2",
3524
+
"resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.3.2.tgz",
3525
+
"integrity": "sha512-elOQwe6Q8gqZgDA8mrh44qRTQqpIHDcZ3hXTLjBe1i4ph8XpNJnO+aQf3NaG+lriLopI4HMx9VjQLfPQ6vhnoA==",
3526
+
"dependencies": {
3527
+
"tslib": "^2.0.0"
3528
+
},
3529
+
"engines": {
3530
+
"node": ">=10"
3531
+
},
3532
+
"peerDependencies": {
3533
+
"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
3534
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
3535
+
},
3536
+
"peerDependenciesMeta": {
3537
+
"@types/react": {
3538
+
"optional": true
3539
+
}
3540
+
}
3541
+
},
3542
+
"node_modules/use-sidecar": {
3543
+
"version": "1.1.2",
3544
+
"resolved": "https://registry.npmjs.org/use-sidecar/-/use-sidecar-1.1.2.tgz",
3545
+
"integrity": "sha512-epTbsLuzZ7lPClpz2TyryBfztm7m+28DlEv2ZCQ3MDr5ssiwyOwGH/e5F9CkfWjJ1t4clvI58yF822/GUkjjhw==",
3546
+
"dependencies": {
3547
+
"detect-node-es": "^1.1.0",
3548
+
"tslib": "^2.0.0"
3549
+
},
3550
+
"engines": {
3551
+
"node": ">=10"
3552
+
},
3553
+
"peerDependencies": {
3554
+
"@types/react": "^16.9.0 || ^17.0.0 || ^18.0.0",
3555
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
3556
+
},
3557
+
"peerDependenciesMeta": {
3558
+
"@types/react": {
3559
+
"optional": true
3560
+
}
2947
3561
}
2948
3562
},
2949
3563
"node_modules/util-deprecate": {
+1
package.json
+1
package.json
+3
-2
tailwind.config.js
+3
-2
tailwind.config.js
···
30
30
"accent": "#0000FF",
31
31
32
32
//BG COLORS
33
-
"bg-page": "floralwhite",
34
-
"bg-card": "white",
33
+
"bg-page": "rgb(var(--bg-page) / <alpha-value>)",
34
+
"bg-card": "rgb(var(--bg-card) / <alpha-value>)",
35
+
"bg-accent": "#F0F7FA",
35
36
36
37
//DO NOT USE IN PRODUCTION. Test colors to aid development, ie, setting bg color on element to see edges of div. DO. NOT. USE. IN. PRODUCTION
37
38
"test": "#E18181",