Compare commits
No commits in common. "5.0.0" and "main" have entirely different histories.
@ -1,18 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
root: true,
|
|
||||||
env: { browser: true, es2020: true },
|
|
||||||
extends: [
|
|
||||||
'eslint:recommended',
|
|
||||||
'plugin:@typescript-eslint/recommended',
|
|
||||||
'plugin:react-hooks/recommended',
|
|
||||||
],
|
|
||||||
ignorePatterns: ['dist', '.eslintrc.cjs'],
|
|
||||||
parser: '@typescript-eslint/parser',
|
|
||||||
plugins: ['react-refresh'],
|
|
||||||
rules: {
|
|
||||||
'react-refresh/only-export-components': [
|
|
||||||
'warn',
|
|
||||||
{ allowConstantExport: true },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
}
|
|
||||||
32
.gitignore
vendored
32
.gitignore
vendored
@ -1,28 +1,3 @@
|
|||||||
# Logs
|
|
||||||
logs
|
|
||||||
*.log
|
|
||||||
npm-debug.log*
|
|
||||||
yarn-debug.log*
|
|
||||||
yarn-error.log*
|
|
||||||
pnpm-debug.log*
|
|
||||||
lerna-debug.log*
|
|
||||||
|
|
||||||
node_modules
|
|
||||||
dist
|
|
||||||
dist-ssr
|
|
||||||
*.local
|
|
||||||
|
|
||||||
# Editor directories and files
|
|
||||||
.vscode/*
|
|
||||||
!.vscode/extensions.json
|
|
||||||
.idea
|
|
||||||
.DS_Store
|
|
||||||
*.suo
|
|
||||||
*.ntvs*
|
|
||||||
*.njsproj
|
|
||||||
*.sln
|
|
||||||
*.sw?
|
|
||||||
|
|
||||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||||
|
|
||||||
# dependencies
|
# dependencies
|
||||||
@ -60,10 +35,3 @@ yarn-error.log*
|
|||||||
*.tsbuildinfo
|
*.tsbuildinfo
|
||||||
next-env.d.ts
|
next-env.d.ts
|
||||||
.syncignore
|
.syncignore
|
||||||
|
|
||||||
# log
|
|
||||||
app.log
|
|
||||||
|
|
||||||
# doc
|
|
||||||
doc/.vitepress/dist
|
|
||||||
doc/.vitepress/cache
|
|
||||||
@ -6,3 +6,4 @@
|
|||||||
"printWidth": 120,
|
"printWidth": 120,
|
||||||
"endOfLine": "lf"
|
"endOfLine": "lf"
|
||||||
}
|
}
|
||||||
|
|
||||||
BIN
app/favicon.ico
Normal file
BIN
app/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
33
app/global.css
Normal file
33
app/global.css
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--foreground-rgb: 0, 0, 0;
|
||||||
|
--background-start-rgb: 214, 219, 220;
|
||||||
|
--background-end-rgb: 255, 255, 255;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
:root {
|
||||||
|
--foreground-rgb: 255, 255, 255;
|
||||||
|
--background-start-rgb: 0, 0, 0;
|
||||||
|
--background-end-rgb: 0, 0, 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
color: rgb(var(--foreground-rgb));
|
||||||
|
background: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
transparent,
|
||||||
|
rgb(var(--background-end-rgb))
|
||||||
|
)
|
||||||
|
rgb(var(--background-start-rgb));
|
||||||
|
}
|
||||||
|
|
||||||
|
@layer utilities {
|
||||||
|
.text-balance {
|
||||||
|
text-wrap: balance;
|
||||||
|
}
|
||||||
|
}
|
||||||
22
app/layout.tsx
Normal file
22
app/layout.tsx
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
import type { Metadata } from "next";
|
||||||
|
import { Inter } from "next/font/google";
|
||||||
|
import "./global.css";
|
||||||
|
|
||||||
|
const inter = Inter({ subsets: ["latin"] });
|
||||||
|
|
||||||
|
export const metadata: Metadata = {
|
||||||
|
title: "Create Next App",
|
||||||
|
description: "Generated by create next app"
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function RootLayout({
|
||||||
|
children
|
||||||
|
}: Readonly<{
|
||||||
|
children: React.ReactNode;
|
||||||
|
}>) {
|
||||||
|
return (
|
||||||
|
<html lang="en">
|
||||||
|
<body className={inter.className}>{children}</body>
|
||||||
|
</html>
|
||||||
|
);
|
||||||
|
}
|
||||||
12
app/page.tsx
Normal file
12
app/page.tsx
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { RecoilRoot } from "recoil";
|
||||||
|
import Homepage from "../components";
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<RecoilRoot>
|
||||||
|
<Homepage />
|
||||||
|
</RecoilRoot>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,34 +1,41 @@
|
|||||||
import { useEffect, useState } from "react";
|
import Image from "next/image";
|
||||||
import { useAtom } from "jotai";
|
import { useRecoilValue } from "recoil";
|
||||||
import { bgFocusAtom } from "../lib/state/background";
|
import { settingsState } from "./state/settings";
|
||||||
import BackgroundContainer from "./backgroundContainer";
|
import validUrl from "valid-url";
|
||||||
|
import validateColor from "validate-color";
|
||||||
export default function Background() {
|
|
||||||
const [isFocus, setFocus] = useAtom(bgFocusAtom);
|
|
||||||
const [darkMode, setDarkMode] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const colorSchemeQueryList = window.matchMedia("(prefers-color-scheme: dark)");
|
|
||||||
setDarkMode(colorSchemeQueryList.matches ? true : false);
|
|
||||||
|
|
||||||
const handleChange = () => {
|
|
||||||
setDarkMode(colorSchemeQueryList.matches ? true : false);
|
|
||||||
};
|
|
||||||
|
|
||||||
colorSchemeQueryList.addEventListener("change", handleChange);
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
colorSchemeQueryList.removeEventListener("change", handleChange);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
|
function Background(props: {
|
||||||
|
isFocus: boolean;
|
||||||
|
src: string;
|
||||||
|
onClick: () => void;
|
||||||
|
}) {
|
||||||
|
const settings = useRecoilValue(settingsState);
|
||||||
|
if (validateColor(props.src)) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div
|
||||||
{darkMode ? (
|
className="w-full h-full fixed object-cover inset-0 duration-200 z-0"
|
||||||
<BackgroundContainer src="rgb(23,25,29)" isFocus={isFocus} onClick={() => setFocus(false)} darkMode={darkMode}/>
|
style={{ backgroundColor: props.src }}
|
||||||
) : (
|
onClick={props.onClick}
|
||||||
<BackgroundContainer src="white" isFocus={isFocus} onClick={() => setFocus(false)} darkMode={darkMode}/>
|
></div>
|
||||||
)}
|
);
|
||||||
</div>
|
} else if (validUrl.isWebUri(props.src)) {
|
||||||
|
return (
|
||||||
|
<Image
|
||||||
|
src={props.src}
|
||||||
|
className={
|
||||||
|
"w-full h-full fixed object-cover inset-0 duration-200 z-0 " +
|
||||||
|
(props.isFocus
|
||||||
|
? settings.bgBlur
|
||||||
|
? "blur-lg scale-110"
|
||||||
|
: "brightness-50 scale-105"
|
||||||
|
: "")
|
||||||
|
}
|
||||||
|
alt="background"
|
||||||
|
onClick={props.onClick}
|
||||||
|
fill={true}
|
||||||
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Background;
|
||||||
|
|||||||
@ -1,50 +0,0 @@
|
|||||||
import { settingsAtom } from "lib/state/settings";
|
|
||||||
import validUrl from "valid-url";
|
|
||||||
import validateColor from "validate-color";
|
|
||||||
import { useAtomValue } from "jotai";
|
|
||||||
|
|
||||||
export default function BackgroundContainer(props: {
|
|
||||||
isFocus: boolean;
|
|
||||||
src: string;
|
|
||||||
darkMode: boolean;
|
|
||||||
onClick: () => void;
|
|
||||||
}) {
|
|
||||||
const settings = useAtomValue(settingsAtom);
|
|
||||||
if (validateColor(props.src)) {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="w-full h-full fixed object-cover inset-0 duration-200 z-0"
|
|
||||||
style={{ backgroundColor: props.src }}
|
|
||||||
onClick={props.onClick}
|
|
||||||
></div>
|
|
||||||
);
|
|
||||||
} else if (validUrl.isWebUri(props.src)) {
|
|
||||||
return (
|
|
||||||
<img
|
|
||||||
src={props.src}
|
|
||||||
className={
|
|
||||||
"w-full h-full fixed object-cover inset-0 duration-200 z-0 " +
|
|
||||||
(props.isFocus ? (settings.bgBlur ? "blur-lg scale-110" : "brightness-50 scale-105") : "")
|
|
||||||
}
|
|
||||||
alt="background"
|
|
||||||
onClick={props.onClick}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
if (props.darkMode) {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="w-full h-full fixed object-cover inset-0 duration-200 z-0 bg-[rgb(23,25,29)]"
|
|
||||||
onClick={props.onClick}
|
|
||||||
></div>
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="w-full h-full fixed object-cover inset-0 duration-200 z-0 bg-white"
|
|
||||||
onClick={props.onClick}
|
|
||||||
></div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
23
components/index.tsx
Normal file
23
components/index.tsx
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
import { useRecoilState } from "recoil";
|
||||||
|
import Background from "./background";
|
||||||
|
import Search from "./search/search";
|
||||||
|
import { bgFocusState } from "./state/background";
|
||||||
|
|
||||||
|
export default function Homepage() {
|
||||||
|
const [isFocus, setFocus] = useRecoilState(bgFocusState);
|
||||||
|
return (
|
||||||
|
<div className="h-full fixed overflow-hidden w-full bg-black">
|
||||||
|
<Background
|
||||||
|
src="rgb(23,25,29)"
|
||||||
|
isFocus={isFocus}
|
||||||
|
onClick={() => setFocus(false)}
|
||||||
|
/>
|
||||||
|
<Search
|
||||||
|
onFocus={() => {
|
||||||
|
setFocus(true);
|
||||||
|
console.log("focus");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,87 +0,0 @@
|
|||||||
import { KeyboardEvent, useRef } from "react";
|
|
||||||
import { useAtom, useAtomValue } from "jotai";
|
|
||||||
import { settingsAtom } from "lib/state/settings";
|
|
||||||
import { queryAtom } from "lib/state/query";
|
|
||||||
import { selectedSuggestionAtom } from "lib/state/suggestionSelection";
|
|
||||||
import handleEnter from "lib/onesearch/handleEnter";
|
|
||||||
import { suggestionAtom } from "lib/state/suggestion";
|
|
||||||
|
|
||||||
|
|
||||||
export default function Search(props: { onFocus: () => void }) {
|
|
||||||
const settings = useAtomValue(settingsAtom);
|
|
||||||
const [query, setQuery] = useAtom(queryAtom);
|
|
||||||
const [selectedSuggestion, setSelected] = useAtom(selectedSuggestionAtom);
|
|
||||||
const suggestions = useAtomValue(suggestionAtom);
|
|
||||||
const searchBoxRef = useRef<HTMLInputElement>(null);
|
|
||||||
|
|
||||||
const style = "default";
|
|
||||||
|
|
||||||
function handleKeydown(e: KeyboardEvent) {
|
|
||||||
if (e.key == "Enter") {
|
|
||||||
e.preventDefault();
|
|
||||||
handleEnter(selectedSuggestion, suggestions, query, settings, searchBoxRef);
|
|
||||||
return;
|
|
||||||
} else if (e.key == "ArrowUp") {
|
|
||||||
e.preventDefault();
|
|
||||||
const len = suggestions.length;
|
|
||||||
setSelected((selectedSuggestion - 1 + len) % len);
|
|
||||||
} else if (e.key == "ArrowDown") {
|
|
||||||
e.preventDefault();
|
|
||||||
const len = suggestions.length;
|
|
||||||
setSelected((selectedSuggestion + 1) % len);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (style === "default") {
|
|
||||||
return (
|
|
||||||
// 祖传样式，勿动
|
|
||||||
<div className="absolute w-full top-[8.5rem] lg:top-56 short:top-24 z-1 left-1/2 translate-x-[-50%] ">
|
|
||||||
<input
|
|
||||||
className="absolute z-1 w-11/12 sm:w-[700px] h-10 rounded-lg left-1/2 translate-x-[-50%]
|
|
||||||
text-center outline-none border-[1px] focus:border-2 duration-200 pr-2 shadow-md focus:shadow-none dark:shadow-zinc-800 dark:shadow-md bg-white dark:bg-[rgb(23,25,29)]
|
|
||||||
dark:border-neutral-500 dark:focus:border-neutral-300 placeholder:text-slate-500
|
|
||||||
dark:placeholder:text-slate-400 text-slate-900 dark:text-white"
|
|
||||||
id="searchBox"
|
|
||||||
type="text"
|
|
||||||
placeholder="placeholder"
|
|
||||||
onFocus={props.onFocus}
|
|
||||||
onKeyDown={handleKeydown}
|
|
||||||
onChange={(e) =>
|
|
||||||
setQuery(() => {
|
|
||||||
return e.target.value;
|
|
||||||
})
|
|
||||||
}
|
|
||||||
autoComplete="off"
|
|
||||||
autoCorrect="off"
|
|
||||||
autoCapitalize="off"
|
|
||||||
spellCheck="false"
|
|
||||||
ref={searchBoxRef}
|
|
||||||
value={query}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
} else if (style == "image") {
|
|
||||||
return (
|
|
||||||
// 祖传样式，勿动
|
|
||||||
<div className="absolute w-full top-[8.5rem] lg:top-56 short:top-24 z-1 left-1/2 translate-x-[-50%] ">
|
|
||||||
<input
|
|
||||||
className={
|
|
||||||
`absolute z-1 w-2/3 sm:w-80 md:w-[400px] focus:w-11/12 focus:sm:w-[700px] hover:w-11/12
|
|
||||||
hover:sm:w-[700px] h-10 rounded-3xl left-1/2 translate-x-[-50%] text-center outline-none
|
|
||||||
border-solid border-0 duration-200 pr-2 shadow-md focus:shadow-none` +
|
|
||||||
(settings.bgBlur
|
|
||||||
? `bg-[rgba(255,255,255,0.5)] dark:bg-[rgba(24,24,24,0.75)] backdrop-blur-xl
|
|
||||||
placeholder:text-slate-500 dark:placeholder:text-slate-400 text-slate-900 dark:text-white`
|
|
||||||
: `bg-[rgba(235,235,235,0.9)] dark:bg-[rgba(20,20,20,0.9)] placeholder:text-slate-500
|
|
||||||
text-slate-800 dark:text-white`)
|
|
||||||
}
|
|
||||||
id="searchBox"
|
|
||||||
type="text"
|
|
||||||
placeholder="placeholder"
|
|
||||||
onFocus={props.onFocus}
|
|
||||||
ref={searchBoxRef}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
48
components/search/search.tsx
Normal file
48
components/search/search.tsx
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
import { atom, useRecoilValue } from "recoil";
|
||||||
|
import { settingsState } from "../state/settings";
|
||||||
|
|
||||||
|
export default function Search(props: {
|
||||||
|
onFocus: () => void;
|
||||||
|
}) {
|
||||||
|
const settings = useRecoilValue(settingsState);
|
||||||
|
let style = "default";
|
||||||
|
if (style === "default") {
|
||||||
|
return (
|
||||||
|
// 祖传样式，勿动
|
||||||
|
<div className="absolute w-full top-[8.5rem] lg:top-56 short:top-24 z-1 left-1/2 translate-x-[-50%] ">
|
||||||
|
<input
|
||||||
|
className="absolute z-1 w-11/12 sm:w-[700px] h-10 rounded-lg left-1/2 translate-x-[-50%]
|
||||||
|
text-center outline-none border-[1px] focus:border-2 duration-200 pr-2 shadow-lg bg-white dark:bg-[rgb(23,25,29)]
|
||||||
|
dark:border-neutral-500 dark:focus:border-neutral-300 placeholder:text-slate-500
|
||||||
|
dark:placeholder:text-slate-400 text-slate-900 dark:text-white"
|
||||||
|
id="searchBox"
|
||||||
|
type="text"
|
||||||
|
placeholder="Search"
|
||||||
|
onFocus={props.onFocus}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
} else if (style == "image") {
|
||||||
|
return (
|
||||||
|
// 祖传样式，勿动
|
||||||
|
<div className="absolute w-full top-[8.5rem] lg:top-56 short:top-24 z-1 left-1/2 translate-x-[-50%] ">
|
||||||
|
<input
|
||||||
|
className={
|
||||||
|
`absolute z-1 w-2/3 sm:w-80 md:w-[400px] focus:w-11/12 focus:sm:w-[700px] hover:w-11/12
|
||||||
|
hover:sm:w-[700px] h-10 rounded-3xl left-1/2 translate-x-[-50%] text-center outline-none
|
||||||
|
border-solid border-0 duration-200 pr-2 shadow-lg` +
|
||||||
|
(settings.bgBlur
|
||||||
|
? `bg-[rgba(255,255,255,0.5)] dark:bg-[rgba(24,24,24,0.75)] backdrop-blur-xl
|
||||||
|
placeholder:text-slate-500 dark:placeholder:text-slate-400 text-slate-900 dark:text-white`
|
||||||
|
: `bg-[rgba(235,235,235,0.9)] dark:bg-[rgba(20,20,20,0.9)] placeholder:text-slate-500
|
||||||
|
text-slate-800 dark:text-white`)
|
||||||
|
}
|
||||||
|
id="searchBox"
|
||||||
|
type="text"
|
||||||
|
placeholder="Search"
|
||||||
|
onFocus={props.onFocus}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
10
components/state/background.ts
Normal file
10
components/state/background.ts
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import { atom, selector } from "recoil";
|
||||||
|
|
||||||
|
const bgFocusState = atom({
|
||||||
|
key: "isBackgroundFocus",
|
||||||
|
default: false
|
||||||
|
});
|
||||||
|
|
||||||
|
export {
|
||||||
|
bgFocusState,
|
||||||
|
}
|
||||||
14
components/state/settings.ts
Normal file
14
components/state/settings.ts
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import { atom, selector } from "recoil";
|
||||||
|
|
||||||
|
const settingsState = atom({
|
||||||
|
key: "settings",
|
||||||
|
default: {
|
||||||
|
version: 1,
|
||||||
|
elementBackdrop: true,
|
||||||
|
bgBlur: true
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
export {
|
||||||
|
settingsState,
|
||||||
|
}
|
||||||
@ -1,46 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { useState, useEffect } from "react";
|
|
||||||
|
|
||||||
export default function Time(props: {
|
|
||||||
showSecond: boolean
|
|
||||||
}) {
|
|
||||||
const [currentTime, setCurrentTime] = useState(new Date());
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const timer = setInterval(() => {
|
|
||||||
setCurrentTime(new Date());
|
|
||||||
}, 150);
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
clearInterval(timer);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const formatTime = () => {
|
|
||||||
const hours = currentTime.getHours().toString().padStart(2, "0");
|
|
||||||
const minutes = currentTime.getMinutes().toString().padStart(2, "0");
|
|
||||||
const seconds = currentTime.getSeconds().toString().padStart(2, "0");
|
|
||||||
|
|
||||||
if (props.showSecond) {
|
|
||||||
return `${hours}:${minutes}:${seconds}`;
|
|
||||||
} else {
|
|
||||||
return `${hours}:${minutes}`;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="absolute top-20 lg:top-44 short:top-0 translate-x-[-50%]
|
|
||||||
left-1/2 w-11/12 sm:w-[700px] text:black
|
|
||||||
dark:text-white text-3xl text-left text-shadow-lg z-10"
|
|
||||||
>
|
|
||||||
{formatTime()}{" "}
|
|
||||||
<span className="text-lg leading-9 relative">
|
|
||||||
{new Intl.DateTimeFormat(navigator.language, {
|
|
||||||
dateStyle: "medium"
|
|
||||||
}).format(currentTime)}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
34
global.d.ts
vendored
34
global.d.ts
vendored
@ -1,31 +1,3 @@
|
|||||||
import { Suggestion } from "search-engine-autocomplete";
|
type settings = {
|
||||||
|
bgBlur: boolean
|
||||||
interface settingsType extends object{
|
};
|
||||||
"version": number,
|
|
||||||
"elementBackdrop": boolean,
|
|
||||||
"bgBlur": boolean,
|
|
||||||
"timeShowSecond": boolean,
|
|
||||||
"currentSearchEngine": string,
|
|
||||||
"searchInNewTab": boolean,
|
|
||||||
"searchEngines": {
|
|
||||||
[key: string]: string
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
interface suggestionsResponse extends object{
|
|
||||||
suggestions: Suggestion[],
|
|
||||||
query: string,
|
|
||||||
verbatimRelevance: number,
|
|
||||||
time: number
|
|
||||||
}
|
|
||||||
|
|
||||||
type suggestionItem = {
|
|
||||||
suggestion: string,
|
|
||||||
type: string,
|
|
||||||
relativeRelevance?: number,
|
|
||||||
relevance: number,
|
|
||||||
prompt?: string | React.ReactElement,
|
|
||||||
intention?: string | null,
|
|
||||||
probability?: number,
|
|
||||||
confidence?: number,
|
|
||||||
}
|
|
||||||
13
index.html
13
index.html
@ -1,13 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<title>Vite + React + TS</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="root"></div>
|
|
||||||
<script type="module" src="/src/main.tsx"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
export default function copyToClipboard(value: string){
|
|
||||||
const textarea = document.createElement("textarea");
|
|
||||||
textarea.value = value;
|
|
||||||
document.body.appendChild(textarea);
|
|
||||||
textarea.select();
|
|
||||||
document.execCommand("copy");
|
|
||||||
document.body.removeChild(textarea);
|
|
||||||
}
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
export function normalizeURL(input: string): string {
|
|
||||||
try {
|
|
||||||
// try to create a URL object
|
|
||||||
const url = new URL(input);
|
|
||||||
// if the URL is valid, return it
|
|
||||||
return url.href;
|
|
||||||
} catch (error) {
|
|
||||||
// if the URL is invalid, try to add the protocol
|
|
||||||
const withHTTP = "http://" + input;
|
|
||||||
try {
|
|
||||||
const urlWithHTTP = new URL(withHTTP);
|
|
||||||
return urlWithHTTP.href;
|
|
||||||
} catch (error) {
|
|
||||||
// if the URL is still invalid, return the original input
|
|
||||||
return input;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,25 +0,0 @@
|
|||||||
import { settingsType, suggestionItem } from "global";
|
|
||||||
import copyToClipboard from "lib/copy";
|
|
||||||
import { normalizeURL } from "lib/normalizeURL";
|
|
||||||
import search from "lib/search";
|
|
||||||
|
|
||||||
export default function (
|
|
||||||
index: number,
|
|
||||||
suggestion: suggestionItem[],
|
|
||||||
query: string,
|
|
||||||
settings: settingsType,
|
|
||||||
searchBoxRef: React.RefObject<HTMLInputElement>
|
|
||||||
) {
|
|
||||||
const selected = suggestion[index];
|
|
||||||
const engine = settings.searchEngines[settings.currentSearchEngine];
|
|
||||||
const newTab = settings.searchInNewTab;
|
|
||||||
if (selected.type === "QUERY" || selected.type === "default") {
|
|
||||||
search(selected.suggestion, engine, newTab);
|
|
||||||
} else if (selected.type === "NAVIGATION" || selected.type === "default-link") {
|
|
||||||
window.open(normalizeURL(selected.suggestion));
|
|
||||||
} else if (selected.type === "text") {
|
|
||||||
console.log("????");
|
|
||||||
copyToClipboard(selected.suggestion);
|
|
||||||
searchBoxRef.current?.focus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
export default function(query: string, engine: string, newTab: boolean = true) {
|
|
||||||
if(newTab) window.open(engine.replace("%s", query));
|
|
||||||
else window.location.href = engine.replace("%s", query);
|
|
||||||
}
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
import { atom } from "jotai";
|
|
||||||
|
|
||||||
const bgFocusAtom = atom(false);
|
|
||||||
|
|
||||||
export { bgFocusAtom };
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
import { atom } from "jotai";
|
|
||||||
|
|
||||||
const queryAtom = atom("");
|
|
||||||
|
|
||||||
export { queryAtom };
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { settingsType } from "global";
|
|
||||||
import { atomWithStorage } from 'jotai/utils'
|
|
||||||
|
|
||||||
const defaultSettings: settingsType = {
|
|
||||||
"version": 2,
|
|
||||||
"elementBackdrop": true,
|
|
||||||
"bgBlur": true,
|
|
||||||
"timeShowSecond": false,
|
|
||||||
"currentSearchEngine": "google",
|
|
||||||
"searchInNewTab": true,
|
|
||||||
"searchEngines": {
|
|
||||||
"google": "https://www.google.com/search?q=%s",
|
|
||||||
"bing": "https://www.bing.com/search?q=%s",
|
|
||||||
"baidu": "https://www.baidu.com/s?wd=%s",
|
|
||||||
"duckduckgo": "https://duckduckgo.com/?q=%s",
|
|
||||||
"yandex": "https://yandex.com/search/?text=%s",
|
|
||||||
"yahoo": "https://search.yahoo.com/search?p=%s",
|
|
||||||
"ecosia": "https://www.ecosia.org/search?q=%s"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const settingsAtom = atomWithStorage('settings', defaultSettings);
|
|
||||||
|
|
||||||
export { settingsAtom };
|
|
||||||
@ -1,6 +0,0 @@
|
|||||||
import { suggestionItem } from "global";
|
|
||||||
import { atom } from "jotai";
|
|
||||||
|
|
||||||
const suggestionAtom = atom([] as suggestionItem[]);
|
|
||||||
|
|
||||||
export { suggestionAtom };
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
import { atom } from "jotai";
|
|
||||||
|
|
||||||
const selectedSuggestionAtom = atom(0);
|
|
||||||
|
|
||||||
export { selectedSuggestionAtom };
|
|
||||||
15
next.config.mjs
Normal file
15
next.config.mjs
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
/** @type {import('next').NextConfig} */
|
||||||
|
const nextConfig = {
|
||||||
|
images: {
|
||||||
|
remotePatterns: [
|
||||||
|
{
|
||||||
|
protocol: "https",
|
||||||
|
hostname: "a2x.pub",
|
||||||
|
port: "",
|
||||||
|
pathname: "/*"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export default nextConfig;
|
||||||
43
package.json
43
package.json
@ -1,40 +1,29 @@
|
|||||||
{
|
{
|
||||||
"name": "sparkhome",
|
"name": "sparkhome",
|
||||||
|
"version": "4.1.0",
|
||||||
"private": false,
|
"private": false,
|
||||||
"version": "5.0.0",
|
|
||||||
"type": "module",
|
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vite",
|
"dev": "next dev",
|
||||||
"build": "tsc -b && vite build",
|
"build": "next build",
|
||||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
"start": "next start",
|
||||||
"preview": "vite preview"
|
"lint": "next lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"jotai": "^2.8.3",
|
"next": "14.1.1",
|
||||||
"react": "^18.3.1",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.3.1",
|
"react-dom": "^18.2.0",
|
||||||
"react-router": "^6.23.1",
|
"recoil": "^0.7.7",
|
||||||
"react-router-dom": "^6.23.1",
|
|
||||||
"search-engine-autocomplete": "^0.4.3",
|
|
||||||
"valid-url": "^1.0.9",
|
"valid-url": "^1.0.9",
|
||||||
"validate-color": "^2.2.4"
|
"validate-color": "^2.2.4"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/react": "^18.3.3",
|
"@types/node": "^20",
|
||||||
"@types/react-dom": "^18.3.0",
|
"@types/react": "^18",
|
||||||
|
"@types/react-dom": "^18",
|
||||||
"@types/valid-url": "^1.0.7",
|
"@types/valid-url": "^1.0.7",
|
||||||
"@typescript-eslint/eslint-plugin": "^7.13.1",
|
"autoprefixer": "^10.0.1",
|
||||||
"@typescript-eslint/parser": "^7.13.1",
|
"postcss": "^8",
|
||||||
"@vitejs/plugin-react-swc": "^3.5.0",
|
"tailwindcss": "^3.3.0",
|
||||||
"autoprefixer": "^10.4.19",
|
"typescript": "^5"
|
||||||
"eslint": "^8.57.0",
|
|
||||||
"eslint-plugin-react-hooks": "^4.6.2",
|
|
||||||
"eslint-plugin-react-refresh": "^0.4.7",
|
|
||||||
"postcss": "^8.4.38",
|
|
||||||
"tailwindcss": "^3.4.4",
|
|
||||||
"typescript": "^5.2.2",
|
|
||||||
"vite": "^5.3.1",
|
|
||||||
"vite-plugin-pages": "^0.32.2",
|
|
||||||
"vite-tsconfig-paths": "^4.3.2"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,19 +0,0 @@
|
|||||||
import Background from "components/background";
|
|
||||||
import Time from "components/time";
|
|
||||||
import { useAtomValue, useSetAtom } from "jotai";
|
|
||||||
import Search from "components/search";
|
|
||||||
import { settingsAtom } from "lib/state/settings";
|
|
||||||
import { bgFocusAtom } from "lib/state/background";
|
|
||||||
|
|
||||||
export default function Homepage() {
|
|
||||||
const settings = useAtomValue(settingsAtom);
|
|
||||||
const setBgFocus = useSetAtom(bgFocusAtom);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<Background />
|
|
||||||
<Search onFocus={() => setBgFocus(true)} />
|
|
||||||
<Time showSecond={settings.timeShowSecond} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
3573
pnpm-lock.yaml
3573
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
@ -1,6 +1,6 @@
|
|||||||
export default {
|
module.exports = {
|
||||||
plugins: {
|
plugins: {
|
||||||
tailwindcss: {},
|
tailwindcss: {},
|
||||||
autoprefixer: {}
|
autoprefixer: {},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
BIN
public/background/1.jpg
Normal file
BIN
public/background/1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.3 MiB |
BIN
public/background/5.jpg
Normal file
BIN
public/background/5.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 MiB |
BIN
public/background/7.jpg
Normal file
BIN
public/background/7.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.3 MiB |
11
src/app.tsx
11
src/app.tsx
@ -1,11 +0,0 @@
|
|||||||
import { Suspense } from "react";
|
|
||||||
import { useRoutes } from "react-router-dom";
|
|
||||||
import routes from "~react-pages";
|
|
||||||
|
|
||||||
export function App() {
|
|
||||||
return (
|
|
||||||
<Suspense fallback={<p>Loading...</p>}>
|
|
||||||
{useRoutes(routes)}
|
|
||||||
</Suspense>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,3 +0,0 @@
|
|||||||
@tailwind base;
|
|
||||||
@tailwind components;
|
|
||||||
@tailwind utilities;
|
|
||||||
15
src/main.tsx
15
src/main.tsx
@ -1,15 +0,0 @@
|
|||||||
import { StrictMode } from "react";
|
|
||||||
import { createRoot } from "react-dom/client";
|
|
||||||
import { BrowserRouter } from "react-router-dom";
|
|
||||||
import { App } from "./app";
|
|
||||||
import "./index.css";
|
|
||||||
|
|
||||||
const app = createRoot(document.getElementById("root")!);
|
|
||||||
|
|
||||||
app.render(
|
|
||||||
<StrictMode>
|
|
||||||
<BrowserRouter>
|
|
||||||
<App />
|
|
||||||
</BrowserRouter>
|
|
||||||
</StrictMode>
|
|
||||||
);
|
|
||||||
2
src/vite-env.d.ts
vendored
2
src/vite-env.d.ts
vendored
@ -1,2 +0,0 @@
|
|||||||
/// <reference types="vite/client" />
|
|
||||||
/// <reference types="vite-plugin-pages/client-react" />
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
import type { Config } from "tailwindcss";
|
|
||||||
|
|
||||||
const config: Config = {
|
|
||||||
content: [
|
|
||||||
"./pages/**/*.{js,ts,jsx,tsx,mdx}",
|
|
||||||
"./components/**/*.{js,ts,jsx,tsx,mdx}",
|
|
||||||
"./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}"
|
|
||||||
],
|
|
||||||
theme: {
|
|
||||||
extend: {
|
|
||||||
backgroundImage: {
|
|
||||||
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
|
|
||||||
"gradient-conic": "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
export default config;
|
|
||||||
20
tailwind.config.ts
Normal file
20
tailwind.config.ts
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
import type { Config } from "tailwindcss";
|
||||||
|
|
||||||
|
const config: Config = {
|
||||||
|
content: [
|
||||||
|
"./pages/**/*.{js,ts,jsx,tsx,mdx}",
|
||||||
|
"./components/**/*.{js,ts,jsx,tsx,mdx}",
|
||||||
|
"./app/**/*.{js,ts,jsx,tsx,mdx}",
|
||||||
|
],
|
||||||
|
theme: {
|
||||||
|
extend: {
|
||||||
|
backgroundImage: {
|
||||||
|
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
|
||||||
|
"gradient-conic":
|
||||||
|
"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
plugins: [],
|
||||||
|
};
|
||||||
|
export default config;
|
||||||
@ -1,28 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
"baseUrl": ".",
|
|
||||||
"composite": true,
|
|
||||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
|
||||||
"target": "ES2020",
|
|
||||||
"useDefineForClassFields": true,
|
|
||||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
|
||||||
"module": "ESNext",
|
|
||||||
"skipLibCheck": true,
|
|
||||||
|
|
||||||
/* Bundler mode */
|
|
||||||
"moduleResolution": "bundler",
|
|
||||||
"allowImportingTsExtensions": true,
|
|
||||||
"resolveJsonModule": true,
|
|
||||||
"isolatedModules": true,
|
|
||||||
"moduleDetection": "force",
|
|
||||||
"noEmit": true,
|
|
||||||
"jsx": "react-jsx",
|
|
||||||
|
|
||||||
/* Linting */
|
|
||||||
"strict": true,
|
|
||||||
"noUnusedLocals": true,
|
|
||||||
"noUnusedParameters": true,
|
|
||||||
"noFallthroughCasesInSwitch": true
|
|
||||||
},
|
|
||||||
"include": ["src", "**/*.ts", "**/*.tsx", "global.d.ts"]
|
|
||||||
}
|
|
||||||
@ -1,11 +1,26 @@
|
|||||||
{
|
{
|
||||||
"files": [],
|
"compilerOptions": {
|
||||||
"references": [
|
"lib": ["dom", "dom.iterable", "esnext"],
|
||||||
|
"allowJs": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"strict": true,
|
||||||
|
"noEmit": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"module": "esnext",
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"jsx": "preserve",
|
||||||
|
"incremental": true,
|
||||||
|
"plugins": [
|
||||||
{
|
{
|
||||||
"path": "./tsconfig.app.json"
|
"name": "next"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"paths": {
|
||||||
|
"@/*": ["./*"]
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "global.d.ts", "app/store/store.js"],
|
||||||
"path": "./tsconfig.node.json"
|
"exclude": ["node_modules"]
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,13 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
"composite": true,
|
|
||||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
|
||||||
"skipLibCheck": true,
|
|
||||||
"module": "ESNext",
|
|
||||||
"moduleResolution": "bundler",
|
|
||||||
"allowSyntheticDefaultImports": true,
|
|
||||||
"strict": true,
|
|
||||||
"noEmit": true
|
|
||||||
},
|
|
||||||
"include": ["vite.config.ts"]
|
|
||||||
}
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
import { defineConfig } from "vite";
|
|
||||||
import react from "@vitejs/plugin-react-swc";
|
|
||||||
import Pages from "vite-plugin-pages";
|
|
||||||
import tsconfigPaths from 'vite-tsconfig-paths';
|
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
plugins: [
|
|
||||||
react(),
|
|
||||||
Pages({
|
|
||||||
dirs: "./pages/"
|
|
||||||
}),
|
|
||||||
tsconfigPaths()
|
|
||||||
]
|
|
||||||
});
|
|
||||||
Loading…
Reference in New Issue
Block a user