mirror of
https://github.com/aljazceru/opencode.git
synced 2026-01-02 23:45:03 +01:00
feat: add desktop/web app package (#2606)
Co-authored-by: adamdotdevin <2363879+adamdottv@users.noreply.github.com> Co-authored-by: Adam <2363879+adamdotdevin@users.noreply.github.com> Co-authored-by: GitHub Action <action@github.com>
This commit is contained in:
49
packages/app/src/ui/button.tsx
Normal file
49
packages/app/src/ui/button.tsx
Normal file
@@ -0,0 +1,49 @@
|
||||
import { Button as KobalteButton } from "@kobalte/core/button"
|
||||
import { splitProps } from "solid-js"
|
||||
import type { ComponentProps } from "solid-js"
|
||||
|
||||
export interface ButtonProps extends ComponentProps<typeof KobalteButton> {
|
||||
variant?: "primary" | "secondary" | "outline" | "ghost"
|
||||
size?: "sm" | "md" | "lg"
|
||||
}
|
||||
|
||||
export const buttonStyles = {
|
||||
base: "inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer",
|
||||
variants: {
|
||||
primary: "bg-primary text-background hover:bg-secondary focus-visible:ring-primary data-[disabled]:opacity-50",
|
||||
secondary:
|
||||
"bg-background-panel text-text hover:bg-background-element focus-visible:ring-secondary data-[disabled]:opacity-50",
|
||||
outline:
|
||||
"border border-border bg-transparent text-text hover:bg-background-panel focus-visible:ring-border-active data-[disabled]:border-border-subtle data-[disabled]:text-text-muted",
|
||||
ghost: "text-text hover:bg-background-panel focus-visible:ring-border-active data-[disabled]:text-text-muted",
|
||||
},
|
||||
sizes: {
|
||||
sm: "h-8 px-3 text-sm",
|
||||
md: "h-10 px-4 text-sm",
|
||||
lg: "h-12 px-6 text-base",
|
||||
},
|
||||
}
|
||||
|
||||
export function getButtonClasses(
|
||||
variant: keyof typeof buttonStyles.variants = "primary",
|
||||
size: keyof typeof buttonStyles.sizes = "md",
|
||||
className?: string,
|
||||
) {
|
||||
return `${buttonStyles.base} ${buttonStyles.variants[variant]} ${buttonStyles.sizes[size]}${className ? ` ${className}` : ""}`
|
||||
}
|
||||
|
||||
export function Button(props: ButtonProps) {
|
||||
const [local, others] = splitProps(props, ["variant", "size", "class", "classList"])
|
||||
return (
|
||||
<KobalteButton
|
||||
classList={{
|
||||
...(local.classList ?? {}),
|
||||
[buttonStyles.base]: true,
|
||||
[buttonStyles.variants[local.variant || "primary"]]: true,
|
||||
[buttonStyles.sizes[local.size || "md"]]: true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
/>
|
||||
)
|
||||
}
|
||||
62
packages/app/src/ui/collapsible.tsx
Normal file
62
packages/app/src/ui/collapsible.tsx
Normal file
@@ -0,0 +1,62 @@
|
||||
import { Collapsible as KobalteCollapsible } from "@kobalte/core/collapsible"
|
||||
import { splitProps } from "solid-js"
|
||||
import type { ComponentProps, ParentProps } from "solid-js"
|
||||
import { Icon, type IconProps } from "./icon"
|
||||
|
||||
export interface CollapsibleProps extends ComponentProps<typeof KobalteCollapsible> {}
|
||||
export interface CollapsibleTriggerProps extends ComponentProps<typeof KobalteCollapsible.Trigger> {}
|
||||
export interface CollapsibleContentProps extends ComponentProps<typeof KobalteCollapsible.Content> {}
|
||||
|
||||
function CollapsibleRoot(props: CollapsibleProps) {
|
||||
return <KobalteCollapsible forceMount {...props} />
|
||||
}
|
||||
|
||||
function CollapsibleTrigger(props: CollapsibleTriggerProps) {
|
||||
const [local, others] = splitProps(props, ["class"])
|
||||
return (
|
||||
<KobalteCollapsible.Trigger
|
||||
classList={{
|
||||
"w-full group/collapsible cursor-pointer": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CollapsibleContent(props: ParentProps<CollapsibleContentProps>) {
|
||||
const [local, others] = splitProps(props, ["class", "children"])
|
||||
return (
|
||||
<KobalteCollapsible.Content
|
||||
classList={{
|
||||
"h-0 overflow-hidden transition-all duration-100 ease-out": true,
|
||||
"data-expanded:h-fit": true,
|
||||
[local.class]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
>
|
||||
{local.children}
|
||||
</KobalteCollapsible.Content>
|
||||
)
|
||||
}
|
||||
|
||||
function CollapsibleArrow(props: Partial<IconProps>) {
|
||||
const [local, others] = splitProps(props, ["class", "name"])
|
||||
return (
|
||||
<Icon
|
||||
name={local.name ?? "chevron-right"}
|
||||
classList={{
|
||||
"flex-none text-text-muted transition-transform duration-100": true,
|
||||
"group-data-[expanded]/collapsible:rotate-90": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export const Collapsible = Object.assign(CollapsibleRoot, {
|
||||
Trigger: CollapsibleTrigger,
|
||||
Content: CollapsibleContent,
|
||||
Arrow: CollapsibleArrow,
|
||||
})
|
||||
582
packages/app/src/ui/file-icon.tsx
Normal file
582
packages/app/src/ui/file-icon.tsx
Normal file
@@ -0,0 +1,582 @@
|
||||
import type { Component, JSX } from "solid-js"
|
||||
import { createMemo, splitProps } from "solid-js"
|
||||
import sprite from "@/ui/file-icons/sprite.svg"
|
||||
import type { IconName } from "@/ui/file-icons/types"
|
||||
|
||||
export type FileIconProps = JSX.GSVGAttributes<SVGSVGElement> & {
|
||||
node: { path: string; type: "file" | "directory" }
|
||||
expanded?: boolean
|
||||
}
|
||||
|
||||
export const FileIcon: Component<FileIconProps> = (props) => {
|
||||
const [local, rest] = splitProps(props, ["node", "class", "expanded"])
|
||||
const name = createMemo(() => chooseIconName(local.node.path, local.node.type, local.expanded || false))
|
||||
return (
|
||||
<svg
|
||||
{...rest}
|
||||
classList={{
|
||||
"shrink-0 size-4": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
>
|
||||
<use href={`${sprite}#${name()}`} />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
type IconMaps = {
|
||||
fileNames: Record<string, IconName>
|
||||
fileExtensions: Record<string, IconName>
|
||||
folderNames: Record<string, IconName>
|
||||
defaults: {
|
||||
file: IconName
|
||||
folder: IconName
|
||||
folderOpen: IconName
|
||||
}
|
||||
}
|
||||
|
||||
const ICON_MAPS: IconMaps = {
|
||||
fileNames: {
|
||||
// Documentation files
|
||||
"readme.md": "Readme",
|
||||
"changelog.md": "Changelog",
|
||||
"contributing.md": "Contributing",
|
||||
"conduct.md": "Conduct",
|
||||
license: "Certificate",
|
||||
authors: "Authors",
|
||||
credits: "Credits",
|
||||
install: "Installation",
|
||||
|
||||
// Node.js files
|
||||
"package.json": "Nodejs",
|
||||
"package-lock.json": "Nodejs",
|
||||
"yarn.lock": "Yarn",
|
||||
"pnpm-lock.yaml": "Pnpm",
|
||||
"bun.lock": "Bun",
|
||||
"bun.lockb": "Bun",
|
||||
"bunfig.toml": "Bun",
|
||||
".nvmrc": "Nodejs",
|
||||
".node-version": "Nodejs",
|
||||
|
||||
// Docker files
|
||||
dockerfile: "Docker",
|
||||
"docker-compose.yml": "Docker",
|
||||
"docker-compose.yaml": "Docker",
|
||||
".dockerignore": "Docker",
|
||||
|
||||
// Config files
|
||||
"jest.config.js": "Jest",
|
||||
"jest.config.ts": "Jest",
|
||||
"jest.config.mjs": "Jest",
|
||||
"vitest.config.js": "Vitest",
|
||||
"vitest.config.ts": "Vitest",
|
||||
"tailwind.config.js": "Tailwindcss",
|
||||
"tailwind.config.ts": "Tailwindcss",
|
||||
"turbo.json": "Turborepo",
|
||||
"tsconfig.json": "Tsconfig",
|
||||
"jsconfig.json": "Jsconfig",
|
||||
".eslintrc": "Eslint",
|
||||
".eslintrc.js": "Eslint",
|
||||
".eslintrc.json": "Eslint",
|
||||
".prettierrc": "Prettier",
|
||||
".prettierrc.js": "Prettier",
|
||||
".prettierrc.json": "Prettier",
|
||||
"vite.config.js": "Vite",
|
||||
"vite.config.ts": "Vite",
|
||||
"webpack.config.js": "Webpack",
|
||||
"rollup.config.js": "Rollup",
|
||||
"astro.config.mjs": "AstroConfig",
|
||||
"astro.config.js": "AstroConfig",
|
||||
"next.config.js": "Next",
|
||||
"next.config.mjs": "Next",
|
||||
"nuxt.config.js": "Nuxt",
|
||||
"nuxt.config.ts": "Nuxt",
|
||||
"svelte.config.js": "Svelte",
|
||||
"gatsby-config.js": "Gatsby",
|
||||
"remix.config.js": "Remix",
|
||||
"prisma.schema": "Prisma",
|
||||
".gitignore": "Git",
|
||||
".gitattributes": "Git",
|
||||
makefile: "Makefile",
|
||||
cmake: "Cmake",
|
||||
"cargo.toml": "Rust",
|
||||
"go.mod": "GoMod",
|
||||
"go.sum": "GoMod",
|
||||
"requirements.txt": "Python",
|
||||
"pyproject.toml": "Python",
|
||||
pipfile: "Python",
|
||||
"poetry.lock": "Poetry",
|
||||
gemfile: "Gemfile",
|
||||
rakefile: "Ruby",
|
||||
"composer.json": "Php",
|
||||
"build.gradle": "Gradle",
|
||||
"pom.xml": "Maven",
|
||||
"deno.json": "Deno",
|
||||
"deno.jsonc": "Deno",
|
||||
"vercel.json": "Vercel",
|
||||
"netlify.toml": "Netlify",
|
||||
".env": "Tune",
|
||||
".env.local": "Tune",
|
||||
".env.development": "Tune",
|
||||
".env.production": "Tune",
|
||||
".env.example": "Tune",
|
||||
".editorconfig": "Editorconfig",
|
||||
"robots.txt": "Robots",
|
||||
"favicon.ico": "Favicon",
|
||||
browserlist: "Browserlist",
|
||||
".babelrc": "Babel",
|
||||
"babel.config.js": "Babel",
|
||||
"gulpfile.js": "Gulp",
|
||||
"gruntfile.js": "Grunt",
|
||||
"capacitor.config.json": "Capacitor",
|
||||
"ionic.config.json": "Ionic",
|
||||
"angular.json": "Angular",
|
||||
".storybook": "Storybook",
|
||||
"storybook.config.js": "Storybook",
|
||||
"cypress.config.js": "Cypress",
|
||||
"playwright.config.js": "Playwright",
|
||||
"puppeteer.config.js": "Puppeteer",
|
||||
"wrangler.toml": "Wrangler",
|
||||
"firebase.json": "Firebase",
|
||||
supabase: "Supabase",
|
||||
terraform: "Terraform",
|
||||
kubernetes: "Kubernetes",
|
||||
".gitpod.yml": "Gitpod",
|
||||
".devcontainer": "Vscode",
|
||||
"travis.yml": "Travis",
|
||||
"appveyor.yml": "Appveyor",
|
||||
".circleci": "Circleci",
|
||||
"renovate.json": "Renovate",
|
||||
"dependabot.yml": "Dependabot",
|
||||
"lerna.json": "Lerna",
|
||||
"nx.json": "Nx",
|
||||
},
|
||||
fileExtensions: {
|
||||
// Test files
|
||||
"spec.ts": "TestTs",
|
||||
"test.ts": "TestTs",
|
||||
"spec.tsx": "TestJsx",
|
||||
"test.tsx": "TestJsx",
|
||||
"spec.js": "TestJs",
|
||||
"test.js": "TestJs",
|
||||
"spec.jsx": "TestJsx",
|
||||
"test.jsx": "TestJsx",
|
||||
|
||||
// JavaScript/TypeScript
|
||||
"js.map": "JavascriptMap",
|
||||
"d.ts": "TypescriptDef",
|
||||
ts: "Typescript",
|
||||
tsx: "React_ts",
|
||||
js: "Javascript",
|
||||
jsx: "React",
|
||||
mjs: "Javascript",
|
||||
cjs: "Javascript",
|
||||
|
||||
// Web languages
|
||||
html: "Html",
|
||||
htm: "Html",
|
||||
css: "Css",
|
||||
scss: "Sass",
|
||||
sass: "Sass",
|
||||
less: "Less",
|
||||
styl: "Stylus",
|
||||
|
||||
// Data formats
|
||||
json: "Json",
|
||||
xml: "Xml",
|
||||
yml: "Yaml",
|
||||
yaml: "Yaml",
|
||||
toml: "Toml",
|
||||
hjson: "Hjson",
|
||||
|
||||
// Documentation
|
||||
md: "Markdown",
|
||||
mdx: "Mdx",
|
||||
tex: "Tex",
|
||||
|
||||
// Programming languages
|
||||
py: "Python",
|
||||
pyx: "Python",
|
||||
pyw: "Python",
|
||||
rs: "Rust",
|
||||
go: "Go",
|
||||
java: "Java",
|
||||
kt: "Kotlin",
|
||||
scala: "Scala",
|
||||
php: "Php",
|
||||
rb: "Ruby",
|
||||
cs: "Csharp",
|
||||
vb: "Visualstudio",
|
||||
cpp: "Cpp",
|
||||
cc: "Cpp",
|
||||
cxx: "Cpp",
|
||||
c: "C",
|
||||
h: "H",
|
||||
hpp: "Hpp",
|
||||
swift: "Swift",
|
||||
m: "ObjectiveC",
|
||||
mm: "ObjectiveCpp",
|
||||
dart: "Dart",
|
||||
lua: "Lua",
|
||||
pl: "Perl",
|
||||
r: "R",
|
||||
jl: "Julia",
|
||||
hs: "Haskell",
|
||||
elm: "Elm",
|
||||
ml: "Ocaml",
|
||||
clj: "Clojure",
|
||||
cljs: "Clojure",
|
||||
erl: "Erlang",
|
||||
ex: "Elixir",
|
||||
exs: "Elixir",
|
||||
nim: "Nim",
|
||||
zig: "Zig",
|
||||
v: "Vlang",
|
||||
odin: "Odin",
|
||||
gleam: "Gleam",
|
||||
grain: "Grain",
|
||||
roc: "Rocket",
|
||||
fs: "Fsharp",
|
||||
|
||||
// Shell scripts
|
||||
sh: "Console",
|
||||
bash: "Console",
|
||||
zsh: "Console",
|
||||
fish: "Console",
|
||||
ps1: "Powershell",
|
||||
|
||||
// Config/build files
|
||||
cfg: "Settings",
|
||||
ini: "Settings",
|
||||
conf: "Settings",
|
||||
properties: "Settings",
|
||||
|
||||
// Media files
|
||||
svg: "Svg",
|
||||
png: "Image",
|
||||
jpg: "Image",
|
||||
jpeg: "Image",
|
||||
gif: "Image",
|
||||
webp: "Image",
|
||||
bmp: "Image",
|
||||
ico: "Favicon",
|
||||
mp4: "Video",
|
||||
mov: "Video",
|
||||
avi: "Video",
|
||||
webm: "Video",
|
||||
mp3: "Audio",
|
||||
wav: "Audio",
|
||||
flac: "Audio",
|
||||
|
||||
// Archive files
|
||||
zip: "Zip",
|
||||
tar: "Zip",
|
||||
gz: "Zip",
|
||||
rar: "Zip",
|
||||
"7z": "Zip",
|
||||
|
||||
// Document files
|
||||
pdf: "Pdf",
|
||||
doc: "Word",
|
||||
docx: "Word",
|
||||
ppt: "Powerpoint",
|
||||
pptx: "Powerpoint",
|
||||
xls: "Document",
|
||||
xlsx: "Document",
|
||||
|
||||
// Database files
|
||||
sql: "Database",
|
||||
db: "Database",
|
||||
sqlite: "Database",
|
||||
|
||||
// Other
|
||||
env: "Tune",
|
||||
log: "Log",
|
||||
lock: "Lock",
|
||||
key: "Key",
|
||||
pem: "Certificate",
|
||||
crt: "Certificate",
|
||||
proto: "Proto",
|
||||
graphql: "Graphql",
|
||||
gql: "Graphql",
|
||||
wasm: "Webassembly",
|
||||
dockerfile: "Docker",
|
||||
},
|
||||
folderNames: {
|
||||
// Source code
|
||||
src: "FolderSrc",
|
||||
source: "FolderSrc",
|
||||
lib: "FolderLib",
|
||||
libs: "FolderLib",
|
||||
|
||||
// Testing
|
||||
test: "FolderTest",
|
||||
tests: "FolderTest",
|
||||
testing: "FolderTest",
|
||||
spec: "FolderTest",
|
||||
specs: "FolderTest",
|
||||
__tests__: "FolderTest",
|
||||
e2e: "FolderTest",
|
||||
integration: "FolderTest",
|
||||
unit: "FolderTest",
|
||||
cypress: "FolderCypress",
|
||||
|
||||
// Dependencies
|
||||
node_modules: "FolderNode",
|
||||
vendor: "FolderPackages",
|
||||
packages: "FolderPackages",
|
||||
deps: "FolderPackages",
|
||||
|
||||
// Build/dist
|
||||
build: "FolderBuildkite",
|
||||
dist: "FolderDist",
|
||||
out: "FolderDist",
|
||||
output: "FolderDist",
|
||||
target: "FolderTarget",
|
||||
|
||||
// Configuration
|
||||
config: "FolderConfig",
|
||||
configs: "FolderConfig",
|
||||
configuration: "FolderConfig",
|
||||
settings: "FolderConfig",
|
||||
env: "FolderEnvironment",
|
||||
environments: "FolderEnvironment",
|
||||
|
||||
// Docker
|
||||
docker: "FolderDocker",
|
||||
dockerfiles: "FolderDocker",
|
||||
containers: "FolderDocker",
|
||||
|
||||
// Documentation
|
||||
docs: "FolderDocs",
|
||||
doc: "FolderDocs",
|
||||
documentation: "FolderDocs",
|
||||
readme: "FolderDocs",
|
||||
|
||||
// Public/assets
|
||||
public: "FolderPublic",
|
||||
static: "FolderPublic",
|
||||
assets: "FolderImages",
|
||||
images: "FolderImages",
|
||||
img: "FolderImages",
|
||||
icons: "FolderImages",
|
||||
media: "FolderImages",
|
||||
fonts: "FolderFont",
|
||||
styles: "FolderCss",
|
||||
stylesheets: "FolderCss",
|
||||
css: "FolderCss",
|
||||
sass: "FolderSass",
|
||||
scss: "FolderSass",
|
||||
less: "FolderLess",
|
||||
|
||||
// Scripts
|
||||
scripts: "FolderScripts",
|
||||
script: "FolderScripts",
|
||||
tools: "FolderTools",
|
||||
utils: "FolderUtils",
|
||||
utilities: "FolderUtils",
|
||||
helpers: "FolderHelper",
|
||||
|
||||
// Framework specific
|
||||
components: "FolderComponents",
|
||||
component: "FolderComponents",
|
||||
views: "FolderViews",
|
||||
view: "FolderViews",
|
||||
layouts: "FolderLayout",
|
||||
layout: "FolderLayout",
|
||||
templates: "FolderTemplate",
|
||||
template: "FolderTemplate",
|
||||
hooks: "FolderHook",
|
||||
hook: "FolderHook",
|
||||
store: "FolderStore",
|
||||
stores: "FolderStore",
|
||||
state: "FolderNgrxStore",
|
||||
reducers: "FolderReduxReducer",
|
||||
reducer: "FolderReduxReducer",
|
||||
services: "FolderApi",
|
||||
service: "FolderApi",
|
||||
api: "FolderApi",
|
||||
apis: "FolderApi",
|
||||
routes: "FolderRoutes",
|
||||
route: "FolderRoutes",
|
||||
routing: "FolderRoutes",
|
||||
middleware: "FolderMiddleware",
|
||||
middlewares: "FolderMiddleware",
|
||||
controllers: "FolderController",
|
||||
controller: "FolderController",
|
||||
models: "FolderDatabase",
|
||||
model: "FolderDatabase",
|
||||
schemas: "FolderDatabase",
|
||||
schema: "FolderDatabase",
|
||||
migrations: "FolderDatabase",
|
||||
migration: "FolderDatabase",
|
||||
seeders: "FolderSeeders",
|
||||
seeder: "FolderSeeders",
|
||||
|
||||
// TypeScript
|
||||
types: "FolderTypescript",
|
||||
typing: "FolderTypescript",
|
||||
typings: "FolderTypescript",
|
||||
"@types": "FolderTypescript",
|
||||
interfaces: "FolderInterface",
|
||||
interface: "FolderInterface",
|
||||
|
||||
// Mobile
|
||||
android: "FolderAndroid",
|
||||
ios: "FolderIos",
|
||||
mobile: "FolderMobile",
|
||||
flutter: "FolderFlutter",
|
||||
|
||||
// Infrastructure
|
||||
kubernetes: "FolderKubernetes",
|
||||
k8s: "FolderKubernetes",
|
||||
terraform: "FolderTerraform",
|
||||
aws: "FolderAws",
|
||||
azure: "FolderAzurePipelines",
|
||||
firebase: "FolderFirebase",
|
||||
supabase: "FolderSupabase",
|
||||
vercel: "FolderVercel",
|
||||
netlify: "FolderNetlify",
|
||||
|
||||
// CI/CD
|
||||
".github": "FolderGithub",
|
||||
".gitlab": "FolderGitlab",
|
||||
".circleci": "FolderCircleci",
|
||||
ci: "FolderCi",
|
||||
".ci": "FolderCi",
|
||||
workflows: "FolderGhWorkflows",
|
||||
|
||||
// Git
|
||||
".git": "FolderGit",
|
||||
|
||||
// Development tools
|
||||
".vscode": "FolderVscode",
|
||||
".idea": "FolderIntellij",
|
||||
".cursor": "FolderCursor",
|
||||
".devcontainer": "FolderContainer",
|
||||
".storybook": "FolderStorybook",
|
||||
|
||||
// Localization
|
||||
i18n: "FolderI18n",
|
||||
locales: "FolderI18n",
|
||||
locale: "FolderI18n",
|
||||
lang: "FolderI18n",
|
||||
languages: "FolderI18n",
|
||||
|
||||
// Other common patterns
|
||||
temp: "FolderTemp",
|
||||
tmp: "FolderTemp",
|
||||
logs: "FolderLog",
|
||||
log: "FolderLog",
|
||||
backup: "FolderBackup",
|
||||
backups: "FolderBackup",
|
||||
examples: "FolderExamples",
|
||||
example: "FolderExamples",
|
||||
demo: "FolderExamples",
|
||||
demos: "FolderExamples",
|
||||
samples: "FolderExamples",
|
||||
sample: "FolderExamples",
|
||||
fixtures: "FolderTest",
|
||||
mocks: "FolderMock",
|
||||
mock: "FolderMock",
|
||||
data: "FolderDatabase",
|
||||
database: "FolderDatabase",
|
||||
db: "FolderDatabase",
|
||||
sql: "FolderDatabase",
|
||||
prisma: "FolderPrisma",
|
||||
drizzle: "FolderDrizzle",
|
||||
|
||||
// Security
|
||||
security: "FolderSecure",
|
||||
auth: "FolderSecure",
|
||||
authentication: "FolderSecure",
|
||||
authorization: "FolderSecure",
|
||||
keys: "FolderKeys",
|
||||
certs: "FolderKeys",
|
||||
certificates: "FolderKeys",
|
||||
|
||||
// Content
|
||||
content: "FolderContent",
|
||||
posts: "FolderContent",
|
||||
articles: "FolderContent",
|
||||
blog: "FolderContent",
|
||||
|
||||
// Functions
|
||||
functions: "FolderFunctions",
|
||||
function: "FolderFunctions",
|
||||
lambda: "FolderFunctions",
|
||||
lambdas: "FolderFunctions",
|
||||
serverless: "FolderServerless",
|
||||
|
||||
// Jobs/tasks
|
||||
jobs: "FolderJob",
|
||||
job: "FolderJob",
|
||||
tasks: "FolderTasks",
|
||||
task: "FolderTasks",
|
||||
cron: "FolderTasks",
|
||||
queue: "FolderQueue",
|
||||
queues: "FolderQueue",
|
||||
|
||||
// Desktop platforms
|
||||
desktop: "FolderDesktop",
|
||||
windows: "FolderWindows",
|
||||
macos: "FolderMacos",
|
||||
linux: "FolderLinux",
|
||||
},
|
||||
defaults: {
|
||||
file: "Document",
|
||||
folder: "Folder",
|
||||
folderOpen: "FolderOpen",
|
||||
},
|
||||
}
|
||||
|
||||
const toOpenVariant = (icon: IconName): IconName => {
|
||||
if (!icon.startsWith("Folder")) return icon
|
||||
if (icon.endsWith("_light")) return icon.replace("_light", "Open_light") as IconName
|
||||
if (!icon.endsWith("Open")) return (icon + "Open") as IconName
|
||||
return icon
|
||||
}
|
||||
|
||||
const basenameOf = (p: string) =>
|
||||
p
|
||||
.replace(/[/\\]+$/, "")
|
||||
.split(/[\\/]/)
|
||||
.pop() ?? ""
|
||||
|
||||
const folderNameVariants = (name: string) => {
|
||||
const n = name.toLowerCase()
|
||||
return [n, `.${n}`, `_${n}`, `__${n}__`]
|
||||
}
|
||||
|
||||
const dottedSuffixesDesc = (name: string) => {
|
||||
const n = name.toLowerCase()
|
||||
const idxs: number[] = []
|
||||
for (let i = 0; i < n.length; i++) if (n[i] === ".") idxs.push(i)
|
||||
const out = new Set<string>()
|
||||
out.add(n) // allow exact whole-name "extensions" like "dockerfile"
|
||||
for (const i of idxs) if (i + 1 < n.length) out.add(n.slice(i + 1))
|
||||
return Array.from(out).sort((a, b) => b.length - a.length) // longest first
|
||||
}
|
||||
|
||||
export function chooseIconName(path: string, type: "directory" | "file", expanded: boolean): IconName {
|
||||
const base = basenameOf(path)
|
||||
const baseLower = base.toLowerCase()
|
||||
|
||||
if (type === "directory") {
|
||||
for (const cand of folderNameVariants(baseLower)) {
|
||||
const icon = ICON_MAPS.folderNames[cand]
|
||||
if (icon) return expanded ? toOpenVariant(icon) : icon
|
||||
}
|
||||
return expanded ? ICON_MAPS.defaults.folderOpen : ICON_MAPS.defaults.folder
|
||||
}
|
||||
|
||||
const byName = ICON_MAPS.fileNames[baseLower]
|
||||
if (byName) return byName
|
||||
|
||||
for (const ext of dottedSuffixesDesc(baseLower)) {
|
||||
const icon = ICON_MAPS.fileExtensions[ext]
|
||||
if (icon) return icon
|
||||
}
|
||||
|
||||
return ICON_MAPS.defaults.file
|
||||
}
|
||||
11707
packages/app/src/ui/file-icons/sprite.svg
Normal file
11707
packages/app/src/ui/file-icons/sprite.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 922 KiB |
1095
packages/app/src/ui/file-icons/types.ts
Normal file
1095
packages/app/src/ui/file-icons/types.ts
Normal file
File diff suppressed because it is too large
Load Diff
38
packages/app/src/ui/icon-button.tsx
Normal file
38
packages/app/src/ui/icon-button.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
import { Button as KobalteButton } from "@kobalte/core/button"
|
||||
import { splitProps } from "solid-js"
|
||||
import type { ComponentProps, JSX } from "solid-js"
|
||||
|
||||
export interface IconButtonProps extends ComponentProps<typeof KobalteButton> {
|
||||
variant?: "primary" | "secondary" | "outline" | "ghost"
|
||||
size?: "xs" | "sm" | "md" | "lg"
|
||||
children: JSX.Element
|
||||
}
|
||||
|
||||
export function IconButton(props: IconButtonProps) {
|
||||
const [local, others] = splitProps(props, ["variant", "size", "class", "classList"])
|
||||
return (
|
||||
<KobalteButton
|
||||
classList={{
|
||||
...(local.classList || {}),
|
||||
"inline-flex items-center justify-center rounded-md font-medium cursor-pointer": true,
|
||||
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2": true,
|
||||
"disabled:pointer-events-none disabled:opacity-50": true,
|
||||
"bg-primary text-background hover:bg-secondary focus-visible:ring-primary data-[disabled]:opacity-50":
|
||||
(local.variant || "primary") === "primary",
|
||||
"bg-background-panel text-text hover:bg-background-element focus-visible:ring-secondary data-[disabled]:opacity-50":
|
||||
local.variant === "secondary",
|
||||
"border border-border bg-transparent text-text hover:bg-background-panel": local.variant === "outline",
|
||||
"focus-visible:ring-border-active data-[disabled]:border-border-subtle data-[disabled]:text-text-muted":
|
||||
local.variant === "outline",
|
||||
"text-text hover:bg-background-panel focus-visible:ring-border-active data-[disabled]:text-text-muted":
|
||||
local.variant === "ghost",
|
||||
"h-5 w-5 text-xs": local.size === "xs",
|
||||
"h-8 w-8 text-sm": local.size === "sm",
|
||||
"h-10 w-10 text-sm": (local.size || "md") === "md",
|
||||
"h-12 w-12 text-base": local.size === "lg",
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
/>
|
||||
)
|
||||
}
|
||||
149
packages/app/src/ui/icon.tsx
Normal file
149
packages/app/src/ui/icon.tsx
Normal file
@@ -0,0 +1,149 @@
|
||||
import { splitProps, type ComponentProps } from "solid-js"
|
||||
|
||||
export interface IconProps extends ComponentProps<"svg"> {
|
||||
name: keyof typeof icons
|
||||
size?: number
|
||||
}
|
||||
|
||||
// prettier-ignore
|
||||
const icons = {
|
||||
close: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 6.75L6.75 17.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6.75 6.75L17.25 17.25"></path>',
|
||||
menu: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 5.75H19.25"></path> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 18.25H19.25"></path> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 12H19.25"></path>',
|
||||
"chevron-right": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10.75 8.75L14.25 12L10.75 15.25"></path>',
|
||||
"chevron-left": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10.75 8.75L14.25 12L10.75 15.25"></path>',
|
||||
"chevron-down": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 10.75L12 14.25L8.75 10.75"></path>',
|
||||
"chevron-up": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 14.25L12 10.75L8.75 14.25"></path>',
|
||||
"chevron-down-square": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m8.75 10.75 3.25 3.5 3.25-3.5m2-6H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h10.5a2 2 0 0 0 2-2V6.75a2 2 0 0 0-2-2Z"></path>',
|
||||
"chevron-up-square": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m8.75 14.25 3.25-3.5 3.25 3.5m2-9.5H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h10.5a2 2 0 0 0 2-2V6.75a2 2 0 0 0-2-2Z"></path>',
|
||||
"chevron-right-square": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m10.75 15.25 3.5-3.25-3.5-3.25m6.5-4H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h10.5a2 2 0 0 0 2-2V6.75a2 2 0 0 0-2-2Z"></path>',
|
||||
"chevron-left-square": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M13.25 15.25 9.75 12l3.5-3.25m4-4H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h10.5a2 2 0 0 0 2-2V6.75a2 2 0 0 0-2-2Z"></path>',
|
||||
settings: '<path d="M5.62117 14.9627L6.72197 15.1351C7.53458 15.2623 8.11491 16.0066 8.05506 16.8451L7.97396 17.9816C7.95034 18.3127 8.12672 18.6244 8.41885 18.7686L9.23303 19.1697C9.52516 19.3139 9.87399 19.2599 10.1126 19.0352L10.9307 18.262C11.5339 17.6917 12.4646 17.6917 13.0685 18.262L13.8866 19.0352C14.1252 19.2608 14.4733 19.3139 14.7662 19.1697L15.5819 18.7678C15.8733 18.6244 16.0489 18.3135 16.0253 17.9833L15.9441 16.8451C15.8843 16.0066 16.4646 15.2623 17.2772 15.1351L18.378 14.9627C18.6985 14.9128 18.9568 14.6671 19.0292 14.3433L19.23 13.4428C19.3025 13.119 19.1741 12.7831 18.9064 12.5962L17.9875 11.9526C17.3095 11.4774 17.1024 10.5495 17.5119 9.82051L18.067 8.83299C18.2284 8.54543 18.2017 8.18538 17.9993 7.92602L17.4363 7.2035C17.2339 6.94413 16.8969 6.83701 16.5867 6.93447L15.5221 7.26794C14.7355 7.51441 13.8969 7.1012 13.5945 6.31908L13.1866 5.26148C13.0669 4.95218 12.7748 4.7492 12.4496 4.75L11.5472 4.75242C11.222 4.75322 10.9307 4.95782 10.8126 5.26793L10.4149 6.31344C10.1157 7.1004 9.27319 7.51683 8.4842 7.26874L7.37553 6.92078C7.0645 6.82251 6.72591 6.93044 6.52355 7.19142L5.96448 7.91474C5.76212 8.17652 5.73771 8.53738 5.90228 8.82493L6.47 9.81487C6.88812 10.5446 6.68339 11.4814 6.00149 11.9591L5.0936 12.5954C4.82588 12.7831 4.69754 13.119 4.76998 13.442L4.97077 14.3425C5.04242 14.6671 5.30069 14.9128 5.62117 14.9627Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M13.5911 10.4089C14.4696 11.2875 14.4696 12.7125 13.5911 13.5911C12.7125 14.4696 11.2875 14.4696 10.4089 13.5911C9.53036 12.7125 9.53036 11.2875 10.4089 10.4089C11.2875 9.53036 12.7125 9.53036 13.5911 10.4089Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
globe: '<circle cx="12" cy="12" r="7.25" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></circle><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 12C15.25 16.5 13.2426 19.25 12 19.25C10.7574 19.25 8.75 16.5 8.75 12C8.75 7.5 10.7574 4.75 12 4.75C13.2426 4.75 15.25 7.5 15.25 12Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5 12H12H19"></path>',
|
||||
github: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10 18.25c-3.5 1-3.5-1.75-5-2m10 4v-2.7a2.36 2.36 0 0 0-.66-1.83c2.2-.25 4.51-1.08 4.51-4.9a3.81 3.81 0 0 0-1.05-2.62 3.55 3.55 0 0 0-.07-2.63s-.84-.25-2.73.99a9.37 9.37 0 0 0-4.9 0c-1.89-1.24-2.73-.99-2.73-.99a3.55 3.55 0 0 0-.07 2.63 3.81 3.81 0 0 0-1.05 2.65c0 3.79 2.31 4.62 4.51 4.87a2.36 2.36 0 0 0-.66 1.86v3.97"></path>',
|
||||
hammer: '<path d="M10.75 13.25V10.25H8.25V11.25C8.25 11.8023 7.80228 12.25 7.25 12.25H5.75C5.19772 12.25 4.75 11.8023 4.75 11.25V5.75C4.75 5.19772 5.19772 4.75 5.75 4.75H7.25C7.80228 4.75 8.25 5.19772 8.25 5.75V6.75H15C15 6.75 19.25 6.75 19.25 11.25C19.25 11.25 17 10.25 14.25 10.25V13.25M10.75 13.25H14.25M10.75 13.25V19.25M14.25 13.25V19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"avatar-square": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6.75 19S8 15.75 12 15.75 17.25 19 17.25 19m-3-9a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-6.5 9.25h8.5a3 3 0 0 0 3-3v-8.5a3 3 0 0 0-3-3h-8.5a3 3 0 0 0-3 3v8.5a3 3 0 0 0 3 3Z"></path>',
|
||||
slash: '<path d="M11.5 18C11.5 18.2761 11.2761 18.5 11 18.5C10.7239 18.5 10.5 18.2761 10.5 18C10.5 17.7239 10.7239 17.5 11 17.5C11.2761 17.5 11.5 17.7239 11.5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.5 18C15.5 18.2761 15.2761 18.5 15 18.5C14.7239 18.5 14.5 18.2761 14.5 18C14.5 17.7239 14.7239 17.5 15 17.5C15.2761 17.5 15.5 17.7239 15.5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.5 18C19.5 18.2761 19.2761 18.5 19 18.5C18.7239 18.5 18.5 18.2761 18.5 18C18.5 17.7239 18.7239 17.5 19 17.5C19.2761 17.5 19.5 17.7239 19.5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.75 18.25L9.25 5.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
robot: '<path d="M4.75 11.75C4.75 9.54086 6.54086 7.75 8.75 7.75H15.25C17.4591 7.75 19.25 9.54086 19.25 11.75V15.25C19.25 17.4591 17.4591 19.25 15.25 19.25H8.75C6.54086 19.25 4.75 17.4591 4.75 15.25V11.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12 7.25V4.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M10.25 12C10.25 12.6904 9.69036 13.25 9 13.25C8.30964 13.25 7.75 12.6904 7.75 12C7.75 11.3096 8.30964 10.75 9 10.75C9.69036 10.75 10.25 11.3096 10.25 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M16.25 12C16.25 12.6904 15.6904 13.25 15 13.25C14.3096 13.25 13.75 12.6904 13.75 12C13.75 11.3096 14.3096 10.75 15 10.75C15.6904 10.75 16.25 11.3096 16.25 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M10.75 16.25H13.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
cloud: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 14C4.75 15.7949 6.20507 17.25 8 17.25H16C17.7949 17.25 19.25 15.7949 19.25 14C19.25 12.2869 17.9246 10.8834 16.2433 10.759C16.1183 8.5239 14.2663 6.75 12 6.75C9.73368 6.75 7.88168 8.5239 7.75672 10.759C6.07542 10.8834 4.75 12.2869 4.75 14Z"></path>',
|
||||
"file-text": '<path d="M12.75 4.75H7.75C6.64543 4.75 5.75 5.64543 5.75 6.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H16.25C17.3546 19.25 18.25 18.3546 18.25 17.25V10.25M12.75 4.75V8.25C12.75 9.35457 13.6454 10.25 14.75 10.25H18.25M12.75 4.75L18.25 10.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.75 15.75H15.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.75 12.75H11.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
file: '<path d="M12.75 4.75H7.75C6.64543 4.75 5.75 5.64543 5.75 6.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H16.25C17.3546 19.25 18.25 18.3546 18.25 17.25V10.25M12.75 4.75V8.25C12.75 9.35457 13.6454 10.25 14.75 10.25H18.25M12.75 4.75L18.25 10.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"file-checkmark": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.75 4.75h-5a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h3.5m1.5-14.5v3.5a2 2 0 0 0 2 2h3.5m-5.5-5.5 5.5 5.5m0 0v1m1 3.5s-1.929 2.09-2.893 4.5l-1.607-1.929"></path>',
|
||||
"file-code": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.75 4.75h-5a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h.5m4.5-14.5v3.5a2 2 0 0 0 2 2h3.5m-5.5-5.5 5.5 5.5m0 0v2m-5 2.5L10.75 17l2.5 2.25m3.5-4.5 2.5 2.25-2.5 2.25"></path>',
|
||||
"file-important": '<path d="M12.75 4.75H7.75C6.64543 4.75 5.75 5.64543 5.75 6.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H12.25M12.75 4.75L18.25 10.25H14.75C13.6454 10.25 12.75 9.35457 12.75 8.25V4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18 14C18 13.4477 17.5523 13 17 13C16.4477 13 16 13.4477 16 14H18ZM16 16C16 16.5523 16.4477 17 17 17C17.5523 17 18 16.5523 18 16H16ZM16 14V16H18V14H16Z" fill="currentColor"></path><path d="M18 19C18 18.4477 17.5523 18 17 18C16.4477 18 16 18.4477 16 19H18ZM16 19.01C16 19.5623 16.4477 20.01 17 20.01C17.5523 20.01 18 19.5623 18 19.01H16ZM16 19V19.01H18V19H16Z" fill="currentColor"></path>',
|
||||
"file-minus": '<path d="M12.75 4.75H7.75C6.64543 4.75 5.75 5.64543 5.75 6.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H12.25M12.75 4.75V8.25C12.75 9.35457 13.6454 10.25 14.75 10.25H18.25M12.75 4.75L18.25 10.25M18.25 10.25V13.25M19.25 17.25H15.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"file-plus": '<path d="M12.75 4.75H7.75C6.64543 4.75 5.75 5.64543 5.75 6.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H12.25M12.75 4.75V8.25C12.75 9.35457 13.6454 10.25 14.75 10.25H18.25L12.75 4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M17 14.75V19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 17H14.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
files: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 6.75h-3a2 2 0 0 0-2 2v8.5a2 2 0 0 0 2 2h6.5a2 2 0 0 0 2-2v-5m-5.5-5.5 5.5 5.5m-5.5-5.5v3.5a2 2 0 0 0 2 2h3.5m-3.5-7.5h2l5.5 5.5v5a2 2 0 0 1-2 2H15.5"></path>',
|
||||
"file-zip": '<path d="M17.25 4.75H6.75C5.64543 4.75 4.75 5.64543 4.75 6.75V17.25C4.75 18.3546 5.64543 19.25 6.75 19.25H17.25C18.3546 19.25 19.25 18.3546 19.25 17.25V6.75C19.25 5.64543 18.3546 4.75 17.25 4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.5 6C9.5 6.27614 9.27614 6.5 9 6.5C8.72386 6.5 8.5 6.27614 8.5 6C8.5 5.72386 8.72386 5.5 9 5.5C9.27614 5.5 9.5 5.72386 9.5 6Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M11.5 8C11.5 8.27614 11.2761 8.5 11 8.5C10.7239 8.5 10.5 8.27614 10.5 8C10.5 7.72386 10.7239 7.5 11 7.5C11.2761 7.5 11.5 7.72386 11.5 8Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.5 10C9.5 10.2761 9.27614 10.5 9 10.5C8.72386 10.5 8.5 10.2761 8.5 10C8.5 9.72386 8.72386 9.5 9 9.5C9.27614 9.5 9.5 9.72386 9.5 10Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M11.5 12C11.5 12.2761 11.2761 12.5 11 12.5C10.7239 12.5 10.5 12.2761 10.5 12C10.5 11.7239 10.7239 11.5 11 11.5C11.2761 11.5 11.5 11.7239 11.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
jpg: '<path d="M8.25 8.75V13.5C8.25 14.4665 7.4665 15.25 6.5 15.25C5.5335 15.25 4.75 14.4665 4.75 13.5V12.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M10.75 15.25V12.25M10.75 12.25V8.75H12.25C12.8023 8.75 13.25 9.19772 13.25 9.75V11.25C13.25 11.8023 12.8023 12.25 12.25 12.25H10.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 8.75H17.75C16.6454 8.75 15.75 9.64543 15.75 10.75V13.25C15.75 14.3546 16.6454 15.25 17.75 15.25H19.25V12.25H17.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
pdf: '<path d="M4.75 15.25V12.25M4.75 12.25V8.75H6.25C6.80228 8.75 7.25 9.19772 7.25 9.75V11.25C7.25 11.8023 6.80228 12.25 6.25 12.25H4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M11.25 8.75H9.75V15.25H11.25C12.3546 15.25 13.25 14.3546 13.25 13.25V10.75C13.25 9.64543 12.3546 8.75 11.25 8.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.25 8.75H15.75V11.75M15.75 15.25V11.75M15.75 11.75H18.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
png: '<path d="M4.75 15.25V12.25M4.75 12.25V8.75H6.25C6.80228 8.75 7.25 9.19772 7.25 9.75V11.25C7.25 11.8023 6.80228 12.25 6.25 12.25H4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.75 15.25V8.75L13.25 15.25V8.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 8.75H17.75C16.6454 8.75 15.75 9.64543 15.75 10.75V13.25C15.75 14.3546 16.6454 15.25 17.75 15.25H19.25V12.25H17.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
gif: '<path d="M9.25 8.75H7.75C6.64543 8.75 5.75 9.64543 5.75 10.75V13.25C5.75 14.3546 6.64543 15.25 7.75 15.25H9.25V12.25H7.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M11.75 15.25V8.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.25 8.75H15.75C15.1977 8.75 14.75 9.19772 14.75 9.75V11.75M14.75 15.25V11.75M14.75 11.75H18.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
archive: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M18.25 8.75H5.75L6.57758 17.4396C6.67534 18.4661 7.53746 19.25 8.56857 19.25H15.4314C16.4625 19.25 17.3247 18.4661 17.4224 17.4396L18.25 8.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 5.75C19.25 5.19772 18.8023 4.75 18.25 4.75H5.75C5.19771 4.75 4.75 5.19772 4.75 5.75V7.75C4.75 8.30228 5.19772 8.75 5.75 8.75H18.25C18.8023 8.75 19.25 8.30228 19.25 7.75V5.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 13.25H14.25"></path>',
|
||||
sun: '<circle cx="12" cy="12" r="3.25" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></circle><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 2.75V4.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 6.75L16.0659 7.93416"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M21.25 12.0001L19.75 12.0001"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 17.2501L16.0659 16.066"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 19.75V21.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.9341 16.0659L6.74996 17.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.25 12.0001L2.75 12.0001"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.93405 7.93423L6.74991 6.75003"></path>',
|
||||
moon: '<path d="M18.25 15.0314C17.7575 15.1436 17.2459 15.2027 16.7209 15.2027C12.8082 15.2027 9.63607 11.9185 9.63607 7.86709C9.63607 6.75253 9.87614 5.69603 10.3057 4.75C7.12795 5.47387 4.75 8.40659 4.75 11.9143C4.75 15.9657 7.9221 19.25 11.8348 19.25C14.6711 19.25 17.1182 17.5242 18.25 15.0314Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
monitor: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V14.25C19.25 15.3546 18.3546 16.25 17.25 16.25H6.75C5.64543 16.25 4.75 15.3546 4.75 14.25V6.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 19.25L12 17.25L8.75 19.25"></path>',
|
||||
command: '<path d="M4.75 6.5C4.75 5.5335 5.5335 4.75 6.5 4.75C7.4665 4.75 8.25 5.5335 8.25 6.5V8.25H6.5C5.5335 8.25 4.75 7.4665 4.75 6.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.75 6.5C15.75 5.5335 16.5335 4.75 17.5 4.75C18.4665 4.75 19.25 5.5335 19.25 6.5C19.25 7.4665 18.4665 8.25 17.5 8.25H15.75V6.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.75 15.75H17.5C18.4665 15.75 19.25 16.5335 19.25 17.5C19.25 18.4665 18.4665 19.25 17.5 19.25C16.5335 19.25 15.75 18.4665 15.75 17.5V15.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M4.75 17.5C4.75 16.5335 5.5335 15.75 6.5 15.75H8.25V17.5C8.25 18.4665 7.4665 19.25 6.5 19.25C5.5335 19.25 4.75 18.4665 4.75 17.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.25 8.25H15.75V15.75H8.25V8.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
link: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M16.75 13.25L18 12C19.6569 10.3431 19.6569 7.65685 18 6V6C16.3431 4.34315 13.6569 4.34315 12 6L10.75 7.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.25 10.75L6 12C4.34315 13.6569 4.34315 16.3431 6 18V18C7.65685 19.6569 10.3431 19.6569 12 18L13.25 16.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M14.25 9.75L9.75 14.25"></path>',
|
||||
share: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.25 4.75H6.75C5.64543 4.75 4.75 5.64543 4.75 6.75V17.25C4.75 18.3546 5.64543 19.25 6.75 19.25H17.25C18.3546 19.25 19.25 18.3546 19.25 17.25V14.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 9.25V4.75H14.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19 5L11.75 12.25"></path>',
|
||||
branch: '<path d="M9.25 7C9.25 8.24264 8.24264 9.25 7 9.25C5.75736 9.25 4.75 8.24264 4.75 7C4.75 5.75736 5.75736 4.75 7 4.75C8.24264 4.75 9.25 5.75736 9.25 7Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.75 9.5V14.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M10.75 12.25H15.25C16.3546 12.25 17.25 11.3546 17.25 10.25V9.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 7C19.25 8.24264 18.2426 9.25 17 9.25C15.7574 9.25 14.75 8.24264 14.75 7C14.75 5.75736 15.7574 4.75 17 4.75C18.2426 4.75 19.25 5.75736 19.25 7Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.25 17C9.25 18.2426 8.24264 19.25 7 19.25C5.75736 19.25 4.75 18.2426 4.75 17C4.75 15.7574 5.75736 14.75 7 14.75C8.24264 14.75 9.25 15.7574 9.25 17Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
logout: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.75 8.75L19.25 12L15.75 15.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19 12H10.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 4.75H6.75C5.64543 4.75 4.75 5.64543 4.75 6.75V17.25C4.75 18.3546 5.64543 19.25 6.75 19.25H15.25"></path>',
|
||||
login: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 8.75L13.25 12L9.75 15.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V17.25C19.25 18.3546 18.3546 19.25 17.25 19.25H9.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M13 12H4.75"></path>',
|
||||
keys: '<path d="M10.25 13.0632C11.9872 12.5294 13.25 10.9122 13.25 9C13.25 6.65279 11.3472 4.75 9 4.75C6.65279 4.75 4.75 6.65279 4.75 9C4.75 10.9122 6.01283 12.5294 7.75 13.0632V18C7.75 18.6904 8.30964 19.25 9 19.25C9.69036 19.25 10.25 18.6904 10.25 18V13.0632Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12 12L17.3452 15.0736C17.9523 15.436 18.7285 15.2209 19.079 14.5932C19.4295 13.9655 19.2215 13.1629 18.6144 12.8005L13.5 9.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9 8V8.01" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
key: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15 13.25C17.3472 13.25 19.25 11.3472 19.25 9C19.25 6.65279 17.3472 4.75 15 4.75C12.6528 4.75 10.75 6.65279 10.75 9C10.75 9.31012 10.7832 9.61248 10.8463 9.90372L4.75 16V19.25H8L8.75 18.5V16.75H10.5L11.75 15.5V13.75H13.5L14.0963 13.1537C14.3875 13.2168 14.6899 13.25 15 13.25Z"></path><path stroke="currentColor" d="M16.5 8C16.5 8.27614 16.2761 8.5 16 8.5C15.7239 8.5 15.5 8.27614 15.5 8C15.5 7.72386 15.7239 7.5 16 7.5C16.2761 7.5 16.5 7.72386 16.5 8Z"></path>',
|
||||
info: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 13V15"></path><circle cx="12" cy="9" r="1" fill="currentColor"></circle><circle cx="12" cy="12" r="7.25" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></circle>',
|
||||
warning: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.9522 16.3536L10.2152 5.85658C10.9531 4.38481 13.0539 4.3852 13.7913 5.85723L19.0495 16.3543C19.7156 17.6841 18.7487 19.25 17.2613 19.25H6.74007C5.25234 19.25 4.2854 17.6835 4.9522 16.3536Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10V12"></path><circle cx="12" cy="16" r="1" fill="currentColor"></circle>',
|
||||
checkmark: '<path d="M7.75 12.75L10 15.25L16.25 8.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"checkmark-square": '<path d="M17.2502 19.25H6.75C5.64543 19.25 4.75 18.3546 4.75 17.25V6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.2502C18.3548 4.75 19.2502 5.64543 19.2502 6.75V17.25C19.2502 18.3546 18.3548 19.25 17.2502 19.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.75 12L11 14.25L15.25 9.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
plus: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 5.75V18.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M18.25 12L5.75 12"></path>',
|
||||
minus: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M18.25 12.25L5.75 12.25"></path>',
|
||||
undo: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.25 4.75L4.75 9L9.25 13.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5.5 9H15.25C17.4591 9 19.25 10.7909 19.25 13V19.25"></path>',
|
||||
merge: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m4.75 19.25 7.25-5V5m2 10.63 5.25 3.62m-10.5-11L12 4.75l3.25 3.5"></path>',
|
||||
redo: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M14.75 4.75L19.25 9L14.75 13.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 9H8.75C6.54086 9 4.75 10.7909 4.75 13V19.25"></path>',
|
||||
refresh: '<path d="M11.25 14.75L8.75 17M8.75 17L11.25 19.25M8.75 17H13.25C16.5637 17 19.25 14.3137 19.25 11V10.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.25 7H10.75C7.43629 7 4.75 9.68629 4.75 13V13.25M15.25 7L12.75 9.25M15.25 7L12.75 4.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
rotate: '<path d="M17.1265 6.87348C14.2952 4.04217 9.70478 4.04217 6.87348 6.87348C4.04217 9.70478 4.04217 14.2952 6.87348 17.1265C9.70478 19.9578 14.2952 19.9578 17.1265 17.1265C17.7603 16.4927 18.2522 15.7708 18.6023 15.0001" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 19.25V15.75C19.25 15.1977 18.8023 14.75 18.25 14.75H14.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"arrow-left": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10.25 6.75L4.75 12L10.25 17.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 12H5"></path>',
|
||||
"arrow-down": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 13.75L12 19.25L6.75 13.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 18.25V4.75"></path>',
|
||||
"arrow-right": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M13.75 6.75L19.25 12L13.75 17.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19 12H4.75"></path>',
|
||||
"arrow-up": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 10.25L12 4.75L6.75 10.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 19.25V5.75"></path>',
|
||||
enter: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 6.75V12a2 2 0 0 1-2 2h-8.5m0 0 3.5-3.25M6.75 14l3.5 3.25"></path>',
|
||||
trash: '<path d="M5.75 7.75L6.59115 17.4233C6.68102 18.4568 7.54622 19.25 8.58363 19.25H14.4164C15.4538 19.25 16.319 18.4568 16.4088 17.4233L17.25 7.75H5.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.75 10.75V16.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M13.25 10.75V16.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.75 7.75V6.75C8.75 5.64543 9.64543 4.75 10.75 4.75H12.25C13.3546 4.75 14.25 5.64543 14.25 6.75V7.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M4.75 7.75H18.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
package: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5.75 8.87 12 12.25M5.75 8.87v7L12 19.25M5.75 8.87l3.125-1.56m9.375 1.56L12 5.75 8.875 7.31m9.375 1.56v7L12 19.25m6.25-10.38-3.125 1.69M12 12.25v7m0-7 3.125-1.69m0 0-6.25-3.25"></path>',
|
||||
box: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 8L12 4.75L19.25 8L12 11.25L4.75 8Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 16L12 19.25L19.25 16"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 8V16"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 8V16"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 11.5V19"></path>',
|
||||
lock: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5.75 11.75C5.75 11.1977 6.19772 10.75 6.75 10.75H17.25C17.8023 10.75 18.25 11.1977 18.25 11.75V17.25C18.25 18.3546 17.3546 19.25 16.25 19.25H7.75C6.64543 19.25 5.75 18.3546 5.75 17.25V11.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.75 10.5V10.3427C7.75 8.78147 7.65607 7.04125 8.74646 5.9239C9.36829 5.2867 10.3745 4.75 12 4.75C13.6255 4.75 14.6317 5.2867 15.2535 5.9239C16.3439 7.04125 16.25 8.78147 16.25 10.3427V10.5"></path>',
|
||||
unlocked: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5.75 11.75C5.75 11.1977 6.19772 10.75 6.75 10.75H17.25C17.8023 10.75 18.25 11.1977 18.25 11.75V17.25C18.25 18.3546 17.3546 19.25 16.25 19.25H7.75C6.64543 19.25 5.75 18.3546 5.75 17.25V11.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.75 10.5V9.84343C7.75 8.61493 7.70093 7.29883 8.42416 6.30578C8.99862 5.51699 10.0568 4.75 12 4.75C14 4.75 15.25 6.25 15.25 6.25"></path>',
|
||||
activity: '<path d="M4.75 11.75H8.25L10.25 4.75L13.75 19.25L15.75 11.75H19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
asterisk: '<path d="M12 4.75V19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.2501 8.74994L5.75 15.2501" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.2498 15.2503L5.74976 8.75012" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
bell: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 12V10C17.25 7.1005 14.8995 4.75 12 4.75C9.10051 4.75 6.75 7.10051 6.75 10V12L4.75 16.25H19.25L17.25 12Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9 16.75C9 16.75 9 19.25 12 19.25C15 19.25 15 16.75 15 16.75"></path>',
|
||||
"bell-off": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 6.875V12L19.25 16.25H7.75M5.75 14.125L6.75 12V10C6.75 7.10051 9.10051 4.75 12 4.75C12 4.75 13.6094 4.75002 14.5938 5.24998"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9 16.75C9 16.75 9 19.25 12 19.25C15 19.25 15 16.75 15 16.75"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 4.75L4.75 19.25"></path>',
|
||||
bolt: '<path d="M10.75 13.25H6.75L13.25 4.75V10.75H17.25L10.75 19.25V13.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
bookmark: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6.75 6.75C6.75 5.64543 7.64543 4.75 8.75 4.75H15.25C16.3546 4.75 17.25 5.64543 17.25 6.75V19.25L12 14.75L6.75 19.25V6.75Z"></path>',
|
||||
brain: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5.75 10.25v-.583A2.917 2.917 0 0 1 8.667 6.75H8.8a2.5 2.5 0 0 1 2.45-2H12m-4.75 5c-1.38 0-2.5 1.231-2.5 2.75 0 .788.301 1.499.784 2 .076.079.157.153.242.221m1.974.529h-.5a2.341 2.341 0 0 1-1.474-.529m0 0a2.917 2.917 0 0 0 2.89 2.529H8.8a2.5 2.5 0 0 0 2.45 2H12m0-14.5h.75a2.5 2.5 0 0 1 2.45 2h.133a2.917 2.917 0 0 1 2.917 2.917v.583M12 4.75V8m0 11.25h.75a2.5 2.5 0 0 0 2.45-2h.133a2.917 2.917 0 0 0 2.891-2.529M12 19.25V15m4.75-5.25c1.38 0 2.5 1.231 2.5 2.75 0 .788-.301 1.499-.784 2a2.594 2.594 0 0 1-.242.221m-1.974.529h.5c.551 0 1.061-.196 1.474-.529M12 15c0-1.6 1.333-2.25 2-2.25h.25M12 15V8m0 0c0 1.2-1 3-2.25 3.25"></path>',
|
||||
browser: '<path d="M4.75 6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V17.25C19.25 18.3546 18.3546 19.25 17.25 19.25H6.75C5.64543 19.25 4.75 18.3546 4.75 17.25V6.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M5 8.25H19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"browser-cursor": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.25 19.25h-5.5a2 2 0 0 1-2-2V6.75a2 2 0 0 1 2-2h10.5a2 2 0 0 1 2 2v5.5M8 8h.01m3 0h.01m3 0h.01m.72 5.75 1 5.5L17 17l2.25-.75-4.5-2.5Z"></path>',
|
||||
bug: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 19.25v-3.5m0 3.5a4.25 4.25 0 0 1-4.249-4.157M12 19.25a4.25 4.25 0 0 0 4.249-4.157M4.75 7.75v1.326a2 2 0 0 0 1.065 1.768l2.069 1.095M19.25 7.75v1.326a2 2 0 0 1-1.065 1.768l-2.069 1.095M4.75 19.25v-1.645a2 2 0 0 1 1.298-1.873l1.703-.639M19.25 19.25v-1.645a2 2 0 0 0-1.298-1.873l-1.703-.639M9.75 7.25v-.5a2 2 0 0 1 2-2h.5a2 2 0 0 1 2 2v.5m-4.5 0v2m0-2-.894-.447a2 2 0 0 1-1.106-1.79V4.75m6.5 4.5v-2m0 0 .894-.447a2 2 0 0 0 1.106-1.79V4.75M7.751 15.093 7.75 15v-2c0-.367.046-.722.134-1.062m0 0a4.252 4.252 0 0 1 8.232 0m0 0c.088.34.134.695.134 1.062v2l-.001.093"></path>',
|
||||
"carat-down": '<path d="M12 15.25L16.25 9.75H7.75L12 15.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"carat-left": '<path d="M8.75 12L14.25 7.75V16.25L8.75 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"carat-right": '<path d="M14.25 12L8.75 7.75V16.25L14.25 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"carat-up": '<path d="M12 9.75L16.25 15.25H7.75L12 9.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
cards: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m15.144 8.75-.725-2.543c-.3-1.048-1.446-1.67-2.562-1.39l-5.556 1.4c-1.116.28-1.778 1.358-1.48 2.406l1.76 6.17c.3 1.048 1.446 1.67 2.562 1.39l.607-.153m5.394-7.28H11.75a2 2 0 0 0-2 2v5.28m5.394-7.28h2.106a2 2 0 0 1 2 2v6.5a2 2 0 0 1-2 2h-5.5a2 2 0 0 1-2-2v-1.22"></path>',
|
||||
chart: '<path d="M5.75 19.25V13.75M9.75 19.25V11.75M14.25 19.25V13.75M5.75 10.25L9.75 5.75L14.25 9.75L18.25 4.75M18.25 19.25V9.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"check-circle": '<path d="M14.25 10C14.25 10 12.3214 12.0893 11.3571 14.5L9.75 12.5714M19.25 12.25C19.25 16.2541 16.0041 19.5 12 19.5C7.99594 19.5 4.75 16.2541 4.75 12.25C4.75 8.24594 7.99594 5 12 5C16.0041 5 19.25 8.24594 19.25 12.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
checklist: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 12.25v-5.5a2 2 0 0 0-2-2H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2h4.5m-2.5-10.5h6.5m-6.5 4h6.5m-.5 5 1.5 1.5c.75-2.25 3-3.5 3-3.5"></path>',
|
||||
"checklist-cards": '<path d="M15.1439 8.75009L14.4189 6.20709C14.1189 5.15909 12.9729 4.53709 11.8569 4.81709L6.30091 6.21709C5.18491 6.49709 4.52291 7.57509 4.82091 8.62309L6.58091 14.7931C6.88091 15.8411 8.02691 16.4631 9.14291 16.1831L9.74991 16.0301M15.1439 8.75009H11.7499C11.2195 8.75009 10.7108 8.9608 10.3357 9.33587C9.96062 9.71095 9.74991 10.2197 9.74991 10.7501V16.0301M15.1439 8.75009H17.2499C17.7803 8.75009 18.289 8.9608 18.6641 9.33587C19.0392 9.71095 19.2499 10.2197 19.2499 10.7501V17.2501C19.2499 17.7805 19.0392 18.2892 18.6641 18.6643C18.289 19.0394 17.7803 19.2501 17.2499 19.2501H11.7499C11.2195 19.2501 10.7108 19.0394 10.3357 18.6643C9.96062 18.2892 9.74991 17.7805 9.74991 17.2501V16.0301M16.2499 12.2501C16.2499 12.2501 14.7499 13.8751 13.9999 15.7501L12.7499 14.2501" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
lab: '<path d="M16.25 4.75H7.75L8.73964 5.86334C9.39049 6.59555 9.75 7.54114 9.75 8.5208V11.25L4.75 19.25H19.25L14.25 11.25V8.5208C14.25 7.54114 14.6095 6.59555 15.2604 5.86334L16.25 4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M7 15.75H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
circle: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 12a7.25 7.25 0 1 1-14.5 0 7.25 7.25 0 0 1 14.5 0Z"></path>',
|
||||
"circle-dotted": '<path stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M12 5v.01m3.502.928-.005.01m2.57 2.554-.01.005m.948 3.497h-.01m-.928 3.502-.009-.005m-2.555 2.57-.005-.01M12 19v.01m-3.498-.947-.005.009m-2.555-2.57-.008.005m-.929-3.502h-.01m.947-3.498-.008-.005m2.568-2.555-.005-.008"></path>',
|
||||
clipboard: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9 6.75H7.75C6.64543 6.75 5.75 7.64543 5.75 8.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H16.25C17.3546 19.25 18.25 18.3546 18.25 17.25V8.75C18.25 7.64543 17.3546 6.75 16.25 6.75H15"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M14 8.25H10C9.44772 8.25 9 7.80228 9 7.25V5.75C9 5.19772 9.44772 4.75 10 4.75H14C14.5523 4.75 15 5.19772 15 5.75V7.25C15 7.80228 14.5523 8.25 14 8.25Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 12.25H14.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 15.25H14.25"></path>',
|
||||
clock: '<circle cx="12" cy="12" r="7.25" stroke="currentColor" stroke-width="1.5"></circle><path stroke="currentColor" stroke-width="1.5" d="M12 8V12L14 14"></path>',
|
||||
"close-circle": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 12C4.75 7.99594 7.99594 4.75 12 4.75V4.75C16.0041 4.75 19.25 7.99594 19.25 12V12C19.25 16.0041 16.0041 19.25 12 19.25V19.25C7.99594 19.25 4.75 16.0041 4.75 12V12Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 9.75L14.25 14.25"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M14.25 9.75L9.75 14.25"></path>',
|
||||
terminal: '<rect width="14.5" height="14.5" x="4.75" y="4.75" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" rx="2"></rect><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M8.75 10.75L11.25 13L8.75 15.25"></path>',
|
||||
code: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m15.75 8.75 3.5 3.25-3.5 3.25m-7.5-6.5L4.75 12l3.5 3.25m5-9.5-2.5 12.5"></path>',
|
||||
components: '<path d="M9.75 7L12 4.75L14.25 7L12 9.25L9.75 7Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M14.75 12L17 9.75L19.25 12L17 14.25L14.75 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.75 17L12 14.75L14.25 17L12 19.25L9.75 17Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M4.75 12L7 9.75L9.25 12L7 14.25L4.75 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
copy: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6.5 15.25V15.25C5.5335 15.25 4.75 14.4665 4.75 13.5V6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H13.5C14.4665 4.75 15.25 5.5335 15.25 6.5V6.5"></path><rect width="10.5" height="10.5" x="8.75" y="8.75" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" rx="2"></rect>',
|
||||
cpu: '<path d="M6.75 8.75C6.75 7.64543 7.64543 6.75 8.75 6.75H15.25C16.3546 6.75 17.25 7.64543 17.25 8.75V15.25C17.25 16.3546 16.3546 17.25 15.25 17.25H8.75C7.64543 17.25 6.75 16.3546 6.75 15.25V8.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.75 4.75V6.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 9.75L17.75 9.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.75 17.75V19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.25 9.75L4.75 9.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M14.25 4.75V6.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 14.25L17.75 14.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M14.25 17.75V19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.25 14.25L4.75 14.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
dashboard: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V17.25C19.25 18.3546 18.3546 19.25 17.25 19.25H6.75C5.64543 19.25 4.75 18.3546 4.75 17.25V6.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 8.75V19"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5 8.25H19"></path>',
|
||||
transfer: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.75 9.25 16 5.75m0 0 3.25 3.5M16 5.75v12.5m-4.75-3.5L8 18.25m0 0-3.25-3.5M8 18.25V5.75"></path>',
|
||||
devices: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.75 8.25v-.5a1 1 0 0 1 1-1h9.5a1 1 0 0 1 1 1v10.5a1 1 0 0 1-1 1h-5.5m-8-1v-6.5a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1v6.5a1 1 0 0 1-1 1h-3.5a1 1 0 0 1-1-1Z"></path>',
|
||||
diamond: '<path d="M9.5 9C10.7644 7.54767 12 4.75 12 4.75C12 4.75 13.2356 7.54767 14.5 9C15.7314 10.4145 18.25 12 18.25 12C18.25 12 15.7314 13.5855 14.5 15C13.2356 16.4523 12 19.25 12 19.25C12 19.25 10.7644 16.4523 9.5 15C8.26857 13.5855 5.75 12 5.75 12C5.75 12 8.26857 10.4145 9.5 9Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
dice: '<path d="M17.25 4.75H6.75C5.64543 4.75 4.75 5.64543 4.75 6.75V17.25C4.75 18.3546 5.64543 19.25 6.75 19.25H17.25C18.3546 19.25 19.25 18.3546 19.25 17.25V6.75C19.25 5.64543 18.3546 4.75 17.25 4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.5 9C9.5 9.27614 9.27614 9.5 9 9.5C8.72386 9.5 8.5 9.27614 8.5 9C8.5 8.72386 8.72386 8.5 9 8.5C9.27614 8.5 9.5 8.72386 9.5 9Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.5 15C9.5 15.2761 9.27614 15.5 9 15.5C8.72386 15.5 8.5 15.2761 8.5 15C8.5 14.7239 8.72386 14.5 9 14.5C9.27614 14.5 9.5 14.7239 9.5 15Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.5 9C15.5 9.27614 15.2761 9.5 15 9.5C14.7239 9.5 14.5 9.27614 14.5 9C14.5 8.72386 14.7239 8.5 15 8.5C15.2761 8.5 15.5 8.72386 15.5 9Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.5 12C15.5 12.2761 15.2761 12.5 15 12.5C14.7239 12.5 14.5 12.2761 14.5 12C14.5 11.7239 14.7239 11.5 15 11.5C15.2761 11.5 15.5 11.7239 15.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.5 12C9.5 12.2761 9.27614 12.5 9 12.5C8.72386 12.5 8.5 12.2761 8.5 12C8.5 11.7239 8.72386 11.5 9 11.5C9.27614 11.5 9.5 11.7239 9.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M15.5 15C15.5 15.2761 15.2761 15.5 15 15.5C14.7239 15.5 14.5 15.2761 14.5 15C14.5 14.7239 14.7239 14.5 15 14.5C15.2761 14.5 15.5 14.7239 15.5 15Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
discord: '<path d="M5.9143 7.38378L4.93679 14.6174C4.82454 15.448 5.24219 16.2606 5.983 16.6528L8.99995 18.25L9.99995 15.75C9.99995 15.75 10.6562 16.25 11.9999 16.25C13.3437 16.25 13.9999 15.75 13.9999 15.75L14.9999 18.25L18.0169 16.6528C18.7577 16.2606 19.1754 15.448 19.0631 14.6174L18.0856 7.38378C18.0334 6.99739 17.7613 6.67658 17.3887 6.56192L14.7499 5.75003V6.25003C14.7499 6.80232 14.3022 7.25003 13.7499 7.25003H10.2499C9.69766 7.25003 9.24995 6.80232 9.24995 6.25003V5.75003L6.61122 6.56192C6.23855 6.67658 5.96652 6.99739 5.9143 7.38378Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M10.5 12C10.5 12.2761 10.2761 12.5 10 12.5C9.72386 12.5 9.5 12.2761 9.5 12C9.5 11.7239 9.72386 11.5 10 11.5C10.2761 11.5 10.5 11.7239 10.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M14.5 12C14.5 12.2761 14.2761 12.5 14 12.5C13.7239 12.5 13.5 12.2761 13.5 12C13.5 11.7239 13.7239 11.5 14 11.5C14.2761 11.5 14.5 11.7239 14.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
dots: '<path d="M12.5 6C12.5 6.27614 12.2761 6.5 12 6.5C11.7239 6.5 11.5 6.27614 11.5 6C11.5 5.72386 11.7239 5.5 12 5.5C12.2761 5.5 12.5 5.72386 12.5 6Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12.5 12C12.5 12.2761 12.2761 12.5 12 12.5C11.7239 12.5 11.5 12.2761 11.5 12C11.5 11.7239 11.7239 11.5 12 11.5C12.2761 11.5 12.5 11.7239 12.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.5 6C18.5 6.27614 18.2761 6.5 18 6.5C17.7239 6.5 17.5 6.27614 17.5 6C17.5 5.72386 17.7239 5.5 18 5.5C18.2761 5.5 18.5 5.72386 18.5 6Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.5 12C18.5 12.2761 18.2761 12.5 18 12.5C17.7239 12.5 17.5 12.2761 17.5 12C17.5 11.7239 17.7239 11.5 18 11.5C18.2761 11.5 18.5 11.7239 18.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.5 6C6.5 6.27614 6.27614 6.5 6 6.5C5.72386 6.5 5.5 6.27614 5.5 6C5.5 5.72386 5.72386 5.5 6 5.5C6.27614 5.5 6.5 5.72386 6.5 6Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.5 12C6.5 12.2761 6.27614 12.5 6 12.5C5.72386 12.5 5.5 12.2761 5.5 12C5.5 11.7239 5.72386 11.5 6 11.5C6.27614 11.5 6.5 11.7239 6.5 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12.5 18C12.5 18.2761 12.2761 18.5 12 18.5C11.7239 18.5 11.5 18.2761 11.5 18C11.5 17.7239 11.7239 17.5 12 17.5C12.2761 17.5 12.5 17.7239 12.5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M18.5 18C18.5 18.2761 18.2761 18.5 18 18.5C17.7239 18.5 17.5 18.2761 17.5 18C17.5 17.7239 17.7239 17.5 18 17.5C18.2761 17.5 18.5 17.7239 18.5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.5 18C6.5 18.2761 6.27614 18.5 6 18.5C5.72386 18.5 5.5 18.2761 5.5 18C5.5 17.7239 5.72386 17.5 6 17.5C6.27614 17.5 6.5 17.7239 6.5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
expand: '<path d="M15.25 9.25L12 5.75L8.75 9.25M15.25 14.75L12 18.25L8.75 14.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
droplet: '<path d="M17.25 14.0714C17.25 16.9315 14.8995 19.25 12 19.25C9.10051 19.25 6.75 16.9315 6.75 14.0714C6.75 11.2114 12 4.75 12 4.75C12 4.75 17.25 11.2114 17.25 14.0714Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"chevron-double-down": '<path d="M8.75 7.75L12 11.25L15.25 7.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.75 12.75L12 16.25L15.25 12.75" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"chevron-double-left": '<path d="M11.25 8.75L7.75 12L11.25 15.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M16.25 8.75L12.75 12L16.25 15.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"chevron-double-right": '<path d="M7.75 8.75L11.25 12L7.75 15.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M12.75 8.75L16.25 12L12.75 15.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"chevron-double-up": '<path d="M8.75 11.25L12 7.75L15.25 11.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M8.75 16.25L12 12.75L15.25 16.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"speech-bubble": '<path d="M12 18.25C15.866 18.25 19.25 16.1552 19.25 11.5C19.25 6.84483 15.866 4.75 12 4.75C8.13401 4.75 4.75 6.84483 4.75 11.5C4.75 13.2675 5.23783 14.6659 6.05464 15.7206C6.29358 16.0292 6.38851 16.4392 6.2231 16.7926C6.12235 17.0079 6.01633 17.2134 5.90792 17.4082C5.45369 18.2242 6.07951 19.4131 6.99526 19.2297C8.0113 19.0263 9.14752 18.722 10.0954 18.2738C10.2933 18.1803 10.5134 18.1439 10.7305 18.1714C11.145 18.224 11.5695 18.25 12 18.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
message: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 18.25C15.5 18.25 19.25 16.5 19.25 12C19.25 7.5 15.5 5.75 12 5.75C8.5 5.75 4.75 7.5 4.75 12C4.75 13.0298 4.94639 13.9156 5.29123 14.6693C5.50618 15.1392 5.62675 15.6573 5.53154 16.1651L5.26934 17.5635C5.13974 18.2547 5.74527 18.8603 6.43651 18.7307L9.64388 18.1293C9.896 18.082 10.1545 18.0861 10.4078 18.1263C10.935 18.2099 11.4704 18.25 12 18.25Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M9.5 12C9.5 12.2761 9.27614 12.5 9 12.5C8.72386 12.5 8.5 12.2761 8.5 12C8.5 11.7239 8.72386 11.5 9 11.5C9.27614 11.5 9.5 11.7239 9.5 12Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.5 12C12.5 12.2761 12.2761 12.5 12 12.5C11.7239 12.5 11.5 12.2761 11.5 12C11.5 11.7239 11.7239 11.5 12 11.5C12.2761 11.5 12.5 11.7239 12.5 12Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M15.5 12C15.5 12.2761 15.2761 12.5 15 12.5C14.7239 12.5 14.5 12.2761 14.5 12C14.5 11.7239 14.7239 11.5 15 11.5C15.2761 11.5 15.5 11.7239 15.5 12Z"></path>',
|
||||
annotation: '<path d="M4.75 6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V15.25C19.25 16.3546 18.3546 17.25 17.25 17.25H14.625L12 19.25L9.375 17.25H6.75C5.64543 17.25 4.75 16.3546 4.75 15.25V6.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
square: '<path d="M17.2502 19.25H6.75C5.64543 19.25 4.75 18.3546 4.75 17.25V6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.2502C18.3548 4.75 19.2502 5.64543 19.2502 6.75V17.25C19.2502 18.3546 18.3548 19.25 17.2502 19.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
"pull-request": '<path d="M9.25 7C9.25 8.24264 8.24264 9.25 7 9.25C5.75736 9.25 4.75 8.24264 4.75 7C4.75 5.75736 5.75736 4.75 7 4.75C8.24264 4.75 9.25 5.75736 9.25 7Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9.25 17C9.25 18.2426 8.24264 19.25 7 19.25C5.75736 19.25 4.75 18.2426 4.75 17C4.75 15.7574 5.75736 14.75 7 14.75C8.24264 14.75 9.25 15.7574 9.25 17Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M19.25 17C19.25 18.2426 18.2426 19.25 17 19.25C15.7574 19.25 14.75 18.2426 14.75 17C14.75 15.7574 15.7574 14.75 17 14.75C18.2426 14.75 19.25 15.7574 19.25 17Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M6.75 9.5V14.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M17.25 14.25V10.4701C17.25 9.83943 17.0513 9.22483 16.682 8.71359L14 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M13.75 8.25V4.75H17.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
pencil: '<path d="M4.75 19.25L9 18.25L18.9491 8.30083C19.3397 7.9103 19.3397 7.27714 18.9491 6.88661L17.1134 5.05083C16.7228 4.6603 16.0897 4.6603 15.6991 5.05083L5.75 15L4.75 19.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M14.0234 7.03906L17.0234 10.0391" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
sparkles: '<path d="M17 4.75C17 5.89705 15.8971 7 14.75 7C15.8971 7 17 8.10295 17 9.25C17 8.10295 18.1029 7 19.25 7C18.1029 7 17 5.89705 17 4.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M17 14.75C17 15.8971 15.8971 17 14.75 17C15.8971 17 17 18.1029 17 19.25C17 18.1029 18.1029 17 19.25 17C18.1029 17 17 15.8971 17 14.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M9 7.75C9 9.91666 6.91666 12 4.75 12C6.91666 12 9 14.0833 9 16.25C9 14.0833 11.0833 12 13.25 12C11.0833 12 9 9.91666 9 7.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>',
|
||||
photo: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 16L7.49619 12.5067C8.2749 11.5161 9.76453 11.4837 10.5856 12.4395L13 15.25M10.915 12.823C11.9522 11.5037 13.3973 9.63455 13.4914 9.51294C13.4947 9.50859 13.4979 9.50448 13.5013 9.50017C14.2815 8.51598 15.7663 8.48581 16.5856 9.43947L19 12.25M6.75 19.25H17.25C18.3546 19.25 19.25 18.3546 19.25 17.25V6.75C19.25 5.64543 18.3546 4.75 17.25 4.75H6.75C5.64543 4.75 4.75 5.64543 4.75 6.75V17.25C4.75 18.3546 5.64543 19.25 6.75 19.25Z"></path>',
|
||||
columns: '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V17.25C19.25 18.3546 18.3546 19.25 17.25 19.25H6.75C5.64543 19.25 4.75 18.3546 4.75 17.25V6.75Z"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 5V19"></path>',
|
||||
"open-pane": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M14.25 4.75v14.5m-3-8.5L9.75 12l1.5 1.25m-4.5 6h10.5a2 2 0 0 0 2-2V6.75a2 2 0 0 0-2-2H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2Z"></path>',
|
||||
"close-pane": '<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.75 4.75v14.5m3-8.5L14.25 12l-1.5 1.25M6.75 19.25h10.5a2 2 0 0 0 2-2V6.75a2 2 0 0 0-2-2H6.75a2 2 0 0 0-2 2v10.5a2 2 0 0 0 2 2Z"></path>',
|
||||
} as const
|
||||
|
||||
export function Icon(props: IconProps) {
|
||||
const [local, others] = splitProps(props, ["name", "size", "class", "classList"])
|
||||
const size = local.size ?? 24
|
||||
return (
|
||||
<svg
|
||||
classList={{
|
||||
...(local.classList || {}),
|
||||
"shrink-0": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
width={size}
|
||||
height={size}
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
innerHTML={icons[local.name]}
|
||||
aria-hidden="true"
|
||||
{...others}
|
||||
/>
|
||||
)
|
||||
}
|
||||
13
packages/app/src/ui/index.ts
Normal file
13
packages/app/src/ui/index.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
export { Button, type ButtonProps } from "./button"
|
||||
export {
|
||||
Collapsible,
|
||||
type CollapsibleProps,
|
||||
type CollapsibleTriggerProps,
|
||||
type CollapsibleContentProps,
|
||||
} from "./collapsible"
|
||||
export { FileIcon, type FileIconProps } from "./file-icon"
|
||||
export { Icon, type IconProps } from "./icon"
|
||||
export { IconButton, type IconButtonProps } from "./icon-button"
|
||||
export { Link, type LinkProps } from "./link"
|
||||
export { Logo, type LogoProps } from "./logo"
|
||||
export { Tooltip, type TooltipProps } from "./tooltip"
|
||||
15
packages/app/src/ui/link.tsx
Normal file
15
packages/app/src/ui/link.tsx
Normal file
@@ -0,0 +1,15 @@
|
||||
import { A } from "@solidjs/router"
|
||||
import { splitProps } from "solid-js"
|
||||
import type { ComponentProps } from "solid-js"
|
||||
import { getButtonClasses } from "./button"
|
||||
|
||||
export interface LinkProps extends ComponentProps<typeof A> {
|
||||
variant?: "primary" | "secondary" | "outline" | "ghost"
|
||||
size?: "sm" | "md" | "lg"
|
||||
}
|
||||
|
||||
export function Link(props: LinkProps) {
|
||||
const [local, others] = splitProps(props, ["variant", "size", "class"])
|
||||
const classes = local.variant ? getButtonClasses(local.variant, local.size, local.class) : local.class
|
||||
return <A class={classes} {...others} />
|
||||
}
|
||||
125
packages/app/src/ui/logo.tsx
Normal file
125
packages/app/src/ui/logo.tsx
Normal file
@@ -0,0 +1,125 @@
|
||||
import type { ComponentProps } from "solid-js"
|
||||
|
||||
export interface LogoProps extends ComponentProps<"svg"> {
|
||||
variant?: "mark" | "full" | "ornate"
|
||||
size?: number
|
||||
}
|
||||
|
||||
export function Logo(props: LogoProps) {
|
||||
const { variant = "mark", size = 64, ...others } = props
|
||||
|
||||
if (variant === "mark") {
|
||||
return (
|
||||
<svg
|
||||
width={size}
|
||||
height={size * (42 / 64)}
|
||||
viewBox="0 0 64 42"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class={`text-text ${props.class ?? ""}`}
|
||||
{...others}
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M0 0H32V41.5955H0V0ZM24 8.5H8V33H24V8.5Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path d="M40 0H64V8.5H48V33H64V41.5H40V0Z" fill="currentColor" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
if (variant === "full") {
|
||||
return (
|
||||
<svg
|
||||
width={size * (289 / 42)}
|
||||
height={size}
|
||||
viewBox="0 0 289 42"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...others}
|
||||
>
|
||||
<path d="M264.5 0H288.5V8.5H272.5V16.5H288.5V25H272.5V33H288.5V41.5H264.5V0Z" fill="currentColor" />
|
||||
<path d="M248.5 0H224.5V41.5H248.5V33H232.5V8.5H248.5V0Z" fill="currentColor" />
|
||||
<path d="M256.5 8.5H248.5V33H256.5V8.5Z" fill="currentColor" />
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M184.5 0H216.5V41.5H184.5V0ZM208.5 8.5H192.5V33H208.5V8.5Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path d="M144.5 8.5H136.5V41.5H144.5V8.5Z" fill="currentColor" />
|
||||
<path d="M136.5 0H112.5V41.5H120.5V8.5H136.5V0Z" fill="currentColor" />
|
||||
<path d="M80.5 0H104.5V8.5H88.5V16.5H104.5V25H88.5V33H104.5V41.5H80.5V0Z" fill="currentColor" />
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M40.5 0H72.5V41.5H48.5V49.5H40.5V0ZM64.5 8.5H48.5V33H64.5V8.5Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M0.5 0H32.5V41.5955H0.5V0ZM24.5 8.5H8.5V33H24.5V8.5Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path d="M152.5 0H176.5V8.5H160.5V33H176.5V41.5H152.5V0Z" fill="currentColor" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<svg
|
||||
width={size * (289 / 42)}
|
||||
height={size}
|
||||
viewBox="0 0 289 50"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...others}
|
||||
>
|
||||
<path d="M8.5 16.5H24.5V33H8.5V16.5Z" fill="currentColor" fill-opacity="0.2" />
|
||||
<path d="M48.5 16.5H64.5V33H48.5V16.5Z" fill="currentColor" fill-opacity="0.2" />
|
||||
<path d="M120.5 16.5H136.5V33H120.5V16.5Z" fill="currentColor" fill-opacity="0.2" />
|
||||
<path d="M160.5 16.5H176.5V33H160.5V16.5Z" fill="currentColor" fill-opacity="0.2" />
|
||||
<path d="M192.5 16.5H208.5V33H192.5V16.5Z" fill="currentColor" fill-opacity="0.2" />
|
||||
<path d="M232.5 16.5H248.5V33H232.5V16.5Z" fill="currentColor" fill-opacity="0.2" />
|
||||
<path
|
||||
d="M264.5 0H288.5V8.5H272.5V16.5H288.5V25H272.5V33H288.5V41.5H264.5V0Z"
|
||||
fill="currentColor"
|
||||
fill-opacity="0.95"
|
||||
/>
|
||||
<path d="M248.5 0H224.5V41.5H248.5V33H232.5V8.5H248.5V0Z" fill="currentColor" fill-opacity="0.95" />
|
||||
<path d="M256.5 8.5H248.5V33H256.5V8.5Z" fill="currentColor" fill-opacity="0.95" />
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M184.5 0H216.5V41.5H184.5V0ZM208.5 8.5H192.5V33H208.5V8.5Z"
|
||||
fill="currentColor"
|
||||
fill-opacity="0.95"
|
||||
/>
|
||||
<path d="M144.5 8.5H136.5V41.5H144.5V8.5Z" fill="currentColor" fill-opacity="0.5" />
|
||||
<path d="M136.5 0H112.5V41.5H120.5V8.5H136.5V0Z" fill="currentColor" fill-opacity="0.5" />
|
||||
<path
|
||||
d="M80.5 0H104.5V8.5H88.5V16.5H104.5V25H88.5V33H104.5V41.5H80.5V0Z"
|
||||
fill="currentColor"
|
||||
fill-opacity="0.5"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M40.5 0H72.5V41.5H48.5V49.5H40.5V0ZM64.5 8.5H48.5V33H64.5V8.5Z"
|
||||
fill="currentColor"
|
||||
fill-opacity="0.5"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M0.5 0H32.5V41.5955H0.5V0ZM24.5 8.5H8.5V33H24.5V8.5Z"
|
||||
fill="currentColor"
|
||||
fill-opacity="0.5"
|
||||
/>
|
||||
<path d="M152.5 0H176.5V8.5H160.5V33H176.5V41.5H152.5V0Z" fill="currentColor" fill-opacity="0.95" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
71
packages/app/src/ui/tabs.tsx
Normal file
71
packages/app/src/ui/tabs.tsx
Normal file
@@ -0,0 +1,71 @@
|
||||
import { Tabs as KobalteTabs } from "@kobalte/core/tabs"
|
||||
import { splitProps } from "solid-js"
|
||||
import type { ComponentProps, ParentProps } from "solid-js"
|
||||
|
||||
export interface TabsProps extends ComponentProps<typeof KobalteTabs> {}
|
||||
export interface TabsListProps extends ComponentProps<typeof KobalteTabs.List> {}
|
||||
export interface TabsTriggerProps extends ComponentProps<typeof KobalteTabs.Trigger> {}
|
||||
export interface TabsContentProps extends ComponentProps<typeof KobalteTabs.Content> {}
|
||||
|
||||
function TabsRoot(props: TabsProps) {
|
||||
return <KobalteTabs {...props} />
|
||||
}
|
||||
|
||||
function TabsList(props: TabsListProps) {
|
||||
const [local, others] = splitProps(props, ["class"])
|
||||
return (
|
||||
<KobalteTabs.List
|
||||
classList={{
|
||||
"relative flex items-center bg-background overflow-x-auto no-scrollbar": true,
|
||||
"divide-x divide-border-subtle/40": true,
|
||||
"after:content-[''] after:block after:grow after:h-9": true,
|
||||
"after:border-l empty:after:border-l-0! after:border-b after:border-border-subtle/40": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TabsTrigger(props: ParentProps<TabsTriggerProps>) {
|
||||
const [local, others] = splitProps(props, ["class", "children"])
|
||||
return (
|
||||
<KobalteTabs.Trigger
|
||||
classList={{
|
||||
"relative px-3 h-9 flex items-center": true,
|
||||
"text-sm font-medium text-text-muted/60 cursor-pointer": true,
|
||||
"whitespace-nowrap shrink-0 border-b border-border-subtle/40": true,
|
||||
"disabled:pointer-events-none disabled:opacity-50": true,
|
||||
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring": true,
|
||||
"data-[selected]:text-text data-[selected]:bg-background-panel": true,
|
||||
"data-[selected]:!border-b-transparent": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
>
|
||||
{local.children}
|
||||
</KobalteTabs.Trigger>
|
||||
)
|
||||
}
|
||||
|
||||
function TabsContent(props: ParentProps<TabsContentProps>) {
|
||||
const [local, others] = splitProps(props, ["class", "children"])
|
||||
return (
|
||||
<KobalteTabs.Content
|
||||
classList={{
|
||||
"bg-background-panel overflow-y-auto h-full no-scrollbar": true,
|
||||
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring": true,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
{...others}
|
||||
>
|
||||
{local.children}
|
||||
</KobalteTabs.Content>
|
||||
)
|
||||
}
|
||||
|
||||
export const Tabs = Object.assign(TabsRoot, {
|
||||
List: TabsList,
|
||||
Trigger: TabsTrigger,
|
||||
Content: TabsContent,
|
||||
})
|
||||
56
packages/app/src/ui/tooltip.tsx
Normal file
56
packages/app/src/ui/tooltip.tsx
Normal file
@@ -0,0 +1,56 @@
|
||||
import { Tooltip as KobalteTooltip } from "@kobalte/core/tooltip"
|
||||
import { children, createEffect, createSignal, splitProps } from "solid-js"
|
||||
import type { ComponentProps } from "solid-js"
|
||||
|
||||
export interface TooltipProps extends ComponentProps<typeof KobalteTooltip> {
|
||||
value: string | (() => string)
|
||||
class?: string
|
||||
}
|
||||
|
||||
export function Tooltip(props: TooltipProps) {
|
||||
const [open, setOpen] = createSignal(false)
|
||||
const [local, others] = splitProps(props, ["class", "children"])
|
||||
|
||||
const c = children(() => local.children)
|
||||
|
||||
createEffect(() => {
|
||||
const childElements = c()
|
||||
if (childElements instanceof HTMLElement) {
|
||||
childElements.addEventListener("focus", () => setOpen(true))
|
||||
childElements.addEventListener("blur", () => setOpen(false))
|
||||
} else if (Array.isArray(childElements)) {
|
||||
for (const child of childElements) {
|
||||
if (child instanceof HTMLElement) {
|
||||
child.addEventListener("focus", () => setOpen(true))
|
||||
child.addEventListener("blur", () => setOpen(false))
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
return (
|
||||
<KobalteTooltip forceMount {...others} open={open()} onOpenChange={setOpen}>
|
||||
<KobalteTooltip.Trigger as={"div"}>{c()}</KobalteTooltip.Trigger>
|
||||
<KobalteTooltip.Portal>
|
||||
<KobalteTooltip.Content
|
||||
classList={{
|
||||
"z-50 max-w-[320px] rounded-md bg-background-element px-2 py-1": true,
|
||||
"text-xs font-medium text-text shadow-md pointer-events-none!": true,
|
||||
"transition-all duration-150 ease-out": true,
|
||||
"transform-gpu transform-origin-[var(--kb-tooltip-content-transform-origin)]": true,
|
||||
"data-closed:opacity-0": true,
|
||||
"data-expanded:opacity-100 data-expanded:translate-y-0 data-expanded:translate-x-0": true,
|
||||
"data-closed:translate-y-1": props.placement === "top",
|
||||
"data-closed:-translate-y-1": props.placement === "bottom",
|
||||
"data-closed:translate-x-1": props.placement === "left",
|
||||
"data-closed:-translate-x-1": props.placement === "right",
|
||||
[local.class ?? ""]: !!local.class,
|
||||
}}
|
||||
>
|
||||
{typeof others.value === "function" ? others.value() : others.value}
|
||||
<KobalteTooltip.Arrow size={18} />
|
||||
</KobalteTooltip.Content>
|
||||
</KobalteTooltip.Portal>
|
||||
</KobalteTooltip>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user