chore: import upstream snapshot with attribution
This commit is contained in:
wehub-resource-sync
@@ -0,0 +1,25 @@
|
||||
{
|
||||
"app_name": "Leon",
|
||||
"sections": [
|
||||
{
|
||||
"title": "BREAKING CHANGES",
|
||||
"grep": "BREAKING"
|
||||
},
|
||||
{
|
||||
"title": "Features",
|
||||
"grep": "^feat"
|
||||
},
|
||||
{
|
||||
"title": "Bug Fixes",
|
||||
"grep": "^fix"
|
||||
},
|
||||
{
|
||||
"title": "Performance Improvements",
|
||||
"grep": "^perf"
|
||||
},
|
||||
{
|
||||
"title": "Documentation Changes",
|
||||
"grep": "^docs"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
# EditorConfig is awesome: https://EditorConfig.org
|
||||
|
||||
# top-most EditorConfig file
|
||||
root = true
|
||||
|
||||
# Unix-style newlines with a newline ending every file
|
||||
[*]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
|
||||
[*.py]
|
||||
indent_size = 4
|
||||
+45
@@ -0,0 +1,45 @@
|
||||
# Leon profile secrets.
|
||||
# Non-secret profile configuration lives in config.yml.
|
||||
|
||||
# LLM provider API keys
|
||||
|
||||
# Optional local llama.cpp API key
|
||||
LEON_LLAMACPP_API_KEY=
|
||||
|
||||
# Optional Linux high-performance local provider API key (OpenAI-compatible)
|
||||
LEON_SGLANG_API_KEY=
|
||||
|
||||
# OpenRouter API key
|
||||
LEON_OPENROUTER_API_KEY=
|
||||
|
||||
# Z.AI API key
|
||||
LEON_ZAI_API_KEY=
|
||||
|
||||
# MiniMax API key
|
||||
LEON_MINIMAX_API_KEY=
|
||||
|
||||
# OpenAI API key
|
||||
LEON_OPENAI_API_KEY=
|
||||
|
||||
# Anthropic API key
|
||||
LEON_ANTHROPIC_API_KEY=
|
||||
|
||||
# Moonshot AI API key
|
||||
LEON_MOONSHOTAI_API_KEY=
|
||||
|
||||
# HuggingFace API key
|
||||
LEON_HUGGINGFACE_API_KEY=
|
||||
|
||||
# Cerebras API key
|
||||
LEON_CEREBRAS_API_KEY=
|
||||
|
||||
# Groq API key
|
||||
LEON_GROQ_API_KEY=
|
||||
|
||||
# Misc
|
||||
|
||||
# Optional token required by LeonClientInterface when client_interface.auth.enabled=true
|
||||
LEON_CLIENT_INTERFACE_TOKEN=
|
||||
|
||||
# Optional token required by HTTP plugins when http_plugins.auth.enabled=true
|
||||
LEON_HTTP_PLUGIN_TOKEN=
|
||||
@@ -0,0 +1,76 @@
|
||||
# Contributor Covenant Code of Conduct
|
||||
|
||||
## Our Pledge
|
||||
|
||||
In the interest of fostering an open and welcoming environment, we as
|
||||
contributors and maintainers pledge to making participation in our project and
|
||||
our community a harassment-free experience for everyone, regardless of age, body
|
||||
size, disability, ethnicity, sex characteristics, gender identity and expression,
|
||||
level of experience, education, socio-economic status, nationality, personal
|
||||
appearance, race, religion, or sexual identity and orientation.
|
||||
|
||||
## Our Standards
|
||||
|
||||
Examples of behavior that contributes to creating a positive environment
|
||||
include:
|
||||
|
||||
- Using welcoming and inclusive language
|
||||
- Being respectful of differing viewpoints and experiences
|
||||
- Gracefully accepting constructive criticism
|
||||
- Focusing on what is best for the community
|
||||
- Showing empathy towards other community members
|
||||
|
||||
Examples of unacceptable behavior by participants include:
|
||||
|
||||
- The use of sexualized language or imagery and unwelcome sexual attention or
|
||||
advances
|
||||
- Trolling, insulting/derogatory comments, and personal or political attacks
|
||||
- Public or private harassment
|
||||
- Publishing others' private information, such as a physical or electronic
|
||||
address, without explicit permission
|
||||
- Other conduct which could reasonably be considered inappropriate in a
|
||||
professional setting
|
||||
|
||||
## Our Responsibilities
|
||||
|
||||
Project maintainers are responsible for clarifying the standards of acceptable
|
||||
behavior and are expected to take appropriate and fair corrective action in
|
||||
response to any instances of unacceptable behavior.
|
||||
|
||||
Project maintainers have the right and responsibility to remove, edit, or
|
||||
reject comments, commits, code, wiki edits, issues, and other contributions
|
||||
that are not aligned to this Code of Conduct, or to ban temporarily or
|
||||
permanently any contributor for other behaviors that they deem inappropriate,
|
||||
threatening, offensive, or harmful.
|
||||
|
||||
## Scope
|
||||
|
||||
This Code of Conduct applies both within project spaces and in public spaces
|
||||
when an individual is representing the project or its community. Examples of
|
||||
representing a project or community include using an official project e-mail
|
||||
address, posting via an official social media account, or acting as an appointed
|
||||
representative at an online or offline event. Representation of a project may be
|
||||
further defined and clarified by project maintainers.
|
||||
|
||||
## Enforcement
|
||||
|
||||
Instances of abusive, harassing, or otherwise unacceptable behavior may be
|
||||
reported by contacting the project team at <louis@getleon.ai>. All
|
||||
complaints will be reviewed and investigated and will result in a response that
|
||||
is deemed necessary and appropriate to the circumstances. The project team is
|
||||
obligated to maintain confidentiality with regard to the reporter of an incident.
|
||||
Further details of specific enforcement policies may be posted separately.
|
||||
|
||||
Project maintainers who do not follow or enforce the Code of Conduct in good
|
||||
faith may face temporary or permanent repercussions as determined by other
|
||||
members of the project's leadership.
|
||||
|
||||
## Attribution
|
||||
|
||||
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
|
||||
available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
|
||||
|
||||
[homepage]: https://www.contributor-covenant.org
|
||||
|
||||
For answers to common questions about this code of conduct, see
|
||||
https://www.contributor-covenant.org/faq
|
||||
@@ -0,0 +1,197 @@
|
||||
# Contributing
|
||||
|
||||
Thanks a lot for your interest in contributing to Leon! :heart:
|
||||
|
||||
**Leon needs open source to live**, the more skills he has, the more skillful he becomes.
|
||||
|
||||
**Before submitting your contribution**, please take a moment to review this document.
|
||||
|
||||
Please note we have a [code of conduct](https://github.com/leon-ai/leon/blob/develop/.github/CODE_OF_CONDUCT.md), please follow it in all your interactions with the project.
|
||||
|
||||
## How You Can Help
|
||||
|
||||
Here are few examples about how you could help on Leon, by:
|
||||
|
||||
- [Creating a new module](https://docs.getleon.ai/packages-modules).
|
||||
- [Working on new features](http://roadmap.getleon.ai) (what is in backlog or todo).
|
||||
- [Suggesting new ideas](https://github.com/leon-ai/leon/issues/new/choose).
|
||||
- [Reporting a bug](https://github.com/leon-ai/leon/issues/new?labels=bug&template=BUG.md).
|
||||
- [Improving the documentation](https://github.com/leon-ai/docs.getleon.ai) (translations, typos, better writing, etc.).
|
||||
- [Sponsoring Leon](http://sponsor.getleon.ai).
|
||||
|
||||
## Pull Requests
|
||||
|
||||
**Working on your first Pull Request?** You can learn how from this _free_ series [How to Contribute to an Open Source Project on GitHub](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github).
|
||||
|
||||
- **Please first discuss** the change you wish to make via [issue](https://github.com/leon-ai/leon/issues),
|
||||
email, or any other method with the owners of this repository before making a change.
|
||||
It might avoid a waste of your time.
|
||||
|
||||
- The `master` branch is actually used as a snapshot of the latest stable release. **Do not submit your PRs
|
||||
against the `master` branch**.
|
||||
|
||||
- Ensure your code **respect our coding standards** (cf. [.eslintrc.json](https://github.com/leon-ai/leon/blob/develop/.eslintrc.json)).
|
||||
To do so, you can run:
|
||||
|
||||
```sh
|
||||
pnpm run lint
|
||||
```
|
||||
|
||||
- Make sure your **code passes the tests**. You can run the tests via the following command:
|
||||
|
||||
```sh
|
||||
npm test
|
||||
```
|
||||
|
||||
If you're adding new features to Leon, please include tests.
|
||||
|
||||
## Development Setup
|
||||
|
||||
Choose the setup method you want to go for.
|
||||
|
||||
### Single-Click
|
||||
|
||||
Gitpod will automatically set up an environment and run an instance for you.
|
||||
|
||||
[](https://gitpod.io/#https://github.com/leon-ai/leon)
|
||||
|
||||
### Basic
|
||||
|
||||
```sh
|
||||
# Clone the repository
|
||||
git clone https://github.com/leon-ai/leon.git leon
|
||||
|
||||
# Go to the project root
|
||||
cd leon
|
||||
|
||||
# Install
|
||||
pnpm install
|
||||
|
||||
# Check the setup went well
|
||||
pnpm run check
|
||||
|
||||
# Run the development server
|
||||
pnpm run dev:server
|
||||
|
||||
# Run the development web app
|
||||
pnpm run dev:app
|
||||
```
|
||||
|
||||
## Versioning
|
||||
|
||||
- We use [Semantic Versioning](https://semver.org) for releases.
|
||||
|
||||
## Commits
|
||||
|
||||
The commit message guideline is adapted from the [AngularJS Git Commit Guidelines](https://github.com/angular/angular.js/blob/master/DEVELOPERS.md#-git-commit-guidelines).
|
||||
|
||||
### Types
|
||||
|
||||
Types define which kind of changes you made to the project.
|
||||
|
||||
| Types | Description |
|
||||
| -------- | -------------------------------------------------------------------------------------------------------- |
|
||||
| BREAKING | Changes including breaking changes. |
|
||||
| build | New build version. |
|
||||
| chore | Changes to the build process or auxiliary tools such as changelog generation. No production code change. |
|
||||
| ci | Changes related to continuous integration only (GitHub Actions, CircleCI, etc.). |
|
||||
| docs | Documentation only changes. |
|
||||
| feat | A new feature. |
|
||||
| fix | A bug fix. |
|
||||
| perf | A code change that improves performance. |
|
||||
| refactor | A code change that neither fixes a bug nor adds a feature. |
|
||||
| style | Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc.). |
|
||||
| test | Adding missing or correcting existing tests. |
|
||||
|
||||
### Scopes
|
||||
|
||||
Scopes define high-level nodes of Leon.
|
||||
|
||||
- bridge/python
|
||||
- bridge/nodejs
|
||||
- hotword
|
||||
- scripts
|
||||
- server
|
||||
- tcp server
|
||||
- web app
|
||||
- skill/skill_name
|
||||
|
||||
### Examples
|
||||
|
||||
```sh
|
||||
git commit -m "feat(server): awesome new server feature"
|
||||
git commit -m "docs(skill/leon): fix spelling"
|
||||
git commit -m "chore: split training script into awesome blocks"
|
||||
git commit -m "style(web app): remove chatbot useless parentheses"
|
||||
```
|
||||
|
||||
### GUI Clients
|
||||
|
||||
If you are using a GUI client such as GitKraken, you may need to disable the default Git executable to make sure to use your default shell.
|
||||
Otherwise you may encounter an error such as "npx not found".
|
||||
|
||||
## Sponsor
|
||||
|
||||
You can also contribute by [sponsoring Leon](http://sponsor.getleon.ai).
|
||||
|
||||
Please note that I dedicate most of my free time to Leon.
|
||||
|
||||
By sponsoring the project you make the project sustainable and faster to develop features.
|
||||
|
||||
The focus is not only limited to the activity you see on GitHub but also a lot of thinking about the direction of the project. Which is naturally related to the overall design, architecture, vision, learning process and so on...
|
||||
|
||||
## Contributing to the Python Bridge or TCP HttpServer
|
||||
|
||||
Leon makes use of two binaries, the Python bridge and the TCP server. These binaries are compiled from Python sources.
|
||||
|
||||
The Python bridge is used to communicate between the core and skills made with Python.
|
||||
|
||||
The TCP server is used to communicate between the core and third-party nodes, such as spaCy.
|
||||
|
||||
### Set Up the Python Environment
|
||||
|
||||
To contribute to these parts, you need to set up a Python environment running with a specific Python version and a specific Pipenv version.
|
||||
|
||||
It is recommended to use Pyenv to manage your Python versions.
|
||||
|
||||
If you are on GNU/Linux Ubuntu, you can run the following to install Pyenv, otherwise, please refer to the [Pyenv documentation to install it](https://github.com/pyenv/pyenv#installation):
|
||||
|
||||
```bash
|
||||
# Update registry
|
||||
sudo apt-get update
|
||||
|
||||
# Install Pyenv deps
|
||||
sudo apt-get install make build-essential libssl-dev zlib1g-dev \
|
||||
libbz2-dev libreadline-dev libsqlite3-dev wget curl llvm \
|
||||
libncursesw5-dev xz-utils tk-dev libxml2-dev libxmlsec1-dev libffi-dev liblzma-dev
|
||||
|
||||
# Install Pyenv
|
||||
curl https://pyenv.run | bash
|
||||
|
||||
# Add output lines to .bashrc
|
||||
|
||||
# Restart shell
|
||||
exec "$SHELL"
|
||||
```
|
||||
|
||||
Once Pyenv installed, run:
|
||||
|
||||
```bash
|
||||
# Install Python
|
||||
pyenv install 3.11.9 --force
|
||||
pyenv global 3.11.9
|
||||
```
|
||||
|
||||
Your Python environment should be ready now. Leon uses `uv` as the Python dependency standard, and `postinstall` provisions the Python bridge and TCP server environments automatically from `pyproject.toml`:
|
||||
|
||||
```bash
|
||||
# Run the Python bridge
|
||||
npm run python-bridge
|
||||
|
||||
# Run the TCP server
|
||||
npm run start:tcp-server
|
||||
```
|
||||
|
||||
## Spread the Word
|
||||
|
||||
Use [#LeonAI](<https://twitter.com/search?f=live&q=%23LeonAI%20(from%3Agrenlouis%20OR%20from%3Alouistiti_fr)&src=typed_query>) if you tweet about Leon and/or mention [@grenlouis](https://twitter.com/grenlouis).
|
||||
@@ -0,0 +1,8 @@
|
||||
# These are supported funding model platforms
|
||||
|
||||
github: [louistiti]
|
||||
patreon: # Replace with a single Patreon username
|
||||
open_collective: # Replace with a single Open Collective username
|
||||
ko_fi: # Replace with a single Ko-fi username
|
||||
tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
|
||||
custom: # http://sponsor.getleon.ai
|
||||
@@ -0,0 +1,27 @@
|
||||
---
|
||||
name: 🐞 Bug Report
|
||||
about: Report an unexpected problem or unintended behavior.
|
||||
labels: bug
|
||||
---
|
||||
|
||||
<!--
|
||||
Thanks for your interest in Leon! ❤️
|
||||
Please check if there is no similar issue before creating this one.
|
||||
If the bug is related to the setup, please submit the issue at: https://github.com/leon-ai/leon-cli/issues/new/choose
|
||||
-->
|
||||
|
||||
### Specs
|
||||
|
||||
- Leon version:
|
||||
- OS (or browser) version:
|
||||
- Node.js version:
|
||||
- Complete "leon check" (or "pnpm run check") output:
|
||||
- (optional) Leon skill version:
|
||||
|
||||
### Expected Behavior
|
||||
|
||||
### Actual Behavior
|
||||
|
||||
### How Do We Reproduce?
|
||||
|
||||
### Extra (like a sample repo to reproduce the issue, etc.)
|
||||
@@ -0,0 +1,23 @@
|
||||
---
|
||||
name: 📝 Documentation
|
||||
about: Are the docs missing, confusing, etc.? Tell us more about it.
|
||||
---
|
||||
|
||||
<!--
|
||||
Thanks for your interest in Leon! ❤️
|
||||
If it is related to https://docs.getleon.ai, please open an issue there: https://github.com/leon-ai/docs.getleon.ai/issues.
|
||||
Please check if there is no similar issue before creating this one.
|
||||
|
||||
Please place an x (no spaces - [x]) in all [ ] that apply.
|
||||
-->
|
||||
|
||||
### Documentation Is:
|
||||
|
||||
- [ ] Missing
|
||||
- [ ] Needed
|
||||
- [ ] Confusing
|
||||
- [ ] Not Sure?
|
||||
|
||||
### Explanation
|
||||
|
||||
### Proposal
|
||||
@@ -0,0 +1,14 @@
|
||||
---
|
||||
name: ✨ Feature Request
|
||||
about: Suggest a new feature idea.
|
||||
labels: feature request
|
||||
---
|
||||
|
||||
<!--
|
||||
Thanks for your interest in Leon! ❤️
|
||||
Please check if there is no similar issue before creating this one.
|
||||
-->
|
||||
|
||||
### Feature Use Case
|
||||
|
||||
### Feature Proposal
|
||||
@@ -0,0 +1,16 @@
|
||||
---
|
||||
name: 🔧 Improvement
|
||||
about: Suggest an idea which is not a feature.
|
||||
labels: improvement
|
||||
---
|
||||
|
||||
<!--
|
||||
Thanks for your interest in Leon! ❤️
|
||||
Please check if there is no similar issue before creating this one.
|
||||
-->
|
||||
|
||||
### Expected Behavior
|
||||
|
||||
### Actual Behavior
|
||||
|
||||
### Proposal
|
||||
@@ -0,0 +1,14 @@
|
||||
---
|
||||
name: ❓ Question
|
||||
about: Ask a question about Leon.
|
||||
labels: question
|
||||
---
|
||||
|
||||
<!--
|
||||
Thanks for your interest in Leon! ❤️
|
||||
Please check if there is no similar issue before creating this one.
|
||||
|
||||
Please ask one question per issue.
|
||||
-->
|
||||
|
||||
### Question
|
||||
@@ -0,0 +1,31 @@
|
||||
<!--
|
||||
|
||||
Thanks a lot for your interest in contributing to Leon! :heart:
|
||||
|
||||
Please first discuss the change you wish to make via issue,
|
||||
email, or any other method with the owners of this repository before making a change.
|
||||
It might avoid a waste of your time.
|
||||
|
||||
Before submitting your contribution, please take a moment to review this document:
|
||||
https://github.com/leon-ai/leon/blob/develop/.github/CONTRIBUTING.md
|
||||
|
||||
Please place an x (no spaces - [x]) in all [ ] that apply.
|
||||
|
||||
-->
|
||||
|
||||
### What type of change does this PR introduce?
|
||||
|
||||
- [ ] Bugfix
|
||||
- [ ] Feature
|
||||
- [ ] Refactor
|
||||
- [ ] Documentation
|
||||
- [ ] Not Sure?
|
||||
|
||||
### Does this PR introduce breaking changes?
|
||||
|
||||
- [ ] Yes
|
||||
- [ ] No
|
||||
|
||||
### List any relevant issue numbers:
|
||||
|
||||
### Description:
|
||||
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="301" height="70" fill="none" viewBox="0 0 301 70">
|
||||
<path fill="#000" d="M89.4844 43.5858c0 .8464-.1792 1.5933-.5377 2.2505-.3585.6573-.8564 1.1651-1.5137 1.5236-.6572.3585-1.3941.5378-2.2406.5378H81v6.1044h5.0787c1.912 0 3.6248-.4282 5.1484-1.2846 1.5236-.8564 2.7186-2.0415 3.585-3.5452.8663-1.5037 1.3045-3.1966 1.3045-5.0886V24.0178h-6.6322v19.568Zm17.8556-1.8224h13.891v-5.6065H107.34v-6.3633h15.355v-5.7758h-21.818v29.9743h22.246v-5.7757H107.34v-6.453Zm17.865-11.8005h8.882v24.0193h6.633V29.9629h8.842v-5.9451h-24.367v5.9551l.01-.01Zm47.022 9.0022c-.517-.2788-1.085-.4879-1.673-.6472.449-.1295.877-.2888 1.275-.488 1.096-.5676 1.962-1.3643 2.579-2.39.618-1.0257.936-2.2007.936-3.5351 0-1.5237-.418-2.8879-1.244-4.0929-.827-1.195-1.992-2.131-3.486-2.8082-1.494-.6672-3.206-1.0058-5.118-1.0058h-13.315v29.9743h13.574c2.011 0 3.804-.3485 5.387-1.0556 1.573-.707 2.798-1.6829 3.675-2.9476.866-1.2547 1.304-2.6887 1.304-4.302 0-1.4837-.338-2.8082-1.026-3.9833-.687-1.175-1.633-2.0812-2.858-2.7285l-.01.0099Zm-13.603-9.9184h5.886c.816 0 1.533.1494 2.161.4382.627.2888 1.115.707 1.464 1.2547.348.5378.527 1.1751.527 1.9021 0 .7269-.179 1.414-.527 1.9817-.349.5676-.837.9958-1.464 1.3045-.628.3087-1.345.4581-2.161.4581h-5.886v-7.3492.0099Zm10.138 18.134c-.378.5676-.916 1.0058-1.603 1.3145-.697.3087-1.484.4581-2.39.4581h-6.145v-7.6878h6.145c.886 0 1.673.1693 2.37.4979.687.3286 1.235.7867 1.613 1.3842.378.5975.578 1.2747.578 2.0414 0 .7668-.19 1.4241-.568 1.9917Zm29.596-5.3077c1.663-.7967 2.947-1.922 3.864-3.3659.916-1.444 1.374-3.117 1.374-5.0289 0-1.912-.448-3.5253-1.344-4.9592-.897-1.434-2.171-2.5394-3.814-3.3261-1.644-.7867-3.546-1.1751-5.717-1.1751h-13.124v29.9743h6.642V43.0779h4.322l6.084 10.9142h7.578l-6.851-11.7208c.339-.1195.677-.249.996-.3983h-.01Zm-2.151-6.1244c-.369.6274-.896 1.1154-1.583 1.444-.688.3386-1.494.5078-2.42.5078h-5.975v-8.2952h5.975c.926 0 1.732.1693 2.42.4979.687.3287 1.214.8166 1.583 1.434.368.6174.558 1.3544.558 2.1908 0 .8365-.19 1.5734-.558 2.2008v.0199Zm20.594-11.7308-10.706 29.9743h6.742l2.121-6.6122h11.114l2.27 6.6122h6.612L223.99 24.0178h-7.189Zm-.339 18.3431 3.445-10.5756.409-1.922.408 1.922 3.685 10.5756h-7.947Zm20.693 11.6312h6.851V24.0178h-6.851v29.9743Zm31.02-9.6993-12.896-20.275h-6.463v29.9743h6.055V33.7172l12.826 20.2749h6.533V24.0178h-6.055v20.275Zm31.528-3.3559c-.647-1.2448-1.564-2.2904-2.729-3.1369-1.165-.8464-2.509-1.4041-4.023-1.6929l-5.098-1.0456c-.797-.1892-1.434-.5178-1.902-.9958-.469-.478-.708-1.0755-.708-1.7825 0-.6473.17-1.205.518-1.683.339-.478.827-.8464 1.444-1.1153.618-.2689 1.335-.3983 2.151-.3983.817 0 1.554.1394 2.181.4182.627.2788 1.115.6672 1.464 1.1751s.528 1.0755.528 1.7228h6.642c-.04-1.7427-.528-3.2863-1.444-4.6207-.916-1.3443-2.201-2.3899-3.834-3.1468-1.633-.7568-3.505-1.1352-5.597-1.1352-2.091 0-3.943.3884-5.566 1.1751-1.623.7867-2.898 1.8721-3.804 3.2663-.906 1.3941-1.364 2.9775-1.364 4.76 0 1.444.288 2.7485.876 3.9036.587 1.1652 1.414 2.1311 2.479 2.8979 1.076.7668 2.311 1.3045 3.725 1.6033l5.397 1.1153c.886.2091 1.584.5975 2.101 1.1551.518.5577.767 1.2448.767 2.0813 0 .6672-.189 1.2747-.567 1.8025-.379.5277-.907.936-1.584 1.2248-.677.2888-1.474.4282-2.39.4282-.916 0-1.782-.1593-2.529-.478-.747-.3186-1.325-.7767-1.733-1.3742-.418-.5875-.617-1.2747-.617-2.0414h-6.642c.029 1.8721.527 3.5152 1.513 4.9492.976 1.424 2.32 2.5394 4.033 3.336 1.713.7967 3.675 1.195 5.886 1.195 2.21 0 4.202-.4083 5.915-1.2249 1.723-.8165 3.057-1.9418 4.023-3.3758.966-1.434 1.444-3.0572 1.444-4.8696 0-1.4838-.329-2.848-.976-4.1028l.02.01Z"/>
|
||||
<path fill="#000" fill-rule="evenodd" d="M6.83994 69.9901H37.9378V70c3.9071 0 7.5856-1.5308 10.3693-4.2942l17.398-17.3957C68.4391 45.5765 70 41.7992 70 37.9423V6.83897C70 3.06163 66.928 0 63.1601 0H32.0523c-3.8972 0-7.5856 1.53082-10.3594 4.29424L4.29484 21.6799C1.56086 24.4135 0 28.1909 0 32.0477v31.1034c0 3.7773 3.07201 6.839 6.83994 6.839ZM11.5583 19 23.9795 6.58052c2.1674-2.15706 5.0306-3.33996 8.0728-3.33996h31.1078c1.9883 0 3.5989 1.62028 3.5989 3.59841V37.9423c0 3.002-1.2129 5.9444-3.3405 8.0716L51 58.4307V19H11.5583ZM11 19.5582V59h39.4306l-4.4101 4.4095c-2.1574 2.1472-5.0306 3.34-8.0728 3.34H6.83994c-1.98836 0-3.59892-1.6203-3.59892-3.5984V32.0477c0-3.002 1.21289-5.9443 3.34043-8.0716L11 19.5582ZM33 50H16v4h17v-4Z" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.2 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="298" height="64" fill="none" viewBox="0 0 298 64">
|
||||
<path fill="#fff" d="M86.484 40.586c0 .846-.179 1.593-.537 2.25a3.718 3.718 0 0 1-1.514 1.524c-.657.358-1.394.538-2.24.538H78v6.104h5.079c1.912 0 3.625-.428 5.148-1.285a9.36 9.36 0 0 0 3.585-3.545c.866-1.503 1.305-3.196 1.305-5.088V21.018h-6.633v19.568Zm17.856-1.823h13.891v-5.606H104.34v-6.363h15.355v-5.776H97.877v29.974h22.246v-5.776H104.34v-6.453Zm17.865-11.8h8.882v24.02h6.633v-24.02h8.842v-5.945h-24.367v5.955l.01-.01Zm47.022 9.002a7.85 7.85 0 0 0-1.673-.647 7.47 7.47 0 0 0 1.275-.488c1.096-.568 1.962-1.364 2.579-2.39.618-1.026.936-2.2.936-3.535 0-1.524-.418-2.888-1.244-4.093-.827-1.195-1.992-2.131-3.486-2.808-1.494-.668-3.206-1.006-5.118-1.006h-13.315v29.974h13.574c2.011 0 3.804-.348 5.387-1.055 1.573-.707 2.798-1.683 3.675-2.948.866-1.255 1.304-2.689 1.304-4.302 0-1.484-.338-2.808-1.026-3.983a7.05 7.05 0 0 0-2.858-2.729l-.01.01Zm-13.603-9.918h5.886c.816 0 1.533.15 2.161.438a3.353 3.353 0 0 1 1.464 1.255c.348.537.527 1.175.527 1.902 0 .727-.179 1.414-.527 1.981-.349.568-.837.996-1.464 1.305-.628.309-1.345.458-2.161.458h-5.886v-7.35.01Zm10.138 18.134c-.378.567-.916 1.006-1.603 1.314-.697.309-1.484.458-2.39.458h-6.145v-7.688h6.145c.886 0 1.673.17 2.37.498.687.329 1.235.787 1.613 1.385.378.597.578 1.274.578 2.041 0 .767-.19 1.424-.568 1.992Zm29.596-5.308c1.663-.797 2.947-1.922 3.864-3.366.916-1.444 1.374-3.117 1.374-5.029s-.448-3.525-1.344-4.959c-.897-1.434-2.171-2.54-3.814-3.326-1.644-.787-3.546-1.175-5.717-1.175h-13.124v29.974h6.642V40.078h4.322l6.084 10.914h7.578l-6.851-11.72c.339-.12.677-.25.996-.399h-.01Zm-2.151-6.124a3.599 3.599 0 0 1-1.583 1.444c-.688.338-1.494.507-2.42.507h-5.975v-8.295h5.975c.926 0 1.732.17 2.42.498a3.637 3.637 0 0 1 1.583 1.434c.368.617.558 1.355.558 2.19 0 .837-.19 1.574-.558 2.202v.02Zm20.594-11.731-10.706 29.974h6.742l2.121-6.612h11.114l2.27 6.612h6.612L220.99 21.018h-7.189Zm-.339 18.343 3.445-10.576.409-1.922.408 1.922 3.685 10.576h-7.947Zm20.693 11.631h6.851V21.018h-6.851v29.974Zm31.02-9.7-12.896-20.274h-6.463v29.974h6.055V30.717l12.826 20.275h6.533V21.018h-6.055v20.275Zm31.528-3.355c-.647-1.245-1.564-2.29-2.729-3.137-1.165-.846-2.509-1.404-4.023-1.693l-5.098-1.045c-.797-.19-1.434-.518-1.902-.996-.469-.478-.708-1.076-.708-1.783 0-.647.17-1.205.518-1.683.339-.478.827-.846 1.444-1.115.618-.269 1.335-.398 2.151-.398.817 0 1.554.139 2.181.418.627.279 1.115.667 1.464 1.175a2.96 2.96 0 0 1 .528 1.723h6.642c-.04-1.743-.528-3.287-1.444-4.621-.916-1.344-2.201-2.39-3.834-3.147-1.633-.757-3.505-1.135-5.597-1.135-2.091 0-3.943.388-5.566 1.175-1.623.787-2.898 1.872-3.804 3.266-.906 1.395-1.364 2.978-1.364 4.76 0 1.444.288 2.749.876 3.904a7.908 7.908 0 0 0 2.479 2.898c1.076.767 2.311 1.304 3.725 1.603l5.397 1.115c.886.21 1.584.598 2.101 1.156.518.557.767 1.244.767 2.08a3.03 3.03 0 0 1-.567 1.803c-.379.528-.907.936-1.584 1.225-.677.289-1.474.428-2.39.428-.916 0-1.782-.159-2.529-.478-.747-.318-1.325-.776-1.733-1.374-.418-.587-.617-1.275-.617-2.041h-6.642c.029 1.872.527 3.515 1.513 4.949.976 1.424 2.32 2.54 4.033 3.336 1.713.797 3.675 1.195 5.886 1.195 2.21 0 4.202-.408 5.915-1.225 1.723-.816 3.057-1.942 4.023-3.376.966-1.434 1.444-3.057 1.444-4.87 0-1.483-.329-2.847-.976-4.102l.02.01ZM13 47h17v4H13v-4Z"/>
|
||||
<path fill="#fff" fill-rule="evenodd" d="M20.34 3.66 8 16l-4.34 4.34A12.504 12.504 0 0 0 0 29.18V59c0 2.76 2.24 5 5 5h29.82c3.32 0 6.49-1.32 8.84-3.66L48 56l12.34-12.34c2.34-2.34 3.66-5.52 3.66-8.84V5c0-2.76-2.24-5-5-5H29.18c-3.32 0-6.49 1.32-8.84 3.66ZM48 56V16H8v40h40Z" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.5 KiB |
@@ -0,0 +1,43 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" version="1.1" width="180" height="70" viewBox="0 0 1525.6 589.8">
|
||||
<defs>
|
||||
<style>
|
||||
.st0 {
|
||||
fill: #fe9000;
|
||||
}
|
||||
|
||||
.st1 {
|
||||
fill: #fff;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<g>
|
||||
<rect class="st0" x="281" y="444.8" width="29" height="145"/>
|
||||
<rect class="st0" x="280" width="29" height="145"/>
|
||||
<rect class="st0" x="153.1" y="491.6" width="145" height="29" transform="translate(-325.8 560.4) rotate(-71.6)"/>
|
||||
<rect class="st0" x="90.9" y="460.1" width="145" height="29" transform="translate(-316.6 327.8) rotate(-54)"/>
|
||||
<rect class="st0" x="41.9" y="409.9" width="145" height="29" transform="translate(-225.7 145.9) rotate(-35.6)"/>
|
||||
<rect class="st0" x="10.4" y="348.3" width="145" height="29" transform="translate(-108.1 43.4) rotate(-18)"/>
|
||||
<rect class="st0" y="279.8" width="145" height="29"/>
|
||||
<rect class="st0" x="68.3" y="153.9" width="29" height="145" transform="translate(-158.1 235.1) rotate(-72)"/>
|
||||
<rect class="st0" x="99.7" y="91.3" width="29" height="145" transform="translate(-85.4 158.9) rotate(-53.7)"/>
|
||||
<rect class="st0" x="211.1" y="10.8" width="29" height="145" transform="translate(-14.7 74.2) rotate(-18.1)"/>
|
||||
<rect class="st0" x="149.6" y="41.3" width="29" height="145" transform="translate(-35.5 119.2) rotate(-36.3)"/>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path class="st1" d="M349,307.4c-.8-20.3-1.5-44.5-1.5-69.3h-.5c-5.5,21.5-12.5,45.5-19,65.3l-20.5,65.8h-29.8l-18-65.2c-5.5-19.8-11-43.5-15.2-65.8h-.5c-.8,22.8-1.8,48.8-2.8,69.8l-3.2,64h-35.2l10.8-168.5h50.8l16.5,56.2c5.5,19.5,10.5,40.5,14.2,60.3h1c4.5-19.5,10.2-41.8,16-60.5l17.8-56h50l9,168.5h-37l-2.9-64.6h0Z"/>
|
||||
<path class="st1" d="M518.5,342.4c0,11.5.5,22.8,2,29.5h-34.2l-2.2-12.2h-.8c-8,9.8-20.5,15-35,15-24.8,0-39.5-18-39.5-37.5,0-31.8,28.5-46.8,71.8-46.8v-1.5c0-6.5-3.5-15.8-22.2-15.8s-25.8,4.2-33.8,9l-7-24.2c8.5-4.8,25.2-11,47.5-11,40.8,0,53.5,24,53.5,52.8v42.7h0ZM481.8,314.1c-20,0-35.5,4.8-35.5,19.2s6.5,14.5,15,14.5,17.2-6.2,19.8-14c.5-2,.8-4.2.8-6.5v-13.2h0Z"/>
|
||||
<path class="st1" d="M640.5,368.6c-6.8,3.2-19.5,5.8-34,5.8-39.5,0-64.8-24.2-64.8-62.5s24.5-64.8,70-64.8,21,1.8,29,4.8l-6,28.2c-4.5-2-11.2-3.8-21.2-3.8-20,0-33,14.3-32.8,34,0,22.5,15,34.2,33.5,34.2s16-1.5,21.8-4l4.5,28.1h0Z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path class="st1" d="M687.5,345.4c9.8,6,24,11,39,11,22.2,0,35.2-11.8,35.2-28.8s-9-24.8-31.8-33.5c-27.5-9.8-44.5-24-44.5-47.8s21.8-45.8,54.5-45.8,29.7,4,37.2,8.2l-6,17.8c-5.5-3-16.7-8-32-8-23,0-31.8,13.8-31.8,25.2s10.2,23.5,33.5,32.5c28.5,11,43,24.8,43,49.5s-19.2,48.5-59,48.5-34-4.8-43-10.8l5.7-18h0Z"/>
|
||||
<path class="st1" d="M838.8,222v28.8h31.5v16.8h-31.5v65.2c0,15,4.2,23.5,16.5,23.5s10-.8,12.8-1.5l1,16.5c-4.2,1.8-11,3-19.5,3s-18.5-3.2-23.8-9.2c-6.2-6.5-8.5-17.2-8.5-31.5v-66h-18.8v-16.8h18.8v-22.3l21.5-6.5h0Z"/>
|
||||
<path class="st1" d="M962,371.9l-1.8-15.2h-.8c-6.8,9.5-19.8,18-37,18-24.5,0-37-17.2-37-34.8,0-29.2,26-45.2,72.8-45v-2.5c0-10-2.8-28-27.5-28s-23,3.5-31.5,9l-5-14.5c10-6.5,24.5-10.8,39.8-10.8,37,0,46,25.2,46,49.5v45.2c0,10.5.5,20.8,2,29h-20ZM958.8,310.1c-24-.5-51.2,3.8-51.2,27.2s9.5,21,20.8,21,25.8-10,29.2-20.2c.8-2.2,1.2-4.8,1.2-7v-21h0Z"/>
|
||||
<path class="st1" d="M1120,194.4v146.2c0,10.8.2,23,1,31.2h-19.8l-1-21h-.5c-6.8,13.5-21.5,23.8-41.2,23.8-29.2,0-51.8-24.8-51.8-61.5-.2-40.2,24.8-65,54.2-65s31,8.8,36.5,18.5h.5v-72.2h22.1ZM1098,300.1c0-2.8-.2-6.5-1-9.2-3.2-14-15.2-25.5-31.8-25.5s-36.2,20-36.2,46.8,12,44.8,35.8,44.8,28.2-9.8,32.2-26.2c.8-3,1-6,1-9.5v-21.2h0Z"/>
|
||||
<path class="st1" d="M1181,216.9c.2,7.5-5.2,13.5-14,13.5s-13.2-6-13.2-13.5,5.8-13.8,13.8-13.8,13.4,6,13.4,13.8h0ZM1156.5,371.9v-121h22v121h-22Z"/>
|
||||
<path class="st1" d="M1316.3,338.9c0,12.5.2,23.5,1,33h-19.5l-1.2-19.8h-.5c-5.8,9.8-18.5,22.5-40,22.5s-41.8-10.5-41.8-53v-70.8h22v67c0,23,7,38.5,27,38.5s25-10.2,29-20c1.2-3.2,2-7.2,2-11.2v-74.2h22v88h0Z"/>
|
||||
<path class="st1" d="M1352.8,283.6c0-12.5-.2-22.8-1-32.8h19.2l1,19.5h.8c6.8-11.5,18-22.2,38-22.2s29,10,34.2,24.2h.5c3.8-6.8,8.5-12,13.5-15.8,7.2-5.5,15.2-8.5,26.8-8.5s39.8,10.5,39.8,52.5v71.2h-21.6v-68.5c0-23.2-8.5-37.2-26.2-37.2s-22.2,9.2-26,20c-1,3-1.8,7-1.8,11v74.8h-21.5v-72.5c0-19.2-8.5-33.2-25.2-33.2s-23.8,11-27.2,22c-1.2,3.2-1.8,7-1.8,10.8v73h-21.5v-88.3h0Z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.2 KiB |
@@ -0,0 +1,43 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" version="1.1" width="180" height="70" viewBox="0 0 1525.6 589.8">
|
||||
<defs>
|
||||
<style>
|
||||
.st0 {
|
||||
fill: #fe9000;
|
||||
}
|
||||
|
||||
.st1 {
|
||||
fill: #111;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<g>
|
||||
<rect class="st0" x="281" y="444.8" width="29" height="145"/>
|
||||
<rect class="st0" x="280" width="29" height="145"/>
|
||||
<rect class="st0" x="153.1" y="491.6" width="145" height="29" transform="translate(-325.8 560.4) rotate(-71.6)"/>
|
||||
<rect class="st0" x="90.9" y="460.1" width="145" height="29" transform="translate(-316.6 327.8) rotate(-54)"/>
|
||||
<rect class="st0" x="41.9" y="409.9" width="145" height="29" transform="translate(-225.7 145.9) rotate(-35.6)"/>
|
||||
<rect class="st0" x="10.4" y="348.3" width="145" height="29" transform="translate(-108.1 43.4) rotate(-18)"/>
|
||||
<rect class="st0" y="279.8" width="145" height="29"/>
|
||||
<rect class="st0" x="68.3" y="153.9" width="29" height="145" transform="translate(-158.1 235.1) rotate(-72)"/>
|
||||
<rect class="st0" x="99.7" y="91.3" width="29" height="145" transform="translate(-85.4 158.9) rotate(-53.7)"/>
|
||||
<rect class="st0" x="211.1" y="10.8" width="29" height="145" transform="translate(-14.7 74.2) rotate(-18.1)"/>
|
||||
<rect class="st0" x="149.6" y="41.3" width="29" height="145" transform="translate(-35.5 119.2) rotate(-36.3)"/>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path class="st1" d="M349,307.4c-.8-20.3-1.5-44.5-1.5-69.3h-.5c-5.5,21.5-12.5,45.5-19,65.3l-20.5,65.8h-29.8l-18-65.2c-5.5-19.8-11-43.5-15.2-65.8h-.5c-.8,22.8-1.8,48.8-2.8,69.8l-3.2,64h-35.2l10.8-168.5h50.8l16.5,56.2c5.5,19.5,10.5,40.5,14.2,60.3h1c4.5-19.5,10.2-41.8,16-60.5l17.8-56h50l9,168.5h-37l-2.9-64.6h0Z"/>
|
||||
<path class="st1" d="M518.5,342.4c0,11.5.5,22.8,2,29.5h-34.2l-2.2-12.2h-.8c-8,9.8-20.5,15-35,15-24.8,0-39.5-18-39.5-37.5,0-31.8,28.5-46.8,71.8-46.8v-1.5c0-6.5-3.5-15.8-22.2-15.8s-25.8,4.2-33.8,9l-7-24.2c8.5-4.8,25.2-11,47.5-11,40.8,0,53.5,24,53.5,52.8v42.7h0ZM481.8,314.1c-20,0-35.5,4.8-35.5,19.2s6.5,14.5,15,14.5,17.2-6.2,19.8-14c.5-2,.8-4.2.8-6.5v-13.2h0Z"/>
|
||||
<path class="st1" d="M640.5,368.6c-6.8,3.2-19.5,5.8-34,5.8-39.5,0-64.8-24.2-64.8-62.5s24.5-64.8,70-64.8,21,1.8,29,4.8l-6,28.2c-4.5-2-11.2-3.8-21.2-3.8-20,0-33,14.3-32.8,34,0,22.5,15,34.2,33.5,34.2s16-1.5,21.8-4l4.5,28.1h0Z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path class="st1" d="M687.5,345.4c9.8,6,24,11,39,11,22.2,0,35.2-11.8,35.2-28.8s-9-24.8-31.8-33.5c-27.5-9.8-44.5-24-44.5-47.8s21.8-45.8,54.5-45.8,29.7,4,37.2,8.2l-6,17.8c-5.5-3-16.7-8-32-8-23,0-31.8,13.8-31.8,25.2s10.2,23.5,33.5,32.5c28.5,11,43,24.8,43,49.5s-19.2,48.5-59,48.5-34-4.8-43-10.8l5.7-18h0Z"/>
|
||||
<path class="st1" d="M838.8,222v28.8h31.5v16.8h-31.5v65.2c0,15,4.2,23.5,16.5,23.5s10-.8,12.8-1.5l1,16.5c-4.2,1.8-11,3-19.5,3s-18.5-3.2-23.8-9.2c-6.2-6.5-8.5-17.2-8.5-31.5v-66h-18.8v-16.8h18.8v-22.3l21.5-6.5h0Z"/>
|
||||
<path class="st1" d="M962,371.9l-1.8-15.2h-.8c-6.8,9.5-19.8,18-37,18-24.5,0-37-17.2-37-34.8,0-29.2,26-45.2,72.8-45v-2.5c0-10-2.8-28-27.5-28s-23,3.5-31.5,9l-5-14.5c10-6.5,24.5-10.8,39.8-10.8,37,0,46,25.2,46,49.5v45.2c0,10.5.5,20.8,2,29h-20ZM958.8,310.1c-24-.5-51.2,3.8-51.2,27.2s9.5,21,20.8,21,25.8-10,29.2-20.2c.8-2.2,1.2-4.8,1.2-7v-21h0Z"/>
|
||||
<path class="st1" d="M1120,194.4v146.2c0,10.8.2,23,1,31.2h-19.8l-1-21h-.5c-6.8,13.5-21.5,23.8-41.2,23.8-29.2,0-51.8-24.8-51.8-61.5-.2-40.2,24.8-65,54.2-65s31,8.8,36.5,18.5h.5v-72.2h22.1ZM1098,300.1c0-2.8-.2-6.5-1-9.2-3.2-14-15.2-25.5-31.8-25.5s-36.2,20-36.2,46.8,12,44.8,35.8,44.8,28.2-9.8,32.2-26.2c.8-3,1-6,1-9.5v-21.2h0Z"/>
|
||||
<path class="st1" d="M1181,216.9c.2,7.5-5.2,13.5-14,13.5s-13.2-6-13.2-13.5,5.8-13.8,13.8-13.8,13.4,6,13.4,13.8h0ZM1156.5,371.9v-121h22v121h-22Z"/>
|
||||
<path class="st1" d="M1316.3,338.9c0,12.5.2,23.5,1,33h-19.5l-1.2-19.8h-.5c-5.8,9.8-18.5,22.5-40,22.5s-41.8-10.5-41.8-53v-70.8h22v67c0,23,7,38.5,27,38.5s25-10.2,29-20c1.2-3.2,2-7.2,2-11.2v-74.2h22v88h0Z"/>
|
||||
<path class="st1" d="M1352.8,283.6c0-12.5-.2-22.8-1-32.8h19.2l1,19.5h.8c6.8-11.5,18-22.2,38-22.2s29,10,34.2,24.2h.5c3.8-6.8,8.5-12,13.5-15.8,7.2-5.5,15.2-8.5,26.8-8.5s39.8,10.5,39.8,52.5v71.2h-21.6v-68.5c0-23.2-8.5-37.2-26.2-37.2s-22.2,9.2-26,20c-1,3-1.8,7-1.8,11v74.8h-21.5v-72.5c0-19.2-8.5-33.2-25.2-33.2s-23.8,11-27.2,22c-1.2,3.2-1.8,7-1.8,10.8v73h-21.5v-88.3h0Z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.2 KiB |
@@ -0,0 +1,15 @@
|
||||
<svg width="180" height="48" viewBox="220 230 1165 310" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1637_3573)">
|
||||
<path d="M358.8 240.1C293.02 240.1 239.2 293.92 239.2 359.7C239.2 425.48 293.02 479.3 358.8 479.3C424.58 479.3 478.4 425.812 478.4 359.7C478.4 293.587 424.912 240.1 358.8 240.1ZM358.8 436.443C317.937 436.443 285.046 402.889 285.046 359.7C285.046 316.511 317.937 282.956 358.8 282.956C399.663 282.956 432.553 316.511 432.553 359.7C432.553 402.889 399.663 436.443 358.8 436.443Z" fill="white"/>
|
||||
<path d="M599.326 306.544C577.732 306.544 556.802 315.182 545.838 329.8V309.866H502.649V542.422H545.838V458.37C556.802 471.991 577.067 479.3 599.326 479.3C645.837 479.3 682.382 442.755 682.382 392.922C682.382 343.089 645.837 306.544 599.326 306.544ZM592.017 441.759C567.433 441.759 545.506 422.49 545.506 392.922C545.506 363.354 567.433 344.085 592.017 344.085C616.602 344.085 638.528 363.354 638.528 392.922C638.528 422.49 616.602 441.759 592.017 441.759Z" fill="white"/>
|
||||
<path d="M784.046 306.544C736.871 306.544 699.662 343.421 699.662 392.922C699.662 442.423 732.22 479.3 785.375 479.3C828.896 479.3 856.803 453.054 865.441 423.486H823.249C817.933 435.779 802.983 444.416 785.043 444.416C762.784 444.416 745.841 428.802 741.854 406.543H867.434V389.6C867.434 344.417 835.873 306.544 784.046 306.544ZM742.186 375.979C746.838 355.049 764.113 341.428 785.043 341.428C807.302 341.428 824.245 356.045 826.239 375.979H742.186Z" fill="white"/>
|
||||
<path d="M982.38 306.544C963.111 306.544 942.845 315.182 933.543 329.468V309.866H890.354V475.978H933.543V386.61C933.543 360.696 947.496 343.753 970.087 343.753C991.017 343.753 1002.31 359.7 1002.31 381.959V475.978H1045.5V374.982C1045.5 333.786 1020.25 306.544 982.38 306.544Z" fill="white"/>
|
||||
<path d="M1156.12 243.428L1062.1 475.984H1108.28L1128.21 425.154H1235.19L1255.12 475.984H1301.96L1208.61 243.428H1156.12ZM1143.16 386.616L1181.7 289.275L1219.9 386.616H1143.16Z" fill="white"/>
|
||||
<path d="M1363.42 243.428H1319.57V475.984H1363.42V243.428Z" fill="white"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1637_3573">
|
||||
<rect width="1603.2" height="717.6" fill="white" transform="translate(0 0.899902)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
@@ -0,0 +1,15 @@
|
||||
<svg width="180" height="48" viewBox="220 230 1165 310" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1637_2932)">
|
||||
<path d="M358.8 239.3C293.02 239.3 239.2 293.12 239.2 358.9C239.2 424.68 293.02 478.5 358.8 478.5C424.58 478.5 478.4 425.012 478.4 358.9C478.4 292.787 424.912 239.3 358.8 239.3ZM358.8 435.643C317.937 435.643 285.046 402.089 285.046 358.9C285.046 315.711 317.937 282.156 358.8 282.156C399.663 282.156 432.553 315.711 432.553 358.9C432.553 402.089 399.663 435.643 358.8 435.643Z" fill="black"/>
|
||||
<path d="M599.326 305.744C577.732 305.744 556.802 314.382 545.838 329V309.066H502.649V541.622H545.838V457.57C556.802 471.191 577.067 478.5 599.326 478.5C645.837 478.5 682.382 441.955 682.382 392.122C682.382 342.289 645.837 305.744 599.326 305.744ZM592.017 440.959C567.433 440.959 545.506 421.69 545.506 392.122C545.506 362.554 567.433 343.285 592.017 343.285C616.602 343.285 638.528 362.554 638.528 392.122C638.528 421.69 616.602 440.959 592.017 440.959Z" fill="black"/>
|
||||
<path d="M784.046 305.744C736.871 305.744 699.662 342.621 699.662 392.122C699.662 441.623 732.22 478.5 785.375 478.5C828.896 478.5 856.803 452.254 865.441 422.686H823.249C817.933 434.979 802.983 443.616 785.043 443.616C762.784 443.616 745.841 428.002 741.854 405.743H867.434V388.8C867.434 343.617 835.873 305.744 784.046 305.744ZM742.186 375.179C746.838 354.249 764.113 340.627 785.043 340.627C807.302 340.627 824.245 355.245 826.239 375.179H742.186Z" fill="black"/>
|
||||
<path d="M982.38 305.744C963.111 305.744 942.845 314.382 933.543 328.667V309.066H890.354V475.177H933.543V385.81C933.543 359.896 947.496 342.953 970.087 342.953C991.017 342.953 1002.31 358.9 1002.31 381.159V475.177H1045.5V374.182C1045.5 332.986 1020.25 305.744 982.38 305.744Z" fill="black"/>
|
||||
<path d="M1156.12 242.628L1062.1 475.184H1108.28L1128.21 424.354H1235.19L1255.12 475.184H1301.96L1208.61 242.628H1156.12ZM1143.16 385.816L1181.7 288.475L1219.9 385.816H1143.16Z" fill="black"/>
|
||||
<path d="M1363.42 242.628H1319.57V475.184H1363.42V242.628Z" fill="black"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1637_2932">
|
||||
<rect width="1603.2" height="717.6" fill="white" transform="translate(0 0.0999756)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
@@ -0,0 +1,39 @@
|
||||
name: Build
|
||||
|
||||
on:
|
||||
push:
|
||||
# branches: [master, develop]
|
||||
branches: [master]
|
||||
pull_request:
|
||||
# branches: [master, develop]
|
||||
branches: [master]
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
|
||||
- name: Use Python
|
||||
uses: actions/setup-python@v2
|
||||
with:
|
||||
python-version: 3.x
|
||||
|
||||
- name: Use Node.js
|
||||
uses: actions/setup-node@v2
|
||||
with:
|
||||
node-version: 24.x
|
||||
cache: pnpm
|
||||
|
||||
- name: Enable Corepack
|
||||
run: corepack enable
|
||||
|
||||
- name: Install
|
||||
run: pnpm install
|
||||
|
||||
- name: Check setup
|
||||
run: pnpm run check
|
||||
|
||||
- name: Build
|
||||
run: pnpm run build
|
||||
@@ -0,0 +1,36 @@
|
||||
name: Lint
|
||||
|
||||
on:
|
||||
push:
|
||||
# branches: [master, develop]
|
||||
branches: [master]
|
||||
pull_request:
|
||||
# branches: [master, develop]
|
||||
branches: [master]
|
||||
|
||||
jobs:
|
||||
lint:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
|
||||
- name: Use Python
|
||||
uses: actions/setup-python@v2
|
||||
with:
|
||||
python-version: 3.x
|
||||
|
||||
- name: Use Node.js
|
||||
uses: actions/setup-node@v2
|
||||
with:
|
||||
node-version: 24.x
|
||||
cache: pnpm
|
||||
|
||||
- name: Enable Corepack
|
||||
run: corepack enable
|
||||
|
||||
- name: Install
|
||||
run: pnpm install
|
||||
|
||||
- name: Run linter
|
||||
run: pnpm run lint
|
||||
@@ -0,0 +1,42 @@
|
||||
name: Tests
|
||||
|
||||
on:
|
||||
push:
|
||||
# branches: [master, develop]
|
||||
branches: [master]
|
||||
pull_request:
|
||||
# branches: [master, develop]
|
||||
branches: [master]
|
||||
|
||||
jobs:
|
||||
tests:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
|
||||
- name: Use Python
|
||||
uses: actions/setup-python@v2
|
||||
with:
|
||||
python-version: 3.x
|
||||
|
||||
- name: Use Node.js
|
||||
uses: actions/setup-node@v2
|
||||
with:
|
||||
node-version: 24.x
|
||||
cache: pnpm
|
||||
|
||||
- name: Enable Corepack
|
||||
run: corepack enable
|
||||
|
||||
- name: Install
|
||||
run: pnpm install
|
||||
|
||||
- name: Run agent unit tests
|
||||
run: pnpm run test:agent:unit
|
||||
|
||||
- name: Run workflow unit tests
|
||||
run: pnpm run test:workflow:unit
|
||||
|
||||
- name: Run workflow e2e tests
|
||||
run: pnpm run test:workflow:e2e
|
||||
+36
@@ -0,0 +1,36 @@
|
||||
__pycache__/
|
||||
.idea/
|
||||
.fleet/
|
||||
.vscode/
|
||||
**/dist/*
|
||||
**/build/
|
||||
**/node_modules/
|
||||
**/.venv/
|
||||
**/.last-skill-deps-sync
|
||||
**/.last-source-deps-sync
|
||||
skills/**/reports/*
|
||||
test/coverage/
|
||||
**/tmp/*
|
||||
core/config/**/*.json
|
||||
scripts/out/*.md
|
||||
|
||||
package-lock.json
|
||||
*.pyc
|
||||
.DS_Store
|
||||
*.sublime-workspace
|
||||
npm-debug.log
|
||||
debug.log
|
||||
# Keep ignoring a repo-root .env on the safe side.
|
||||
.env
|
||||
.last-native-node-modules-rebuild
|
||||
bridges/nodejs/.last-nodejs-bridge-deps-sync
|
||||
bridges/python/src/.last-python-bridge-deps-sync
|
||||
tcp_server/src/.last-tcp-server-deps-sync
|
||||
bridges/python/src/Pipfile.lock
|
||||
tcp_server/src/Pipfile.lock
|
||||
!bridges/python/**/.gitkeep
|
||||
!bridges/nodejs/**/.gitkeep
|
||||
!**/*.sample*
|
||||
package.json.backup
|
||||
.python-version
|
||||
schemas/**/*.json
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
image: gitpod/workspace-full
|
||||
|
||||
tasks:
|
||||
- before: npm install -g @leon-ai/cli
|
||||
init: leon create birth
|
||||
command: leon start
|
||||
|
||||
ports:
|
||||
- port: 1337
|
||||
onOpen: notify
|
||||
|
||||
github:
|
||||
prebuilds:
|
||||
master: true
|
||||
branches: true
|
||||
pullRequests: true
|
||||
addComment: true
|
||||
addBadge: true
|
||||
addLabel: true
|
||||
Executable
+1
@@ -0,0 +1 @@
|
||||
tsx scripts/commit-msg.js
|
||||
Executable
+1
@@ -0,0 +1 @@
|
||||
lint-staged
|
||||
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"*.{js,jsx,ts,tsx,mjs,cjs}": ["eslint --fix --ignore-pattern .gitignore"]
|
||||
}
|
||||
+362
@@ -0,0 +1,362 @@
|
||||
# [1.0.0-beta.8](https://github.com/leon-ai/leon/compare/v1.0.0-beta.7...v1.0.0-beta.8) (2023-05-01) / Binaries and TypeScript Rewrite
|
||||
|
||||
_Please refer to [our latest blog post](https://blog.getleon.ai/binaries-and-typescript-rewrite-1-0-0-beta-8/) for more information on the new release of our dear Leon._
|
||||
|
||||
# [1.0.0-beta.7](https://github.com/leon-ai/leon/compare/v1.0.0-beta.6...v1.0.0-beta.7) (2022-08-24) / A Much Better NLP
|
||||
|
||||
_Please [read this blog post](https://blog.getleon.ai/a-much-better-nlp-and-future-1-0-0-beta-7/) to know more about all the new features and the exciting future of Leon._
|
||||
|
||||
### BREAKING CHANGES
|
||||
|
||||
- remove legacy packages [07743657](https://github.com/leon-ai/leon/commit/07743657cd2954e7f850c08eea7c032c24b28a96)
|
||||
|
||||
### Features
|
||||
|
||||
- create new NLP skills resolvers model + NLP global resolvers model [602604e4](https://github.com/leon-ai/leon/commit/602604e43788c6b6be8c402d54fe54342d0cd5d6)
|
||||
- better isolate skill resolvers from global resolvers + finish up Akinator skill [905d248e](https://github.com/leon-ai/leon/commit/905d248ebf7e84b1ccc74450520228aef9a8804a)
|
||||
- transfer language from core to skills + support thematics on Akinator skill [b35a249b](https://github.com/leon-ai/leon/commit/b35a249bf68000d6708aaee4abc4cd97f5b80035)
|
||||
- actions on slot level + akinator skill progress [7101b8b4](https://github.com/leon-ai/leon/commit/7101b8b4b828b49e009da2fcdac7c5ed2e48c8f8)
|
||||
- add Cartesian sample training on resolvers + enum entities [6ed88a59](https://github.com/leon-ai/leon/commit/6ed88a5946c77b356e49fe8b9cbe890b8dd1f037)
|
||||
- map skills resolvers intents [eb5ade76](https://github.com/leon-ai/leon/commit/eb5ade76844dd14f5d5a5c5eeb434eed70fe62f4)
|
||||
- train skills resolvers and remap as per changes [82df0a3c](https://github.com/leon-ai/leon/commit/82df0a3c235fbd50ad0cfe12e23a51f777dcd658)
|
||||
- achieve Cartesian training [a1e9011d](https://github.com/leon-ai/leon/commit/a1e9011d5db48ed8e9f49cef2d813ee7e2400ec2)
|
||||
- introduce suggestions [dcddacca](https://github.com/leon-ai/leon/commit/dcddacca2956529de0aea8ff98e1e6f16104966a)
|
||||
- communicate suggestions to the client [4b5a8835](https://github.com/leon-ai/leon/commit/4b5a883510fd4421a491f999cc21d8f7dd369a03)
|
||||
- shared skills memory [795acc5b](https://github.com/leon-ai/leon/commit/795acc5bdd29e9a27d1cf3b4407453648d573973)
|
||||
- support dynamic variables on skill NLU settings for logic type [10d10a16](https://github.com/leon-ai/leon/commit/10d10a1690cb65970932ee7230e3f324ec67dbce)
|
||||
- tmp resolvers mapping [b1a332ba](https://github.com/leon-ai/leon/commit/b1a332bab6af8b74a8c58c07bac3ef3a1cebad89)
|
||||
- start to map resolvers between the core and skills [e88495a9](https://github.com/leon-ai/leon/commit/e88495a9a94e86026fd0c7c4c44f3ff06edb2e80)
|
||||
- train affirmation and denial resolver [993d52e8](https://github.com/leon-ai/leon/commit/993d52e8686f335039ff3d5e2a82c1a37efb1825)
|
||||
- Python TCP server and Node.js TCP client for IPC (wip) [5970ec9e](https://github.com/leon-ai/leon/commit/5970ec9e8e4c2784c50e2ddc76b34b71aa4310e6)
|
||||
- introduce spaCy for complete NER (wip) [caa86fc8](https://github.com/leon-ai/leon/commit/caa86fc8a6850b18f67ba7bedb423be693a88d17)
|
||||
- slot filling (wip) [76547d94](https://github.com/leon-ai/leon/commit/76547d9411c32e0eb2ccfdac3a4901d2d2fb37f6)
|
||||
- share data across domains [f4f9fff9](https://github.com/leon-ai/leon/commit/f4f9fff9783861be183990d7869973c7a30c8104)
|
||||
- dynamic variable binding on NLG [0367b44f](https://github.com/leon-ai/leon/commit/0367b44f211c1629fffe6981a730f171707bf0c0)
|
||||
- context and slot filling preparation (wip) [975b8ebc](https://github.com/leon-ai/leon/commit/975b8ebcf00db91b44dd067be6dde5c1bf32fff1)
|
||||
- annotate entities on the fly + prepare for dialog skill type and cross-domains data [4107932d](https://github.com/leon-ai/leon/commit/4107932d000086188d6f44ef67b73cc322fc58e5)
|
||||
- new NLP training [d8023308](https://github.com/leon-ai/leon/commit/d8023308d0ef1f3eede37f21f45daa2f893031b0)
|
||||
|
||||
- **server:**
|
||||
- trigger next action suggestions or current ones [244d08c0](https://github.com/leon-ai/leon/commit/244d08c0bd0fea315269f52ab899f9b7fe083f51)
|
||||
- introduce main NLP model and resolvers NLP model [e37526d9](https://github.com/leon-ai/leon/commit/e37526d9056d858ebcf17b81f6714f47b67c77cb)
|
||||
- change log emojis [843bc428](https://github.com/leon-ai/leon/commit/843bc428b8deb397e2d051a8e0bfaf1b82b459a2)
|
||||
- provide nextAction even when no slot is set and clean up NLU object on context switch [8377c63d](https://github.com/leon-ai/leon/commit/8377c63db4e4e42ed929171cd8b9abdb13c44b2a)
|
||||
- report full traceback from skills execution [b69b1fea](https://github.com/leon-ai/leon/commit/b69b1fea16250421bc7d5def1c973dd43e453071)
|
||||
- support on-the-fly entity annotation for built-in entities [567b030c](https://github.com/leon-ai/leon/commit/567b030c4fcf8df266c39cca61a146fb33b9e0fc)
|
||||
- save slots within conversation context [fce47cdb](https://github.com/leon-ai/leon/commit/fce47cdbd570993ac5cca2b4ff5bc97969df4e40)
|
||||
- resolve resolvers tmp [ceea47ff](https://github.com/leon-ai/leon/commit/ceea47ff7dd536bfd3adf3cc355e90e3e94b1cbd)
|
||||
- prepare the next action on non-slot-filled skills [0acb31a9](https://github.com/leon-ai/leon/commit/0acb31a9c61c1c094b29f3d0ff2647d625eab0be)
|
||||
- add more affirmative utterance samples [870ab2e8](https://github.com/leon-ai/leon/commit/870ab2e87eba2c548d38dc90d30553e7fa380c1e)
|
||||
- restart a skill with the original utterance saved in context [f4446ef1](https://github.com/leon-ai/leon/commit/f4446ef17796d38d0f98d5b7e889503622a1a998)
|
||||
- clean up context if the action loop does not meet the expected items [035c9d52](https://github.com/leon-ai/leon/commit/035c9d5240472ac19a84ae8c1a87844fa0d0af5d)
|
||||
- add handsigns custom entity [1529c720](https://github.com/leon-ai/leon/commit/1529c72039092c7b8f37304d6064e04f2dc7b795)
|
||||
- reprocess NLU in case of slot filling interruption [9e242d77](https://github.com/leon-ai/leon/commit/9e242d77d32109e9355eec422790a5a66fd18f9c)
|
||||
- handle action loop when slots have all been filled at once [f8830502](https://github.com/leon-ai/leon/commit/f88305020a5bc79056b7ff9c1a31f8d3c3a7cdce)
|
||||
- break the action loop from the skill [27dc801c](https://github.com/leon-ai/leon/commit/27dc801cf53de5af3d54b95f42d2b9e627090867)
|
||||
- stop action loop from skill to core [99681e25](https://github.com/leon-ai/leon/commit/99681e257795a18361be379b93244088401f640b)
|
||||
- introduce basic concept of action loop [c5b38400](https://github.com/leon-ai/leon/commit/c5b38400821e5bc5edc4402d007f815f24319d44)
|
||||
- prepare action loop feature [19e1aa22](https://github.com/leon-ai/leon/commit/19e1aa22f6e989e90eb745e3a7b7ccb8ff5adbfa)
|
||||
- add current utterance entities to differentiate from the whole context [8b56a185](https://github.com/leon-ai/leon/commit/8b56a1850c9d76e335f1bad1b4395d73ddc5ea19)
|
||||
- when a context is activated, pick up the most probable classification [8e186879](https://github.com/leon-ai/leon/commit/8e1868798c8750c19b1719a44dc6fb8bca68b250)
|
||||
- persist entities into contexts [87575773](https://github.com/leon-ai/leon/commit/875757739f6701f54805eeff2c7c350cff36c4ac)
|
||||
- forward slots to skill + add original utterance [68e40f65](https://github.com/leon-ai/leon/commit/68e40f65df0d1fe29ccad991868a2408c6e1015e)
|
||||
- handle case when all slots have been filled in one utterance [22e9234b](https://github.com/leon-ai/leon/commit/22e9234b3d2c97e83eaafaeeb5aa9d27c351c95a)
|
||||
- trigger next action once all slots have been filled [9b870010](https://github.com/leon-ai/leon/commit/9b870010dd929bc1aed6d87696f1cc4e9f177c0b)
|
||||
- complete slot filling before triggering the next action [9124687e](https://github.com/leon-ai/leon/commit/9124687eb0e17295a30f860752ee622ba44d1440)
|
||||
- from modules to skills with type at the actions level [77ebaf4a](https://github.com/leon-ai/leon/commit/77ebaf4a9c78b2e471d39872e361ea05b163580d)
|
||||
- verify if all slots are filled [e27c1b9c](https://github.com/leon-ai/leon/commit/e27c1b9c8f5c2f668f464f152ad227d65ba5ef6b)
|
||||
- context and slot filling, keep context and await for entities [25adf406](https://github.com/leon-ai/leon/commit/25adf406c810e48b1277105dd6c269a2ed601d28)
|
||||
- unstack oldest context [1ece25a4](https://github.com/leon-ai/leon/commit/1ece25a497acc9f9876fe158ace5da38beec31e6)
|
||||
- context setup with slot for each conversation (wip) [8257eb87](https://github.com/leon-ai/leon/commit/8257eb8792c9f4fc90bcc1b393d3fddf8ff541dc)
|
||||
- resolve slots from slot filling [960a6dc7](https://github.com/leon-ai/leon/commit/960a6dc71c2efb50ad6a8448d447ebd79c559c41)
|
||||
- pickup questions for slot filling [3bbc2f8a](https://github.com/leon-ai/leon/commit/3bbc2f8a254d10f0c37cdb7abf016b3e418f594a)
|
||||
- main slots structure (wip) [1d9b1809](https://github.com/leon-ai/leon/commit/1d9b18093b6e042ae49f557149a7822b4420cdb8)
|
||||
- introduce resolvers for slot filling (wip) [334bf393](https://github.com/leon-ai/leon/commit/334bf393f2c43edd326d9de2e93c037ffeebeab5)
|
||||
- slot filling PoC (tmp wip) [95bfcfe4](https://github.com/leon-ai/leon/commit/95bfcfe422f21a2946e50031a3623675dfe81b9d)
|
||||
- slot filling (wip) [969a83e6](https://github.com/leon-ai/leon/commit/969a83e6081de20ec5e2bdd0329a21a3fe448f13)
|
||||
- trigger unsupported language [1845eed7](https://github.com/leon-ai/leon/commit/1845eed71dadd5f693d76abd7633864014bf8af1)
|
||||
- context (wip) [d1c2a11d](https://github.com/leon-ai/leon/commit/d1c2a11d8284ca4e1d4563b871c50c006e8ef8a0)
|
||||
- context (wip) [a9a43ac4](https://github.com/leon-ai/leon/commit/a9a43ac478c46f3832d2af49c287bb574a70cc14)
|
||||
- differenciate cities from countries for location entities [bf9bf231](https://github.com/leon-ai/leon/commit/bf9bf231f714e1edc1417e43af12fa54c00ba064)
|
||||
- auto restart the TCP server when language is switching [9be7c700](https://github.com/leon-ai/leon/commit/9be7c700767672ac6e0c875d3b5ae7fa6414e4fa)
|
||||
- support multi languages on TCP server [a808742c](https://github.com/leon-ai/leon/commit/a808742c927d45c18df45af133e67c98d4a0415a)
|
||||
- add auto reconnect on TCP client [cbe89ed6](https://github.com/leon-ai/leon/commit/cbe89ed6ccfd727356eb34078a8a4348b2fd696f)
|
||||
- make TCP client global [006e9fb0](https://github.com/leon-ai/leon/commit/006e9fb01148c2107f6acc6a562ace4809da92be)
|
||||
- fully implement low-level networking for IPC [8acb82da](https://github.com/leon-ai/leon/commit/8acb82da9bacdb9b7952c4a4d130d094e07def5e)
|
||||
- more accurate NLG [d5577b1e](https://github.com/leon-ai/leon/commit/d5577b1ef5cf1b8b4a924636ba4425b8b4ae133d)
|
||||
- unknown_answers fallback on dialog type [28efe6e7](https://github.com/leon-ai/leon/commit/28efe6e7d542f19bf12ddede1815f7fa8cf01036)
|
||||
- deep data mapping on enum NER [3ca48265](https://github.com/leon-ai/leon/commit/3ca48265e7115c8e0f02c65ba92d90412325ad76)
|
||||
- NLG and entities mapping [8f2f935b](https://github.com/leon-ai/leon/commit/8f2f935b949ceb965941460d4ff1ed0084b72442)
|
||||
- bootstrap skill structure [fe90c68e](https://github.com/leon-ai/leon/commit/fe90c68ea0e9b0e857b62aa9f3b0a42ba1ffed6b)
|
||||
- on-the-fly language switching [f24513a2](https://github.com/leon-ai/leon/commit/f24513a22395d1903e485883f4813cdceccdbd18)
|
||||
- new NLP containers [34b2aa56](https://github.com/leon-ai/leon/commit/34b2aa5655e55284d59db4569960c49965a0483c)
|
||||
- (WIP) NLU refactoring [ca3f5f42](https://github.com/leon-ai/leon/commit/ca3f5f42da26eb634e10b56e9b84bd45b5543024)
|
||||
- add skills domains [cf2a28aa](https://github.com/leon-ai/leon/commit/cf2a28aac2d936cc15e6aa9aa13747015d952053)
|
||||
- **skill/akinator:**
|
||||
- finish up [79e7df02](https://github.com/leon-ai/leon/commit/79e7df022f7daedf43db7f892e049a31924ce985)
|
||||
- finished main business logic [76cae42f](https://github.com/leon-ai/leon/commit/76cae42fdeac0edcd3ebd6aa7718728617687b1b)
|
||||
- backbone [02a2f714](https://github.com/leon-ai/leon/commit/02a2f71470bb4c0c6ca04526e89461d863d17145)
|
||||
- **skill/birthday:**
|
||||
remove birthday skill [be0b345d](https://github.com/leon-ai/leon/commit/be0b345d3f7fea562548e3fbed62b65c32eff4c0)
|
||||
- **skill/color:**
|
||||
introduce color skill [ce00989b](https://github.com/leon-ai/leon/commit/ce00989b01f65c5cbb5a2e13f454207c1ba7741c)
|
||||
- **skill/guess_the_number:**
|
||||
introduce the Guess the Number skill [fba80966](https://github.com/leon-ai/leon/commit/fba80966c937a32182e48670c47358babb539d64)
|
||||
- **skill/introduction:**
|
||||
- add one utterance sample [af0fdd1e](https://github.com/leon-ai/leon/commit/af0fdd1e18975bf8b60abb2957ddf79831281817)
|
||||
- ask about owner info if necessary [c5cc9bdd](https://github.com/leon-ai/leon/commit/c5cc9bdd52afaaa710f9476d1e9918f3d168e243)
|
||||
- **skill/mbti:**
|
||||
- complete form resolver [aad9f3f1](https://github.com/leon-ai/leon/commit/aad9f3f1ef61499d438ea40c9d2d95764667678d)
|
||||
- finish business logic [99a3f103](https://github.com/leon-ai/leon/commit/99a3f103e00b5a58745ee851d2fa95c61871f75a)
|
||||
- questions mapping [ae4f69f7](https://github.com/leon-ai/leon/commit/ae4f69f7c7189ff75e004f68c9a2a8b6bb37b6bd)
|
||||
- complete questionnaire [7f1f8871](https://github.com/leon-ai/leon/commit/7f1f8871598746c5475b24e086ea6e581f2a988e)
|
||||
- main logic backbone [33109a4c](https://github.com/leon-ai/leon/commit/33109a4c8b5df82e7b98e48e66f8d53f0cc114fb)
|
||||
- main NLU structure [skip ci] [86d5040a](https://github.com/leon-ai/leon/commit/86d5040a7dc2006036c7e67a2cf54a4c992e64aa)
|
||||
- **skill/rochambeau:**
|
||||
- add start answers [192dd0a8](https://github.com/leon-ai/leon/commit/192dd0a87ab5dc025bb90b20b187e36a58be54ea)
|
||||
- introduce paper scissors rock [57370470](https://github.com/leon-ai/leon/commit/573704706c843d870f2498146bc3cd659bab4f06)
|
||||
- init [7f5e30ac](https://github.com/leon-ai/leon/commit/7f5e30ac82f2a2d7579e361229a4044348915867)
|
||||
- **web app:**
|
||||
- join us on Discord [141c89ec](https://github.com/leon-ai/leon/commit/141c89ecbfd329a8e63d5a603d0ae6b42f9abf38)
|
||||
- wait for TCP client to be connected first [bc228a68](https://github.com/leon-ai/leon/commit/bc228a68600c07871c489d6624bbc837971079a6)
|
||||
### Bug Fixes
|
||||
- check script with new intent-object format [fdf0a389](https://github.com/leon-ai/leon/commit/fdf0a389b76caba5dd47996a43a34c0c7821c70a)
|
||||
- check new resolvers paths [cfd8f7cb](https://github.com/leon-ai/leon/commit/cfd8f7cbe5e8fd9ce3d1659c725d7af261db8d71)
|
||||
- use ports.ubuntu.com mirror for the offline TTS [skip ci] [3dd90396](https://github.com/leon-ai/leon/commit/3dd9039678820fceb7ccbb1c96358c8d2f188ede)
|
||||
- set skill config only when a bridge is set [7513aa7d](https://github.com/leon-ai/leon/commit/7513aa7d20fee1fe9ca5442a7909d22fd1c3b39e)
|
||||
- only set skill config when it is a logic type [9ce9a8bc](https://github.com/leon-ai/leon/commit/9ce9a8bc4fe0864730a08d8e9a436982f1365aa5)
|
||||
- **docker:**
|
||||
- usage of Ubuntu base image with pyenv and nvm (#408) [f507f6f7](https://github.com/leon-ai/leon/commit/f507f6f7e499f56768b3e624164cbcd58193b153)
|
||||
- check should not allocate a pseudo-TTY (#359) [4372b45f](https://github.com/leon-ai/leon/commit/4372b45fc605893d4130cf7110dd87519b934345)
|
||||
- **server:**
|
||||
- make leon handle multiple socket.io-client instances [6e7c0aac](https://github.com/leon-ai/leon/commit/6e7c0aac57008b152b45f1b0f3886ae38777467b)
|
||||
- fallback on global resolver during resolver classification [ec77dd0f](https://github.com/leon-ai/leon/commit/ec77dd0f02a8ae94fb3f02c7b7847b5509d71406)
|
||||
- make use of current entities to match global entities [a8d82050](https://github.com/leon-ai/leon/commit/a8d82050c86b5c24c4c898c06e5ffc3882524c0b)
|
||||
- multiple slots filling [2ac1bc63](https://github.com/leon-ai/leon/commit/2ac1bc63ccd11757d586adfb2e75ce04e3ffbcb5)
|
||||
- context switching on action loop [6712ae55](https://github.com/leon-ai/leon/commit/6712ae5539ef44ed33e360cfcad71c760c4b13b1)
|
||||
- check one-shot slot filling case causing infinite loop [782a3aaa](https://github.com/leon-ai/leon/commit/782a3aaa0a07dda667557bc84db906b3fa9b237c)
|
||||
- clean up active context after all slots have been filled [faabc2c7](https://github.com/leon-ai/leon/commit/faabc2c7b0992fcea035eedf66103d84b101e1a7)
|
||||
- correctly extract all spaCy entities [6aa60bfb](https://github.com/leon-ai/leon/commit/6aa60bfbd8c72e678fe3faf5e7f9dbd37dfd209f)
|
||||
- intent not found [8280c658](https://github.com/leon-ai/leon/commit/8280c65897dba0fe470a3589d151b391c51e344e)
|
||||
- fallback due to modules to skills refactoring [ef0c54b2](https://github.com/leon-ai/leon/commit/ef0c54b22667ef2bd1d2c07003f6b4beb5fa25c0)
|
||||
- NER due to modules to skills refactoring [e4d3904c](https://github.com/leon-ai/leon/commit/e4d3904ceeb2a3ee2c0187a1817331fac916e1a7)
|
||||
- **skill/akinator:**
|
||||
remove direct end on guess action [f6461f73](https://github.com/leon-ai/leon/commit/f6461f733b4a5d944dfa4a987dd1109628c6cbca)
|
||||
- **skill/color:**
|
||||
more appropriate answer [cb18ed63](https://github.com/leon-ai/leon/commit/cb18ed6397cb0e0ad8fbea30c57d7d40137441ee)
|
||||
- **skill/rochambeau:**
|
||||
final logic [0ebc0518](https://github.com/leon-ai/leon/commit/0ebc0518e61b899c35dd13df65a43f69399e784d)
|
||||
### Performance Improvements
|
||||
- check Pipfile instead of Pipfile.lock to judge whether Python packages must be installed [afdb71f7](https://github.com/leon-ai/leon/commit/afdb71f766f2956c5cb4a5e0be9025340d1a89db)
|
||||
|
||||
### Documentation Changes
|
||||
|
||||
- change newsletter link [4bf2a9af](https://github.com/leon-ai/leon/commit/4bf2a9af963f75aeff96f4a43da8ec1024ac583a)
|
||||
- README - Edited sentence for clarity (#389) [e83a1c42](https://github.com/leon-ai/leon/commit/e83a1c4230897e8b63251ef86225cf773148c38e)
|
||||
- edit newsletter link [fa558a44](https://github.com/leon-ai/leon/commit/fa558a447ade4071f352d56f14602690ed90f521)
|
||||
- update sponsor [skip ci] [f30ddb6b](https://github.com/leon-ai/leon/commit/f30ddb6be5f531df2b0042be0ed5ffbe79f73b07)
|
||||
- remove sponsor [skip ci] [5dbc010f](https://github.com/leon-ai/leon/commit/5dbc010fa643279a24081f3148022e2211af63f4)
|
||||
- remove sponsor [skip ci] [f36dd20f](https://github.com/leon-ai/leon/commit/f36dd20f822cd33c9e8a03efc2849c8d8d1fc75e)
|
||||
- remove sponsor [skip ci] [5ee57ddf](https://github.com/leon-ai/leon/commit/5ee57ddf2a9f7817ec35b2e70d49e5bb422d8f78)
|
||||
- add @ant-media sponsor [skip ci] [b47cbc3a](https://github.com/leon-ai/leon/commit/b47cbc3a5ecb6591f7abb4f62feae8102b9a6468)
|
||||
- add long dev notice to README [skip ci] [499be77d](https://github.com/leon-ai/leon/commit/499be77d509231b853f591e27f726381da5a50d8)
|
||||
- move sponsor to new section [skip ci] [8825d687](https://github.com/leon-ai/leon/commit/8825d6877c19d86495e89a858b859b7ab1f9ae37)
|
||||
- change Twitter handle [skip ci] [c1afc11c](https://github.com/leon-ai/leon/commit/c1afc11cdb283526540d0fecdf83efddf3f3a9f7)
|
||||
- remove sponsor [skip ci] [99b401a6](https://github.com/leon-ai/leon/commit/99b401a668a6fb248e33c22782940402be7c9b17)
|
||||
- add new sponsor self-hosted img [skip ci] [238d928c](https://github.com/leon-ai/leon/commit/238d928cace13d4ecd174ca14b136967d8845e0f)
|
||||
- remove new sponsor link (broken) [skip ci] [254f2848](https://github.com/leon-ai/leon/commit/254f2848aab622b79cce16d10c58d53ff6db9a8f)
|
||||
- in GitHub BUG.md from modules to skills [4a5480a3](https://github.com/leon-ai/leon/commit/4a5480a3ccc54ee34d42f6edcec2a40224dee7ed)
|
||||
- change @FluxIndustries sponsorship [skip ci] [1a118b71](https://github.com/leon-ai/leon/commit/1a118b718e5d4ade123756ac94758a01c50b12ae)
|
||||
- add @FluxIndustries sponsor [skip ci] [9a604d7c](https://github.com/leon-ai/leon/commit/9a604d7ccc0c6aaec257299078141dd0c3077933)
|
||||
- new #LeonAI link [skip ci] [a0107d62](https://github.com/leon-ai/leon/commit/a0107d629473f7fd057d367926e83822d46f1227)
|
||||
- changelog new version diff link fix [skip ci] [e14c2498](https://github.com/leon-ai/leon/commit/e14c249826db92af7b85422e566be6aa834a7fb7)
|
||||
|
||||
# [1.0.0-beta.6](https://github.com/leon-ai/leon/compare/v1.0.0-beta.5...v1.0.0-beta.6) (2022-02-07) / Leon Over HTTP + Making Friends with Coqui STT
|
||||
|
||||
### Features
|
||||
|
||||
- simple coqui-ai stt integration [86a4816b](https://github.com/leon-ai/leon/commit/86a4816b777fee8ec9c89648c5866a75de56c017)
|
||||
- HTTP API key generator [d10a7fa7](https://github.com/leon-ai/leon/commit/d10a7fa7880a0bf2fb1cae7904d1ef4257f05257)
|
||||
- avoid unnecessary routes generation
|
||||
|
||||
- **server:**
|
||||
- make Coqui STT the default STT solution [70399187](https://github.com/leon-ai/leon/commit/7039918760c0ef7ba93bf45820e3cae774c42d8c)
|
||||
- add HTTP API key middleware [cdf41499](https://github.com/leon-ai/leon/commit/cdf4149939cbe3f3ae81039957dba3377a78f5a6)
|
||||
- expose queries over HTTP [b6428d03](https://github.com/leon-ai/leon/commit/b6428d038452619f1682c863892cd8f376efca84)
|
||||
- add timeout action over HTTP [115f9c16](https://github.com/leon-ai/leon/commit/115f9c164559d761625cc6f362749f7d2417d300)
|
||||
- handle built-in and trim entities over HTTP + add "disabled" HTTP API action option [82fb967a](https://github.com/leon-ai/leon/commit/82fb967af8f49421e3b2474184da3d34fb17294f)
|
||||
- execute modules over HTTP [2e5b2c59](https://github.com/leon-ai/leon/commit/2e5b2c59da0bafe3acd966773c6fac3611b3bd0c)
|
||||
- generate Fastify routes on the file to expose packages over HTTP [5b41713a](https://github.com/leon-ai/leon/commit/5b41713a68ee628e695212dbebc88f6b9a94b461)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
- do not ask to regenerate the HTTP API key if this one isn't available yet [d265377a](https://github.com/leon-ai/leon/commit/d265377a43fd4506cf12db46f261b891f2054ed2)
|
||||
- Python deps tree check [c6c01291](https://github.com/leon-ai/leon/commit/c6c012915824227efdf0c50df6a8f1cd8d70ed42)
|
||||
- hotword offline (#342) [f563d01d](https://github.com/leon-ai/leon/commit/f563d01d077499c836e94c86f85cedc2ad4d56e6)
|
||||
- addressed comments by @JRMeyer [b1c6f5c8](https://github.com/leon-ai/leon/commit/b1c6f5c883103d57d4fe566af640fc3ac5ce713d)
|
||||
- allow to detect STT offline capabilities [04d62288](https://github.com/leon-ai/leon/commit/04d622884165e0bde65785569a659f59cf9e8582)
|
||||
- Amazon Polly is always configured on check script due to new structure [e6246d1f](https://github.com/leon-ai/leon/commit/e6246d1f8f9ec15a4ebe9600764afffbaa7e62d9)
|
||||
|
||||
### Performance Improvements
|
||||
|
||||
- check if Python deps tree has been updated before going through deps install [2d0b0f13](https://github.com/leon-ai/leon/commit/2d0b0f1365d8e4d6eadf9f7cc0a16b7b4b4306f4)
|
||||
|
||||
# [1.0.0-beta.5](https://github.com/leon-ai/leon/compare/v1.0.0-beta.4...v1.0.0-beta.5) (2021-12-28) / Refocus
|
||||
|
||||
_This release marks a major turn in the future versions of the Leon core. Please [read this blog post](https://blog.getleon.ai/i-ran-away-from-open-source/) to know more._
|
||||
|
||||
### BREAKING CHANGES
|
||||
|
||||
- Node.js 16+ and npm 8+ minimum requirements [2f66f1c1](https://github.com/leon-ai/leon/commit/2f66f1c17bb2e4a1c18b4251d49de252b8d87344)
|
||||
|
||||
### Features
|
||||
|
||||
- **server:** support arrays on NER between conditions [7cf7f979](https://github.com/leon-ai/leon/commit/7cf7f9791254e1950fe9128ce1b3a58079cc2ada)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
- jest-extended new setup due to latest update [02f766d6](https://github.com/leon-ai/leon/commit/02f766d6a8453609ebaec78356aa6e6d4df0967b)
|
||||
|
||||
### Performance Improvements
|
||||
|
||||
- Windows setup on DeepSpeech dep removal [13f5a49f](https://github.com/leon-ai/leon/commit/13f5a49f678f8f67a93b67d4f558cddcf237e204)
|
||||
|
||||
### Documentation Changes
|
||||
|
||||
- URL redirect managed by registrar [c16d5b28](https://github.com/leon-ai/leon/commit/c16d5b280b758f7e18305e30678adec79f0a0716)
|
||||
|
||||
# [1.0.0-beta.4](https://github.com/leon-ai/leon/compare/1.0.0-beta.2...v1.0.0-beta.4) (2021-05-01) / Getting Rid of Dust
|
||||
|
||||
_This release includes a lot of changes that are made under the hood and are not displayed here, please **[read the blog post](https://blog.getleon.ai/getting-rid-of-dust-1-0-0-beta-4/)** to know more._
|
||||
|
||||
### BREAKING CHANGES
|
||||
|
||||
- **package/checker:** introduce Have I Been Pwned v3 API with API key ([0ca89fe3](https://github.com/leon-ai/leon/commit/0ca89fe32d51c80cec5f9446acf14990390a5917))
|
||||
- **server:**
|
||||
- AWS SDK new structure due to v3 and adapt Amazon Polly changes ([f15f2db7](https://github.com/leon-ai/leon/commit/f15f2db78e5781d05e5e2bcb186645966d17debf))
|
||||
- IBM Watson TTS and STT new structure ([f41ea0e9](https://github.com/leon-ai/leon/commit/f41ea0e9a1479bfd6a1cb2e8d1f70aec744c685b) | [2668c295](https://github.com/leon-ai/leon/commit/2668c295880ee753ef7ca26a91dbc7e0901febff))
|
||||
|
||||
### Features
|
||||
|
||||
- **package/calendar:** introduce To-Do list module ([0cdd73d6](https://github.com/leon-ai/leon/commit/0cdd73d6c24a287915f691e3b12edacd75fd383a) | [857be947](https://github.com/leon-ai/leon/commit/857be947792c650ac35847e14fc41064008cef24) | [2041be14](https://github.com/leon-ai/leon/commit/2041be14dbc01640a61de96d1982cc20cd05a8b3) | [12e8f5c3](https://github.com/leon-ai/leon/commit/12e8f5c3bfb436aa212557cd99d9926aa431ab4f) | [8575e9e3](https://github.com/leon-ai/leon/commit/8575e9e3ef01499d9f7be6d313a85d48549e9107) | [5e128df0](https://github.com/leon-ai/leon/commit/5e128df023977525de3e66ce2826aace87569308) | [602aa694](https://github.com/leon-ai/leon/commit/602aa694ac49333f48c119cf2ca2aa7f54b8ae44) | [b9693df9](https://github.com/leon-ai/leon/commit/b9693df90cbc01067e18e64db4d377e41b3fd1d4) | [581da8cd](https://github.com/leon-ai/leon/commit/581da8cd9806323aabb0e85778d645df3c0948b9) | [53f7db55](https://github.com/leon-ai/leon/commit/53f7db55c6e916751f1d59c239628d5ea8914009) | [ae073971](https://github.com/leon-ai/leon/commit/ae0739717b6a17373d8f9bc69571c67c1c571b4a))
|
||||
- **package/checker:** introduce Have I Been Pwned module ([61c1b55a](https://github.com/leon-ai/leon/commit/61c1b55af5691c03f6a6dae0cf3f236a374f1fe7) | [5a999bc6](https://github.com/leon-ai/leon/commit/5a999bc63aa0c667c4e3092daac6a05a6c4b4499) | [36368664](https://github.com/leon-ai/leon/commit/36368664fce8bcf0c17c4c83818aeb418f1e2f23) | [a7a6d885](https://github.com/leon-ai/leon/commit/a7a6d885a83455163eeca74a355177d65db156b8) | [c73ba52b](https://github.com/leon-ai/leon/commit/c73ba52ba8575a64b3329e59a50050d15281d0ec) | [8374e548](https://github.com/leon-ai/leon/commit/8374e5481022de9b134f49180a8dfe28db136261) | [a476fd0f](https://github.com/leon-ai/leon/commit/a476fd0f38f18bf8035db213be2c55f83871038d))
|
||||
- **package/network:** add speedtest module ([09ad4340](https://github.com/leon-ai/leon/commit/09ad43406d3df8ca65f385a91c159def51f91811))
|
||||
- **server:**
|
||||
- add regex entity type [3fda3526](https://github.com/leon-ai/leon/commit/3fda3526c7425bdea4b669474fa77efd61c06a8e)
|
||||
- catch unsupported action entity type [5bc6c3f1](https://github.com/leon-ai/leon/commit/5bc6c3f116d6b9ece2cc3bebdbdb08f019ee90b9)
|
||||
- NER backbone [24cf3c9a](https://github.com/leon-ai/leon/commit/24cf3c9a4facd05a4c626ff9d2e7c83a5ae15298)
|
||||
- introduce actions module [b449376f](https://github.com/leon-ai/leon/commit/b449376f61dc995e2e264c6a14ba123926f5cc58)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
- set correct status code for GET /downloads [690f1841](https://github.com/leon-ai/leon/commit/690f1841d681a1e48e1837e3e166228d6c2ddaf6)
|
||||
- take `.env` in consideration when using Docker [d38e6095](https://github.com/leon-ai/leon/commit/d38e6095f9b71467b8486430fba4bb7007ec4c5a)
|
||||
- spinner test [9071c927](https://github.com/leon-ai/leon/commit/9071c92790be674687590e4a896bbf44bc26fb43)
|
||||
- e2e tests by adding modules actions level [5cf77d90](https://github.com/leon-ai/leon/commit/5cf77d9011a80b326f229b2309a6910ac0f1cfa2)
|
||||
|
||||
- **package/leon:** fix english translations [90225707](https://github.com/leon-ai/leon/commit/90225707f94154021cadeb9c61bdc48c3de5aa29)
|
||||
- **package/network:** make use of new compatible speedtest lib [0c925626](https://github.com/leon-ai/leon/commit/0c925626df65858fa039972b3f3d5f38fde93eb6)
|
||||
- **package/trend:**
|
||||
- GitHub module new scraping [68414937](https://github.com/leon-ai/leon/commit/6841493740ca859000c1fd8d692b73fc79fcf500)
|
||||
- when there is no star provided on the GitHub module [563fb409](https://github.com/leon-ai/leon/commit/563fb40955e2deb5c6d0bd064fc9cc8766a6fcaf)
|
||||
- **server:**
|
||||
- make use of Basic plugin from the main NLP container [e1d5bed3](https://github.com/leon-ai/leon/commit/e1d5bed3e688db566a0cb803dda5c2d57c599d8c)
|
||||
- NER trim entity on after conditions [fa6a5a43](https://github.com/leon-ai/leon/commit/fa6a5a43a60b493aa403a44957082382494c129b)
|
||||
|
||||
### Documentation Changes
|
||||
|
||||
- add minimum Pipenv version requirement to README [72e46bd6](https://github.com/leon-ai/leon/commit/72e46bd6c175a4a149fb6b14522823b224d7c152)
|
||||
- hunt broken links [b2a22792](https://github.com/leon-ai/leon/commit/b2a2279243e7566b57fb7f696024bdf08294e853)
|
||||
- add "ci" commit type in CONTRIBUTING.md [09e2672b](https://github.com/leon-ai/leon/commit/09e2672b0b399f5ce9dd7cd446d04f4d6fd7c13a)
|
||||
- use emojies in README [0ea7a78b](https://github.com/leon-ai/leon/commit/0ea7a78b7c94dc44c992913ae1c90fb1cf8a7692)
|
||||
- add social badges to README [c55c7532](https://github.com/leon-ai/leon/commit/c55c7532b25bf420c4819be71b0f9c21ccc58711)
|
||||
- Node.js 14 requirement [d1034bd1](https://github.com/leon-ai/leon/commit/d1034bd135fd5a6314a1571d4088fd85a8e6a1da)
|
||||
|
||||
# [1.0.0-beta.2](https://github.com/leon-ai/leon/compare/1.0.0-beta.1...1.0.0-beta.2) (2019-04-24)
|
||||
|
||||
### Features
|
||||
|
||||
- can send custom HTTP headers
|
||||
([2685cdab](https://github.com/leon-ai/leon/commit/2685cdab07cc1a9ea418eab812e5163d2dd0da90))
|
||||
- allow HTML output
|
||||
([ec3f02df](https://github.com/leon-ai/leon/commit/ec3f02dfaf2f4b7623ce350350ebee28cf18740e))
|
||||
- NLU improvement with node-nlp
|
||||
([6585db71](https://github.com/leon-ai/leon/commit/6585db718ccae1d750a35783075cf61cc8fe84f1))
|
||||
|
||||
- **package/trend:**
|
||||
- add answer when the Product Hunt developer token is not provided
|
||||
([f40b479b](https://github.com/leon-ai/leon/commit/f40b479b295247c5a8a0e6ed81afe56fadfd2730))
|
||||
- Product Hunt module done
|
||||
([37794306](https://github.com/leon-ai/leon/commit/3779430621bef970be0e8d048eb0b4bf160ae8a4))
|
||||
- basics done on the Product Hunt module
|
||||
([32cc7dbe](https://github.com/leon-ai/leon/commit/32cc7dbe36592fb9618d9c10da5f05a4be7e41b6))
|
||||
- complete dedicated answers according to the technology and given time
|
||||
([8997d691](https://github.com/leon-ai/leon/commit/8997d6917445f837c9647a5a9b4d6998d2df4952))
|
||||
- GitHub module done
|
||||
([7c6f3922](https://github.com/leon-ai/leon/commit/7c6f3922f299193ee0fb54d0fc97f8b436fc706b))
|
||||
- be able to choose a limit and a date range for the GitHub module
|
||||
([3c088371](https://github.com/leon-ai/leon/commit/3c0883716e1c10371c399843a578095a1e16781d))
|
||||
- format GitHub results in one message
|
||||
([9d026b94](https://github.com/leon-ai/leon/commit/9d026b94efa8871d421ae2b593b96622a98537ac))
|
||||
- simple GitHub module results
|
||||
([5baec074](https://github.com/leon-ai/leon/commit/5baec07455f453d4ad003f1da360b2663b7e15e0))
|
||||
- list GitHub trends in HTML raw
|
||||
([3441629e](https://github.com/leon-ai/leon/commit/3441629e3cde933b322cb114d9f1bc3ef0eb3944) | [6b932e94](https://github.com/leon-ai/leon/commit/6b932e947fc365ea6435fda798b7cca32708b443))
|
||||
- expressions dataset and structure
|
||||
([f406a5a0](https://github.com/leon-ai/leon/commit/f406a5a09894e12c56a1e76dda609adada00b0d7) | [f54c2272](https://github.com/leon-ai/leon/commit/f54c2272b4b4dc5c56b512b0ccc1519d77ef15a3))
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
- Leon was not fully installed with Docker if a `.env` file was existing
|
||||
([c8a68ab0](https://github.com/leon-ai/leon/commit/c8a68ab02eec9ddaf803b6e36cd7e91a4989cdea))
|
||||
|
||||
- **package/trend:**
|
||||
when there is no contributor on GitHub module
|
||||
([d845e49b](https://github.com/leon-ai/leon/commit/d845e49b0f18caeb306e2d399c50a03883b2f55d))
|
||||
- **server:**
|
||||
- skip Pipenv locking until they fix it
|
||||
([029381e3](https://github.com/leon-ai/leon/commit/029381e3256933f37f5c2950c4eb1f0192f55ec6) | [ecfdc73f](https://github.com/leon-ai/leon/commit/ecfdc73f8290dd9e1910df9519095516a1227763))
|
||||
|
||||
### Documentation Changes
|
||||
|
||||
- add `What is Leon able to do?` section in the readme
|
||||
([87f53c91](https://github.com/leon-ai/leon/commit/87f53c91368141966959f3ad7299bb7b643828a5) | [d558fc8b](https://github.com/leon-ai/leon/commit/d558fc8b7c6494babf5dec799802227f77c33d8a))
|
||||
- open-source != open source
|
||||
([16a9372e](https://github.com/leon-ai/leon/commit/16a9372e05d4d31a7a39a65a52d4708b72499d4c) | [2155cd88](https://github.com/leon-ai/leon/commit/2155cd88decbbd671bd58840291d9330ce06ebba))
|
||||
|
||||
# [1.0.0-beta.1](https://github.com/leon-ai/leon/compare/1.0.0-beta.0...1.0.0-beta.1) (2019-02-24)
|
||||
|
||||
### Features
|
||||
|
||||
- add Docker support
|
||||
([209760db](https://github.com/leon-ai/leon/commit/209760dba747001300692fb6a6af97543de584d6))
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
- **package/checker:**
|
||||
isitdown module fails with capital letters in URL
|
||||
([ada6aaef](https://github.com/leon-ai/leon/commit/ada6aaef4bada47e87d28f9f6eaa05b9e23f58d2))
|
||||
- **web app:**
|
||||
enable environment variables
|
||||
([a438d6f9](https://github.com/leon-ai/leon/commit/a438d6f942812f74e3dda75a9875609f8bea21cd))
|
||||
|
||||
### Performance Improvements
|
||||
|
||||
- **web app:**
|
||||
favicon compression
|
||||
([33dbcb42](https://github.com/leon-ai/leon/commit/33dbcb425eaafba90176ff64e5f689eb36bc6ce1))
|
||||
|
||||
### Documentation Changes
|
||||
|
||||
- update README to make the reader genderless
|
||||
([58662658](https://github.com/leon-ai/leon/commit/586626586b7a2f84cb2cd84028111976bc5172f0))
|
||||
- use "to rule them all" in README
|
||||
([c74dda4c](https://github.com/leon-ai/leon/commit/c74dda4cb9acc78de143ae01fdc6b4ef0a5ec3ef))
|
||||
|
||||
- **readme:**
|
||||
add story write-up
|
||||
([08a68e37](https://github.com/leon-ai/leon/commit/08a68e376b6a9367425947380564120943376500))
|
||||
|
||||
# [1.0.0-beta.0](https://github.com/leon-ai/leon/compare/https://github.com/leon-ai/leon.git...1.0.0-beta.0) (2019-02-10)
|
||||
|
||||
Initial release.
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2019-present, Louis Grenard <louis@getleon.ai>
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
@@ -0,0 +1,183 @@
|
||||
<p align="center">
|
||||
<a href="https://getleon.ai"><img width="800" src="https://getleon.ai/img/hero-animation.gif" /></a>
|
||||
</p>
|
||||
|
||||
<h1 align="center">
|
||||
<a href="https://getleon.ai"><img width="96" src="https://getleon.ai/img/logo.svg" alt="Leon"></a><br>
|
||||
Leon
|
||||
</h1>
|
||||
|
||||
_<p align="center">Your open-source personal AI assistant.</p>_
|
||||
|
||||
<p align="center">
|
||||
<a href="https://discord.gg/MNQqqKg"><img src="https://img.shields.io/badge/Discord-%235865F2.svg?style=for-the-badge&logo=discord&logoColor=white" /></a>
|
||||
<a href="https://github.com/leon-ai/leon/blob/develop/LICENSE.md"><img src="https://img.shields.io/badge/License-MIT-1c75db?style=for-the-badge" /></a>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
I share Leon progress most regularly on <a href="https://x.com/grenlouis"><strong>X / @grenlouis</strong></a>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://x.com/grenlouis">Follow progress on X / @grenlouis</a> ·
|
||||
<a href="https://getleon.ai">Website</a> ·
|
||||
<a href="https://leonai.substack.com/subscribe">Newsletter</a> ·
|
||||
<a href="http://roadmap.getleon.ai">Roadmap</a> ·
|
||||
<a href="https://blog.getleon.ai/the-story-behind-leon/">Story</a>
|
||||
</p>
|
||||
|
||||
---
|
||||
|
||||
## ⚠️ Important Notice (as of 2026-03-29)
|
||||
|
||||
> [!IMPORTANT]
|
||||
> Leon is currently focused on the **2.0 Developer Preview** on the `develop` branch.
|
||||
>
|
||||
> - The new documentation is **not ready yet**.
|
||||
> - The current docs site and older guides mostly reflect the legacy architecture.
|
||||
> - If you want the legacy, more stable pre-agentic version of Leon, use the `master` branch.
|
||||
> - If you want to explore or contribute to Leon's new core, `develop` is the right place.
|
||||
|
||||
The most accurate high-level references for Leon's current state are:
|
||||
|
||||
- [`core/context/LEON.md`](./core/context/LEON.md)
|
||||
- [`core/context/ARCHITECTURE.md`](./core/context/ARCHITECTURE.md)
|
||||
|
||||
## 👋 Introduction
|
||||
|
||||
**Leon** is **your open-source personal AI assistant** built around **tools, context, memory, and agentic execution**.
|
||||
|
||||
Leon is designed to stay practical, privacy-aware, and grounded in your real environment. It can operate locally, use dedicated tools instead of relying on free-form guessing, and complete tasks from start to finish across deterministic workflows and agent-style execution.
|
||||
|
||||
## 🧠 What Leon Is Today
|
||||
|
||||
Leon is no longer just a classic intent-classification assistant like it was for its first release in 2019.
|
||||
|
||||
Today, Leon is being built as a more capable assistant that can understand a goal, choose how to handle it, use tools, remember useful information, and recover when something goes wrong.
|
||||
|
||||
- Leon can run in different ways depending on the task: `smart` mode chooses for you, `controlled` mode follows deterministic native skills and actions, and `agent` mode can plan step by step.
|
||||
- Leon supports native skills for controlled actions and agent skills for `SKILL.md`-backed workflows.
|
||||
- Leon can use real tools to get work done instead of only replying with plain text.
|
||||
- Leon can use context about your environment so answers stay grounded in what is actually happening on your machine and setup.
|
||||
- Leon keeps layered memory so it can remember durable preferences, day-to-day context, and recent discussion context.
|
||||
- Leon supports both local and remote AI providers, which helps balance privacy, control, and capability.
|
||||
- Under the hood, Leon-native skills follow `Skills -> Actions -> Tools -> Functions (-> Binaries)`.
|
||||
|
||||
Leon also keeps a compact self-model and a bounded proactive pulse system so it can stay more consistent over time without flooding itself with unnecessary context.
|
||||
|
||||
## Why?
|
||||
|
||||
- **Privacy matters**: Leon can work with local models and local context instead of forcing everything through third-party services.
|
||||
- **Grounded behavior matters**: Leon prefers explicit tools, context, and memory over vague model-only responses.
|
||||
- **Extensibility matters**: skills, toolkits, bridges, and binaries make it possible to keep Leon modular.
|
||||
- **Open source matters**: anyone can inspect the architecture, build on top of it, and help shape where it goes next.
|
||||
|
||||
## 🚀 Getting Started
|
||||
|
||||
### Prerequisites
|
||||
|
||||
- [Node.js](https://nodejs.org/) >= 24.0.0
|
||||
- Supported OSes: Linux, macOS, and Windows
|
||||
|
||||
Recommended: manage Node.js with [Volta](https://volta.sh/).
|
||||
|
||||
### Installation
|
||||
|
||||
```sh
|
||||
# Clone the repository
|
||||
git clone https://github.com/leon-ai/leon.git
|
||||
|
||||
# Go to the project root
|
||||
cd leon
|
||||
|
||||
# Install pnpm
|
||||
npm install --global pnpm@latest
|
||||
|
||||
# Install dependencies
|
||||
pnpm install
|
||||
```
|
||||
|
||||
### Run Leon
|
||||
|
||||
```sh
|
||||
# Run Leon
|
||||
pnpm start
|
||||
```
|
||||
|
||||
### Check Your Setup
|
||||
|
||||
```sh
|
||||
# Check the setup went well
|
||||
pnpm run check
|
||||
```
|
||||
|
||||
By default, Leon runs locally and the app is available on `http://localhost:5366`.
|
||||
|
||||
## 🏗️ Architecture Snapshot
|
||||
|
||||
At a high level, Leon currently consists of:
|
||||
|
||||
- `server/`: the main runtime, routing, memory, context management, HTTP API, and agent/controlled execution
|
||||
- `app/`: the web application
|
||||
- `aurora/`: UI components and preview environment
|
||||
- `skills/`: built-in capabilities, split between `native/` skills and `agent/` skills
|
||||
- `bridges/`: Node.js and Python bridges plus toolkit definitions and tool runtimes
|
||||
- `tcp_server/`: Python services used by parts of the runtime stack
|
||||
- `core/context/`: generated identity and architecture context documents that describe Leon's current behavior
|
||||
|
||||
This repository already includes skills and toolkits for areas such as search, productivity, system utilities, media workflows, coding assistance, memory-backed interactions, and voice/audio features.
|
||||
|
||||
## 📚 Documentation Status
|
||||
|
||||
The new docs for Leon 2.0 are not ready yet.
|
||||
|
||||
For now:
|
||||
|
||||
- treat this repository as the source of truth for the **2.0 Developer Preview**
|
||||
- use [`core/context/LEON.md`](./core/context/LEON.md) for Leon's current identity and behavior
|
||||
- use [`core/context/ARCHITECTURE.md`](./core/context/ARCHITECTURE.md) for the current architecture overview
|
||||
- expect the public docs site to lag behind the new core until the updated documentation is published
|
||||
|
||||
## ❤️ Contributing
|
||||
|
||||
We are starting to progressively onboard contributors for the **2.0 Developer Preview**.
|
||||
|
||||
If you want to follow the project or express interest in joining that onboarding:
|
||||
|
||||
- [2.0 Developer Preview contributor form](https://forms.gle/6PCG2D5rYo1q8tKMA)
|
||||
- [Roadmap](http://roadmap.getleon.ai)
|
||||
- [Discord](https://discord.gg/MNQqqKg)
|
||||
- [GitHub issues](https://github.com/leon-ai/leon/issues)
|
||||
|
||||
### Why is there a small amount of contributors?
|
||||
|
||||
Leon has been evolving for a long time, but the current 2.0 work is a major transition period.
|
||||
|
||||
For a long time, Leon was a smaller assistant project with a simpler architecture. Today, the core is being rebuilt into a much more capable system around tools, memory, context, and agent-style execution. That means a lot of things are still moving, and it makes contribution harder than it will be once the new docs and architecture settle down.
|
||||
|
||||
Another important reason is simply time: Leon is still developed largely during spare time. So progress can be uneven, and opening the project more broadly has to be balanced with keeping the direction coherent while the 2.0 Developer Preview is still taking shape.
|
||||
|
||||
## 📖 The Story Behind Leon
|
||||
|
||||
Leon started in 2017 and has been active since 2019. If you want the longer backstory, read [the story behind Leon](https://blog.getleon.ai/the-story-behind-leon/).
|
||||
|
||||
## 🔔 Stay Tuned
|
||||
|
||||
- [X / Twitter](https://x.com/grenlouis) is the main place where I share Leon progress updates
|
||||
- [Newsletter](https://leonai.substack.com/subscribe)
|
||||
- [Blog](https://blog.getleon.ai)
|
||||
- [YouTube](https://www.youtube.com/channel/UCW6mk6j6nQUzFYY97r47emQ)
|
||||
|
||||
## 👨 Author
|
||||
|
||||
**Louis Grenard** ([@grenlouis](https://x.com/grenlouis))
|
||||
|
||||
## 👍 Sponsors
|
||||
|
||||
You can also contribute by [sponsoring Leon](http://sponsor.getleon.ai).
|
||||
|
||||
## Thanks
|
||||
|
||||
|  |  |  |
|
||||
| --- | --- | --- |
|
||||
| [openai.com/form/codex-for-oss](https://openai.com/form/codex-for-oss/) | [jb.gg/OpenSource](https://jb.gg/OpenSource) | [macstadium.com/company/opensource](https://macstadium.com/company/opensource) |
|
||||
@@ -0,0 +1,7 @@
|
||||
# WeHub 来源说明
|
||||
|
||||
- 原始项目：`leon-ai/leon`
|
||||
- 原始仓库：https://github.com/leon-ai/leon
|
||||
- 导入方式：上游默认分支的最新快照
|
||||
- 原作者、版权和许可证信息以原始仓库及本仓库 LICENSE 为准
|
||||
- 本文件仅用于记录来源，不代表 WeHub 是原项目作者
|
||||
@@ -0,0 +1,220 @@
|
||||
.built-in-commands-modal {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 120;
|
||||
display: block;
|
||||
opacity: 0;
|
||||
visibility: visible;
|
||||
pointer-events: none;
|
||||
transition:
|
||||
opacity 0.18s ease,
|
||||
visibility 0.18s ease;
|
||||
}
|
||||
|
||||
.built-in-commands-modal--hidden {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.built-in-commands-modal--open {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__mask {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: rgba(0, 0, 0, 0.56);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.built-in-commands-modal__panel {
|
||||
position: absolute;
|
||||
top: 33%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -33%) scale(0.985);
|
||||
width: min(864px, 100%);
|
||||
min-height: 400px;
|
||||
max-height: min(78vh, 756px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 24px;
|
||||
background:
|
||||
linear-gradient(
|
||||
var(--a-color-background-surface),
|
||||
var(--a-color-background-surface)
|
||||
)
|
||||
padding-box,
|
||||
linear-gradient(135deg, rgba(28, 117, 219, 0.8) 0%, rgba(237, 41, 122, 0.4) 100%)
|
||||
border-box;
|
||||
box-shadow:
|
||||
0 28px 60px rgba(0, 0, 0, 0.45),
|
||||
0 0 0 1px rgba(255, 255, 255, 0.03) inset;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
transition:
|
||||
transform 0.18s cubic-bezier(0.18, 0.89, 0.32, 1.08),
|
||||
opacity 0.18s ease;
|
||||
}
|
||||
|
||||
.built-in-commands-modal--open .built-in-commands-modal__panel {
|
||||
transform: translate(-50%, -33%) scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__section {
|
||||
padding: 20px 22px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__section--top {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.built-in-commands-modal__section--bottom {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.built-in-commands-modal__section--middle {
|
||||
flex: 0 0 512px;
|
||||
height: 512px;
|
||||
min-height: 512px;
|
||||
padding: 12px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__scroll-area {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__input-field {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__input-field .aurora-input-container {
|
||||
--a-icon-container-width: 72px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__input-field .aurora-input {
|
||||
height: 72px;
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__input-field .aurora-input-icon-container {
|
||||
height: 72px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__return-button .aurora-button {
|
||||
min-height: 44px;
|
||||
min-width: 44px;
|
||||
padding: 0 14px;
|
||||
font-size: var(--a-font-size-md);
|
||||
}
|
||||
|
||||
.built-in-commands-modal__return-button .aurora-button .aurora-icon {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__suggestion-copy {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.built-in-commands-modal .aurora-list-item > .aurora-flexbox .aurora-icon {
|
||||
font-size: 28px;
|
||||
padding: 23px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal
|
||||
.aurora-list-item--selected
|
||||
.aurora-list-item-clickable-icon
|
||||
.aurora-icon {
|
||||
color: var(--a-color-accent);
|
||||
}
|
||||
|
||||
.built-in-commands-modal__result-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__result-copy,
|
||||
.built-in-commands-modal__result-value {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__result-value {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.built-in-commands-modal .aurora-scroll-container-scrollview {
|
||||
color-scheme: dark;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: rgba(255, 255, 255, 0.2) rgba(10, 14, 18, 0.9);
|
||||
}
|
||||
|
||||
.built-in-commands-modal .aurora-scroll-container-scrollview::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal
|
||||
.aurora-scroll-container-scrollview::-webkit-scrollbar-track {
|
||||
background: rgba(10, 14, 18, 0.9);
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal
|
||||
.aurora-scroll-container-scrollview::-webkit-scrollbar-thumb {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(54, 65, 76, 0.95) 0%,
|
||||
rgba(30, 38, 46, 0.95) 100%
|
||||
);
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal
|
||||
.aurora-scroll-container-scrollview::-webkit-scrollbar-thumb:hover {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(70, 82, 95, 0.98) 0%,
|
||||
rgba(40, 49, 58, 0.98) 100%
|
||||
);
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.built-in-commands-modal__panel {
|
||||
width: auto;
|
||||
min-height: 360px;
|
||||
max-height: calc(100vh - 24px);
|
||||
left: 12px;
|
||||
right: 12px;
|
||||
top: 18%;
|
||||
transform: translate(0, 0) scale(0.985);
|
||||
}
|
||||
|
||||
.built-in-commands-modal--open .built-in-commands-modal__panel {
|
||||
transform: translate(0, 0) scale(1);
|
||||
}
|
||||
|
||||
.built-in-commands-modal__section {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__section--middle {
|
||||
flex-basis: 280px;
|
||||
height: 280px;
|
||||
min-height: 280px;
|
||||
}
|
||||
|
||||
.built-in-commands-modal__result-item {
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,69 @@
|
||||
.file-system-autocomplete {
|
||||
position: fixed;
|
||||
z-index: 150;
|
||||
overflow-y: auto;
|
||||
padding: 6px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
border-radius: 8px;
|
||||
background: #111315;
|
||||
box-shadow:
|
||||
0 18px 42px rgba(0, 0, 0, 0.42),
|
||||
0 0 0 1px rgba(255, 255, 255, 0.03) inset;
|
||||
color: var(--white-color);
|
||||
}
|
||||
|
||||
.file-system-autocomplete--hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.file-system-autocomplete__item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
min-height: 42px;
|
||||
padding: 9px 10px;
|
||||
border: 0;
|
||||
border-radius: 6px;
|
||||
background: transparent;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
line-height: 1.35;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.file-system-autocomplete__item:hover,
|
||||
.file-system-autocomplete__item--selected {
|
||||
background: rgba(28, 117, 219, 0.22);
|
||||
}
|
||||
|
||||
.file-system-autocomplete__item i {
|
||||
flex: 0 0 auto;
|
||||
width: 18px;
|
||||
color: var(--blue-color);
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.file-system-autocomplete__label {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
line-height: 1.35;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.file-system-autocomplete__empty {
|
||||
padding: 10px;
|
||||
color: rgba(255, 255, 255, 0.58);
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.file-system-autocomplete::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.file-system-autocomplete::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 12px;
|
||||
}
|
||||
@@ -0,0 +1,863 @@
|
||||
@use 'sass:meta';
|
||||
|
||||
@import '@fontsource/source-sans-pro/200.css';
|
||||
@import '@fontsource/source-sans-pro/300.css';
|
||||
@import '@fontsource/source-sans-pro/400.css';
|
||||
@import '@fontsource/source-sans-pro/600.css';
|
||||
@import '@fontsource/source-sans-pro/700.css';
|
||||
@import '@fontsource/source-sans-pro/900.css';
|
||||
@import 'remixicon/fonts/remixicon.css';
|
||||
|
||||
@include meta.load-css('tool-ui');
|
||||
@include meta.load-css('voice-energy/main');
|
||||
@include meta.load-css('file-system-autocomplete');
|
||||
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframes,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote:before,
|
||||
blockquote:after,
|
||||
q:before,
|
||||
q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
|
||||
--black-color: #000;
|
||||
--light-black-color: #222426;
|
||||
--white-color: #fff;
|
||||
--grey-color: #323739;
|
||||
--blue-color: #1c75db;
|
||||
--pink-color: #ed297a;
|
||||
--sessions-panel-width: 292px;
|
||||
|
||||
--a-loader-size-md: 20px !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#feed ul li:not(.aurora-list-item) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--white-color);
|
||||
background-color: var(--black-color);
|
||||
font-family:
|
||||
'Source Sans Pro',
|
||||
system-ui,
|
||||
-apple-system,
|
||||
BlinkMacSystemFont,
|
||||
'Segoe UI',
|
||||
Roboto,
|
||||
'Helvetica Neue',
|
||||
Arial,
|
||||
'Noto Sans',
|
||||
sans-serif,
|
||||
'Apple Color Emoji',
|
||||
'Segoe UI Emoji',
|
||||
'Segoe UI Symbol',
|
||||
'Noto Color Emoji';
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
|
||||
@keyframes plan-tool-status-cozy-shine {
|
||||
0% {
|
||||
opacity: 0.4;
|
||||
filter: drop-shadow(0 0 0 rgba(255, 255, 255, 0));
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 1;
|
||||
filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.22));
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0.4;
|
||||
filter: drop-shadow(0 0 0 rgba(255, 255, 255, 0));
|
||||
}
|
||||
}
|
||||
|
||||
#feed
|
||||
.bubble-container[data-message-id^='plan-']
|
||||
.aurora-list
|
||||
.aurora-list-item--center:last-child
|
||||
.aurora-status
|
||||
.aurora-icon {
|
||||
animation: plan-tool-status-cozy-shine 2.6s ease-in-out infinite;
|
||||
}
|
||||
|
||||
body > * {
|
||||
transition: opacity 0.5s;
|
||||
}
|
||||
body.settingup > *:not(#init) {
|
||||
opacity: 0;
|
||||
}
|
||||
#init .not-initialized {
|
||||
visibility: hidden;
|
||||
}
|
||||
#init .initialized {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
kbd {
|
||||
font-family: 'Source Sans Pro', monospace;
|
||||
display: inline-block;
|
||||
background-color: var(--light-black-color);
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
min-width: 16px;
|
||||
min-height: 16px;
|
||||
line-height: 16px !important;
|
||||
padding: 2px 6px !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
#sessions-panel {
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
top: 2%;
|
||||
bottom: 8%;
|
||||
width: var(--sessions-panel-width);
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.12);
|
||||
color: var(--white-color);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#sessions-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 14px 14px 0;
|
||||
}
|
||||
|
||||
#sessions-eyebrow {
|
||||
color: rgba(255, 255, 255, 0.42);
|
||||
font-size: 0.9rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#new-session,
|
||||
.session-action {
|
||||
border: 0;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
color: var(--white-color);
|
||||
cursor: pointer;
|
||||
transition:
|
||||
background-color 0.18s,
|
||||
color 0.18s,
|
||||
transform 0.18s;
|
||||
}
|
||||
|
||||
#new-session {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 8px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
#new-session:hover,
|
||||
.session-action:hover {
|
||||
background: rgba(28, 117, 219, 0.22);
|
||||
color: #86bdff;
|
||||
}
|
||||
|
||||
#sessions-list {
|
||||
height: calc(100% - 48px);
|
||||
padding-right: 14px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#sessions-list::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
#sessions-list::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.16);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.session-group {
|
||||
position: relative;
|
||||
padding: 0 0 12px 14px;
|
||||
}
|
||||
|
||||
.session-group::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
top: 22px;
|
||||
bottom: 0;
|
||||
width: 1px;
|
||||
background: linear-gradient(
|
||||
rgba(28, 117, 219, 0.7),
|
||||
rgba(237, 41, 122, 0.22)
|
||||
);
|
||||
}
|
||||
|
||||
.session-group-title {
|
||||
position: relative;
|
||||
margin-bottom: 8px;
|
||||
color: rgba(255, 255, 255, 0.44);
|
||||
font-size: 0.78rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.session-group-title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -14px;
|
||||
top: 7px;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
border-radius: 50%;
|
||||
background: var(--blue-color);
|
||||
box-shadow: 0 0 12px rgba(28, 117, 219, 0.8);
|
||||
}
|
||||
|
||||
.session-item {
|
||||
position: relative;
|
||||
padding: 10px 8px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
animation: sessionTimelineIn 0.24s ease-out both;
|
||||
}
|
||||
|
||||
.session-item:hover,
|
||||
.session-item--active {
|
||||
background: rgba(255, 255, 255, 0.07);
|
||||
}
|
||||
|
||||
.session-item--active::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -11px;
|
||||
top: 18px;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 50%;
|
||||
background: var(--pink-color);
|
||||
box-shadow: 0 0 10px rgba(237, 41, 122, 0.9);
|
||||
}
|
||||
|
||||
.session-title {
|
||||
overflow: hidden;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 0.98rem;
|
||||
font-weight: 700;
|
||||
line-height: 1.2rem;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.session-meta {
|
||||
overflow: hidden;
|
||||
margin-top: 2px;
|
||||
color: rgba(255, 255, 255, 0.36);
|
||||
font-size: 0.8rem;
|
||||
line-height: 1rem;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.session-actions {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
margin-top: 8px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.16s;
|
||||
}
|
||||
|
||||
.session-item:hover .session-actions,
|
||||
.session-item--active .session-actions {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.session-action {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.session-action[aria-pressed='true'] {
|
||||
color: #ff7caf;
|
||||
}
|
||||
|
||||
@keyframes sessionTimelineIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(8px);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
position: absolute;
|
||||
width: calc(94% - var(--sessions-panel-width));
|
||||
top: 0;
|
||||
left: calc(4% + var(--sessions-panel-width));
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#footer {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
left: calc(4% + var(--sessions-panel-width));
|
||||
bottom: 2%;
|
||||
width: calc(94% - var(--sessions-panel-width));
|
||||
line-height: 18px;
|
||||
}
|
||||
#logo-container {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
}
|
||||
#version {
|
||||
color: var(--grey-color);
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
text-align: center;
|
||||
color: var(--white-color);
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-bottom: 2px solid var(--grey-color);
|
||||
background: none;
|
||||
font-weight: 600;
|
||||
font-size: 4em;
|
||||
padding-right: 39px;
|
||||
height: 140px;
|
||||
resize: none;
|
||||
overflow-y: auto;
|
||||
}
|
||||
textarea::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
textarea::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
#tip {
|
||||
display: inline-flex;
|
||||
margin-top: 2px;
|
||||
color: var(--white-color);
|
||||
line-height: 22px;
|
||||
font-size: 0.9em;
|
||||
gap: 20px;
|
||||
li {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#logo {
|
||||
background: no-repeat url(../img/logo.svg);
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
#top-container {
|
||||
position: absolute;
|
||||
top: 2%;
|
||||
color: var(--grey-color);
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#mood {
|
||||
position: relative;
|
||||
font-size: 16px;
|
||||
}
|
||||
#info {
|
||||
position: relative;
|
||||
text-decoration: underline;
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--grey-color);
|
||||
cursor: pointer;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
#feed {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 6%;
|
||||
height: 58%;
|
||||
overflow-y: auto;
|
||||
border: 2px solid var(--grey-color);
|
||||
border-radius: 12px;
|
||||
}
|
||||
#feed::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
#feed::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
#no-bubble {
|
||||
margin-top: 64px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#is-typing {
|
||||
position: absolute;
|
||||
top: 65%;
|
||||
padding: 0 8px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
#is-typing.on {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#is-typing .circle {
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background-color: var(--white-color);
|
||||
transform: scale(1);
|
||||
}
|
||||
#is-typing .circle:nth-child(1) {
|
||||
animation: typing 0.2s linear infinite alternate;
|
||||
background-color: #0071f0;
|
||||
}
|
||||
#is-typing .circle:nth-child(2) {
|
||||
animation: typing 0.2s 0.2s linear infinite alternate;
|
||||
background-color: var(--white-color);
|
||||
}
|
||||
#is-typing .circle:nth-child(3) {
|
||||
animation: typing 0.2s linear infinite alternate;
|
||||
background-color: #ec297a;
|
||||
}
|
||||
@keyframes typing {
|
||||
100% {
|
||||
transform: scale(1.5);
|
||||
}
|
||||
}
|
||||
|
||||
.llm-token {
|
||||
opacity: 0;
|
||||
transition: opacity 2.5s;
|
||||
}
|
||||
|
||||
.llm-token.fade-in {
|
||||
animation: fadeIn 2.5s forwards;
|
||||
}
|
||||
|
||||
.reasoning-block-container {
|
||||
padding: 6px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.reasoning-block {
|
||||
max-width: 72%;
|
||||
border: 1px solid rgba(255, 255, 255, 0.16);
|
||||
border-radius: 12px;
|
||||
background-color: #111315;
|
||||
overflow: hidden;
|
||||
animation: fadeIn 0.2s ease-in forwards;
|
||||
}
|
||||
|
||||
.reasoning-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 8px 12px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background-color: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
|
||||
.reasoning-icon {
|
||||
color: var(--blue-color);
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.reasoning-title {
|
||||
font-size: 0.85rem;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
.reasoning-content {
|
||||
padding: 10px 12px;
|
||||
font-family: 'Courier New', Consolas, monospace;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.45;
|
||||
color: rgba(255, 255, 255, 0.82);
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
max-height: 296px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.reasoning-content::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.reasoning-content::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.reasoning-token {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.reasoning-token.fade-in {
|
||||
animation: fadeIn 0.35s forwards;
|
||||
}
|
||||
|
||||
.bubble-container {
|
||||
padding: 6px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: fit-content;
|
||||
max-width: 85%;
|
||||
}
|
||||
.bubble-container.me {
|
||||
margin-left: auto;
|
||||
align-items: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
.bubble-container.leon {
|
||||
margin-right: auto;
|
||||
align-items: flex-start;
|
||||
text-align: left;
|
||||
}
|
||||
.show-more {
|
||||
margin: 3px;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.show-more:hover {
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
.show-all {
|
||||
max-height: 100% !important;
|
||||
}
|
||||
|
||||
.bubble {
|
||||
padding: 10px 16px;
|
||||
border-radius: 16px;
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
word-break: break-word;
|
||||
text-align: left;
|
||||
opacity: 0;
|
||||
animation: fadeIn 0.2s ease-in forwards;
|
||||
overflow: hidden;
|
||||
font-size: 1.8rem;
|
||||
line-height: 2.4rem;
|
||||
}
|
||||
.bubble-metrics {
|
||||
cursor: default;
|
||||
margin-top: 2px;
|
||||
padding: 0 4px;
|
||||
display: inline-flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
gap: 10px;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.2rem;
|
||||
color: var(--grey-color);
|
||||
align-self: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
.bubble-metric-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
.bubble-metric-item i {
|
||||
font-size: 1rem;
|
||||
}
|
||||
#feed .me .bubble-metrics {
|
||||
text-align: right;
|
||||
}
|
||||
#feed .me .bubble {
|
||||
background-color: #1c75db;
|
||||
color: var(--white-color);
|
||||
right: 0;
|
||||
}
|
||||
#feed .leon .bubble {
|
||||
background-color: var(--light-black-color);
|
||||
color: var(--white-color);
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#input-container {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 13%;
|
||||
}
|
||||
|
||||
#mic-container {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
margin-top: 38px;
|
||||
}
|
||||
|
||||
.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#mic-button {
|
||||
position: absolute;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
border-radius: 50%;
|
||||
background-color: #888;
|
||||
-webkit-mask-image: url(../img/mic.svg);
|
||||
mask-image: url(../img/mic.svg);
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
#mic-button:not(.enabled) {
|
||||
margin-left: -26px;
|
||||
}
|
||||
#mic-button:hover {
|
||||
background-color: var(--white-color);
|
||||
}
|
||||
#mic-button.enabled {
|
||||
background-color: #00e676;
|
||||
}
|
||||
#mic-button.enabled + #sonar {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
border-radius: 50%;
|
||||
opacity: 0.3;
|
||||
background-color: #575757;
|
||||
pointer-events: none;
|
||||
animation: sonar 1.3s linear infinite;
|
||||
}
|
||||
@keyframes sonar {
|
||||
25% {
|
||||
transform: scale(1.5);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
60% {
|
||||
transform: scale(1.5);
|
||||
}
|
||||
75% {
|
||||
transform: scale(2);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
/* Clickable URL styles */
|
||||
.clickable-url {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Clickable file path styles */
|
||||
.clickable-path {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media (max-width: 940px) {
|
||||
:root {
|
||||
--sessions-panel-width: 100%;
|
||||
}
|
||||
|
||||
#sessions-panel {
|
||||
left: 4%;
|
||||
right: 4%;
|
||||
top: 1%;
|
||||
bottom: auto;
|
||||
width: auto;
|
||||
height: 168px;
|
||||
border-right: 0;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
#sessions-list {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
height: 112px;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.session-group {
|
||||
min-width: 220px;
|
||||
}
|
||||
|
||||
main {
|
||||
top: 176px;
|
||||
left: 4%;
|
||||
width: 92%;
|
||||
height: calc(100% - 176px);
|
||||
}
|
||||
|
||||
#footer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#top-container {
|
||||
top: 1%;
|
||||
}
|
||||
|
||||
#feed {
|
||||
top: 7%;
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
#is-typing {
|
||||
top: 58%;
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-size: 2.4em;
|
||||
}
|
||||
|
||||
#tip {
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,418 @@
|
||||
/* Tool Output Container Styles */
|
||||
.tool-group-container {
|
||||
margin: 10px 6px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
border-radius: 14px;
|
||||
background:
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.04) 0%,
|
||||
rgba(255, 255, 255, 0.02) 100%
|
||||
),
|
||||
#15181a;
|
||||
box-shadow:
|
||||
0 10px 30px rgba(0, 0, 0, 0.24),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.03);
|
||||
opacity: 0;
|
||||
animation: fadeIn 0.3s ease-in forwards;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tool-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
width: 100%;
|
||||
padding: 14px 16px;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
text-align: left;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.tool-header:hover {
|
||||
background-color: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
|
||||
.tool-icon {
|
||||
color: var(--blue-color);
|
||||
font-size: 18px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.tool-name {
|
||||
flex: 1;
|
||||
font-weight: 600;
|
||||
color: var(--white-color);
|
||||
font-size: 0.95em;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
color: rgba(255, 255, 255, 0.48);
|
||||
font-size: 18px;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.expand-icon.rotated {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.tool-content {
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
transition: max-height 0.3s ease, border-top-color 0.2s ease;
|
||||
border-top: 1px solid transparent;
|
||||
}
|
||||
|
||||
.tool-content.expanded {
|
||||
max-height: 900px;
|
||||
overflow-y: auto;
|
||||
border-top-color: rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.tool-content::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
.tool-content::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.shell-output {
|
||||
padding: 12px;
|
||||
background-color: #0d1117;
|
||||
border-radius: 0 0 14px 14px;
|
||||
min-height: 40px;
|
||||
font-family: 'Courier New', Consolas, monospace;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.shell-message {
|
||||
margin: 2px 0;
|
||||
line-height: 1.4;
|
||||
color: #e6edf3;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.shell-prompt {
|
||||
color: var(--pink-color);
|
||||
font-weight: bold;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.shell-message .clickable-path {
|
||||
color: var(--blue-color);
|
||||
background-color: rgba(28, 117, 219, 0.1);
|
||||
padding: 1px 4px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid rgba(28, 117, 219, 0.3);
|
||||
}
|
||||
|
||||
.shell-message .clickable-url {
|
||||
color: var(--blue-color);
|
||||
}
|
||||
|
||||
.tool-activity-card {
|
||||
background:
|
||||
radial-gradient(
|
||||
circle at top right,
|
||||
rgba(28, 117, 219, 0.14),
|
||||
transparent 32%
|
||||
),
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.04) 0%,
|
||||
rgba(255, 255, 255, 0.02) 100%
|
||||
),
|
||||
#15181a;
|
||||
}
|
||||
|
||||
.agent-skill-activity-card {
|
||||
background:
|
||||
radial-gradient(
|
||||
circle at top right,
|
||||
rgba(237, 41, 122, 0.14),
|
||||
transparent 32%
|
||||
),
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.04) 0%,
|
||||
rgba(255, 255, 255, 0.02) 100%
|
||||
),
|
||||
#15181a;
|
||||
}
|
||||
|
||||
.agent-skill-activity-card .tool-icon {
|
||||
color: #ed297a;
|
||||
}
|
||||
|
||||
.tool-activity-header {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.tool-activity-heading {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.tool-activity-title-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.tool-title {
|
||||
color: var(--white-color);
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.tool-subtitle {
|
||||
color: rgba(255, 255, 255, 0.58);
|
||||
font-size: 0.86rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.tool-activity-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.tool-status-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 72px;
|
||||
padding: 5px 10px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid transparent;
|
||||
font-size: 0.76rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.02em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.tool-status-chip.running {
|
||||
color: #9fd2ff;
|
||||
background-color: rgba(28, 117, 219, 0.14);
|
||||
border-color: rgba(28, 117, 219, 0.28);
|
||||
}
|
||||
|
||||
.tool-status-chip.success {
|
||||
color: #93f0c1;
|
||||
background-color: rgba(36, 178, 101, 0.15);
|
||||
border-color: rgba(36, 178, 101, 0.28);
|
||||
}
|
||||
|
||||
.tool-status-chip.selected {
|
||||
color: #93f0c1;
|
||||
background-color: rgba(36, 178, 101, 0.15);
|
||||
border-color: rgba(36, 178, 101, 0.28);
|
||||
}
|
||||
|
||||
.tool-status-chip.observed {
|
||||
color: #f5d48a;
|
||||
background-color: rgba(210, 157, 38, 0.15);
|
||||
border-color: rgba(210, 157, 38, 0.3);
|
||||
}
|
||||
|
||||
.tool-status-chip.error {
|
||||
color: #ffb0b0;
|
||||
background-color: rgba(237, 41, 122, 0.14);
|
||||
border-color: rgba(237, 41, 122, 0.28);
|
||||
}
|
||||
|
||||
.tool-activity-summary {
|
||||
padding: 16px 16px 4px;
|
||||
color: rgba(255, 255, 255, 0.82);
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.tool-activity-sections {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 12px;
|
||||
padding: 12px 16px 16px;
|
||||
}
|
||||
|
||||
.tool-activity-sections.single {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.tool-activity-panel {
|
||||
border: 1px solid rgba(255, 255, 255, 0.07);
|
||||
border-radius: 12px;
|
||||
background-color: rgba(255, 255, 255, 0.025);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.tool-panel-heading {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
padding: 12px 14px 10px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.tool-panel-title {
|
||||
color: var(--white-color);
|
||||
font-size: 0.84rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
|
||||
.tool-panel-description {
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
|
||||
.tool-panel-body {
|
||||
padding: 12px 14px 14px;
|
||||
min-height: 72px;
|
||||
}
|
||||
|
||||
.tool-output-summary {
|
||||
margin-bottom: 10px;
|
||||
color: rgba(255, 255, 255, 0.86);
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.tool-empty-state {
|
||||
color: rgba(255, 255, 255, 0.45);
|
||||
font-size: 0.88rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.tool-kv-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.tool-kv-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.tool-kv-key {
|
||||
color: rgba(255, 255, 255, 0.52);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.03em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.tool-kv-value {
|
||||
color: rgba(255, 255, 255, 0.88);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.tool-rich-text {
|
||||
color: rgba(255, 255, 255, 0.88);
|
||||
line-height: 1.45;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.tool-command-output {
|
||||
margin: 0;
|
||||
max-height: 320px;
|
||||
overflow: auto;
|
||||
color: rgba(255, 255, 255, 0.86);
|
||||
font-family: 'Courier New', Consolas, monospace;
|
||||
font-size: 0.84rem;
|
||||
line-height: 1.45;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.tool-rich-text .clickable-path {
|
||||
color: var(--blue-color);
|
||||
background-color: rgba(28, 117, 219, 0.1);
|
||||
padding: 1px 4px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid rgba(28, 117, 219, 0.3);
|
||||
}
|
||||
|
||||
.tool-rich-text .clickable-url {
|
||||
color: var(--blue-color);
|
||||
}
|
||||
|
||||
.tool-value-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
margin-left: 18px;
|
||||
}
|
||||
|
||||
.tool-value-list li {
|
||||
color: rgba(255, 255, 255, 0.88);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.tool-raw-details {
|
||||
margin: 0 16px 16px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
||||
padding-top: 12px;
|
||||
}
|
||||
|
||||
.tool-raw-details summary {
|
||||
cursor: pointer;
|
||||
color: rgba(255, 255, 255, 0.62);
|
||||
font-size: 0.82rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.03em;
|
||||
text-transform: uppercase;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tool-raw-details summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tool-raw-content {
|
||||
margin-top: 12px;
|
||||
padding: 12px 14px;
|
||||
border-radius: 10px;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
color: rgba(255, 255, 255, 0.78);
|
||||
font-family: 'Courier New', Consolas, monospace;
|
||||
font-size: 0.84rem;
|
||||
line-height: 1.45;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 700px) {
|
||||
.tool-activity-sections {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.tool-activity-header {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.tool-activity-meta {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.tool-status-chip {
|
||||
min-width: 64px;
|
||||
padding: 5px 8px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
@use 'sass:color';
|
||||
|
||||
$voice-neon-pink-color: #ed297a;
|
||||
$voice-neon-blue-color: #1c75db;
|
||||
$voice-neon-shadow-color: color.mix(
|
||||
$voice-neon-pink-color,
|
||||
$voice-neon-blue-color
|
||||
);
|
||||
@@ -0,0 +1,162 @@
|
||||
/**
|
||||
* Overlay and containers
|
||||
*/
|
||||
|
||||
body.voice-mode-enabled {
|
||||
#voice-overlay-transitor,
|
||||
#voice-overlay-bg {
|
||||
visibility: visible;
|
||||
}
|
||||
#voice-overlay-bg {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
#voice-overlay-transitor {
|
||||
position: fixed;
|
||||
background-color: var(--black-color);
|
||||
z-index: 10;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
will-change: transform;
|
||||
animation: scaleIn 1s;
|
||||
}
|
||||
@keyframes scaleIn {
|
||||
0% {
|
||||
transform: scale3d(0, 0, 1);
|
||||
}
|
||||
100% {
|
||||
transform: scale3d(172, 172, 1);
|
||||
}
|
||||
}
|
||||
|
||||
#voice-status,
|
||||
#voice-tips {
|
||||
color: var(--grey-color);
|
||||
text-align: center;
|
||||
}
|
||||
#voice-status {
|
||||
font-size: 17px;
|
||||
font-style: italic;
|
||||
}
|
||||
#voice-tips {
|
||||
margin-top: 32px;
|
||||
line-height: 18px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
#voice-overlay-bg {
|
||||
visibility: hidden;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 100;
|
||||
will-change: opacity;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
// backdrop-filter: saturate(140%) blur(5px);
|
||||
/*background-color: rgba(0, 0, 0, .9);*/
|
||||
background-color: var(--black-color);
|
||||
}
|
||||
@keyframes skipFadeIn {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#voice-container {
|
||||
opacity: 0;
|
||||
position: relative;
|
||||
top: 64px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 1024px;
|
||||
height: 756px;
|
||||
align-items: center;
|
||||
gap: 64px;
|
||||
animation: fadeIn 1s 3s both;
|
||||
}
|
||||
|
||||
#voice-energy-container {
|
||||
--neon-size: 228px;
|
||||
|
||||
// animation: fadeIn 1s 1.5s both;
|
||||
//opacity: 0;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
height: 400px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
p#voice-speech {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 3rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/**
|
||||
* Neons
|
||||
*/
|
||||
|
||||
.voice-neon {
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
width: var(--neon-size);
|
||||
height: var(--neon-size);
|
||||
}
|
||||
|
||||
#purple-neon-blur {
|
||||
--neon-blur: calc(var(--neon-size) + 96px);
|
||||
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
opacity: 0.7;
|
||||
width: var(--neon-blur);
|
||||
height: var(--neon-blur);
|
||||
}
|
||||
|
||||
#blue-neon-1 {
|
||||
margin-top: -8px;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
#blue-neon-2 {
|
||||
margin-top: 8px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Particles
|
||||
*/
|
||||
|
||||
.voice-particle {
|
||||
position: absolute;
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
border-radius: 50%;
|
||||
opacity: 1;
|
||||
will-change: transform, opacity;
|
||||
animation-duration: 1s;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
.voice-particle.blue {
|
||||
background-color: #c4e0ff;
|
||||
box-shadow: 0 0 2px 2px var(--blue-color);
|
||||
}
|
||||
.voice-particle.pink {
|
||||
background-color: #ffb9d7;
|
||||
box-shadow: 0 0 2px 2px var(--pink-color);
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
@use 'variables' as *;
|
||||
|
||||
/**
|
||||
* IDLE status
|
||||
*/
|
||||
|
||||
#voice-energy-container.idle {
|
||||
.voice-particle {
|
||||
visibility: hidden;
|
||||
animation-play-state: paused;
|
||||
opacity: 0;
|
||||
}
|
||||
.voice-neon {
|
||||
margin: 0;
|
||||
}
|
||||
#purple-neon-blur {
|
||||
transform: scale(1);
|
||||
}
|
||||
#purple-neon-blur circle {
|
||||
filter: drop-shadow(0px 0px 64px $voice-neon-shadow-color);
|
||||
animation: idleNeonBlurBreath 2.2s infinite alternate;
|
||||
}
|
||||
#pink-neon-1 {
|
||||
transform: scale(1);
|
||||
animation: idleBouncePinkNeon1 1.8s 1s infinite alternate;
|
||||
}
|
||||
#blue-neon-1 {
|
||||
transform: scale(0.8);
|
||||
animation: idleMoveBlueNeon1 1.8s infinite alternate;
|
||||
}
|
||||
#blue-neon-2 {
|
||||
transform: scale(0.9);
|
||||
animation: idleMoveBlueNeon2 1.8s 0.5s infinite alternate;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes idleNeonBlurBreath {
|
||||
100% {
|
||||
filter: drop-shadow(0px 0px 0px $voice-neon-shadow-color);
|
||||
}
|
||||
}
|
||||
@keyframes idleBouncePurpleNeonBlur {
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes idleBouncePinkNeon1 {
|
||||
100% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
@keyframes idleMoveBlueNeon1 {
|
||||
100% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
}
|
||||
@keyframes idleMoveBlueNeon2 {
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
@use 'variables' as *;
|
||||
|
||||
/**
|
||||
* Listening status
|
||||
*/
|
||||
|
||||
#voice-energy-container.listening {
|
||||
.voice-particle {
|
||||
visibility: hidden;
|
||||
animation-play-state: paused;
|
||||
opacity: 0;
|
||||
}
|
||||
.voice-neon {
|
||||
margin: 0;
|
||||
}
|
||||
#purple-neon-blur {
|
||||
transform: scale(1);
|
||||
}
|
||||
#purple-neon-blur circle {
|
||||
filter: drop-shadow(0px 0px 64px $voice-neon-shadow-color);
|
||||
animation: listeningNeonBlurBreath 0.7s infinite alternate;
|
||||
}
|
||||
#pink-neon-1 {
|
||||
transform: scale(1);
|
||||
animation: listeningBouncePinkNeon1 0.3s 1s infinite alternate;
|
||||
}
|
||||
#blue-neon-1 {
|
||||
transform: scale(0.8);
|
||||
animation: listeningMoveBlueNeon1 0.3s infinite alternate;
|
||||
}
|
||||
#blue-neon-2 {
|
||||
transform: scale(0.9);
|
||||
animation: listeningMoveBlueNeon2 0.3s 0.5s infinite alternate;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes listeningNeonBlurBreath {
|
||||
100% {
|
||||
filter: drop-shadow(0px 0px 0px $voice-neon-shadow-color);
|
||||
}
|
||||
}
|
||||
@keyframes listeningBouncePurpleNeonBlur {
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes listeningBouncePinkNeon1 {
|
||||
100% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
@keyframes listeningMoveBlueNeon1 {
|
||||
100% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
}
|
||||
@keyframes listeningMoveBlueNeon2 {
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
@use 'base';
|
||||
@use 'listening';
|
||||
@use 'idle';
|
||||
@use 'processing';
|
||||
@use 'talking';
|
||||
@@ -0,0 +1,88 @@
|
||||
@use 'sass:math';
|
||||
|
||||
/**
|
||||
* Processing status
|
||||
*/
|
||||
|
||||
#voice-energy-container.processing {
|
||||
#purple-neon-blur {
|
||||
animation: processingBouncePurpleNeonBlur 1s infinite alternate;
|
||||
}
|
||||
#pink-neon-1 {
|
||||
animation: processingBouncePinkNeon1 0.5s infinite alternate;
|
||||
}
|
||||
#blue-neon-1 {
|
||||
animation: processingMoveBlueNeon1 0.5s infinite alternate;
|
||||
}
|
||||
#blue-neon-2 {
|
||||
animation: processingMoveBlueNeon2 0.5s infinite alternate;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes processingBouncePurpleNeonBlur {
|
||||
50% {
|
||||
transform: scale(1.07);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes processingBouncePinkNeon1 {
|
||||
50% {
|
||||
transform: scale(1.02);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes processingMoveBlueNeon1 {
|
||||
0% {
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
33% {
|
||||
transform: translateY(-3px) translateX(-2px);
|
||||
}
|
||||
66% {
|
||||
transform: translateY(-3px) translateX(3px);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(-3px) translateX(1px);
|
||||
}
|
||||
}
|
||||
@keyframes processingMoveBlueNeon2 {
|
||||
0% {
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
33% {
|
||||
transform: translateY(3px) translateX(2px);
|
||||
}
|
||||
66% {
|
||||
transform: translateY(3px) translateX(3px);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(3px) translateX(-1px);
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 0 through 31 {
|
||||
.processing .voice-particle[data-particle='#{$i}'] {
|
||||
animation-delay: #{$i * 0.1}s;
|
||||
}
|
||||
|
||||
.processing .voice-particle[data-particle='#{$i}'] {
|
||||
animation-name: processingMoveParticle#{$i};
|
||||
}
|
||||
|
||||
#voice-energy-container.processing {
|
||||
@keyframes processingMoveParticle#{$i} {
|
||||
75% {
|
||||
opacity: 0.1;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(math.cos(11.25deg * $i) * 110px)
|
||||
translateY(math.sin(11.25deg * $i) * 110px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
@use 'sass:math';
|
||||
|
||||
/**
|
||||
* Talking status
|
||||
*/
|
||||
|
||||
#voice-energy-container.talking {
|
||||
.voice-neon {
|
||||
margin: 0;
|
||||
}
|
||||
#purple-neon-blur {
|
||||
animation: talkingBouncePurpleNeonBlur 1s infinite alternate;
|
||||
}
|
||||
#pink-neon-1 {
|
||||
transform: scale(1);
|
||||
animation: talkingBouncePinkNeon1 0.5s 1s infinite alternate;
|
||||
}
|
||||
#blue-neon-1 {
|
||||
transform: scale(0.8);
|
||||
animation: talkingMoveBlueNeon1 0.5s infinite alternate;
|
||||
}
|
||||
#blue-neon-2 {
|
||||
transform: scale(0.9);
|
||||
animation: talkingMoveBlueNeon2 0.5s 0.3s infinite alternate;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes talkingBouncePurpleNeonBlur {
|
||||
50% {
|
||||
transform: scale(1.07);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes talkingBouncePinkNeon1 {
|
||||
100% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
@keyframes talkingMoveBlueNeon1 {
|
||||
100% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
}
|
||||
@keyframes talkingMoveBlueNeon2 {
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.talking .voice-particle {
|
||||
opacity: 0;
|
||||
animation-duration: 2s;
|
||||
}
|
||||
@for $i from 0 through 31 {
|
||||
.talking .voice-particle[data-particle='#{$i}'] {
|
||||
animation-delay: #{$i * 0.2}s;
|
||||
// animation-duration: #{$i * 0.5}s;
|
||||
}
|
||||
|
||||
.talking .voice-particle[data-particle='#{$i}'] {
|
||||
animation-name: talkingMoveParticle#{$i};
|
||||
}
|
||||
|
||||
#voice-energy-container.talking {
|
||||
@keyframes talkingMoveParticle#{$i} {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translate(0);
|
||||
}
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translateX(math.cos(math.random() * 360deg))
|
||||
translateY(math.sin(math.random() * 360deg));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from './timer'
|
||||
@@ -0,0 +1 @@
|
||||
export * from './timer'
|
||||
@@ -0,0 +1,71 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
|
||||
import { CircularProgress, Flexbox, Text } from '@aurora'
|
||||
|
||||
interface TimerProps {
|
||||
initialTime: number
|
||||
interval: number
|
||||
totalTimeContent: string
|
||||
initialProgress?: number
|
||||
onEnd?: () => void
|
||||
}
|
||||
|
||||
function formatTime(seconds: number): string {
|
||||
const minutes = seconds >= 60 ? Math.floor(seconds / 60) : 0
|
||||
const remainingSeconds = seconds % 60
|
||||
const formattedMinutes = minutes < 10 ? `0${minutes}` : minutes
|
||||
const formattedSeconds =
|
||||
remainingSeconds < 10 ? `0${remainingSeconds}` : remainingSeconds
|
||||
|
||||
return `${formattedMinutes}:${formattedSeconds}`
|
||||
}
|
||||
|
||||
export function Timer({
|
||||
initialTime,
|
||||
initialProgress,
|
||||
interval,
|
||||
totalTimeContent,
|
||||
onEnd
|
||||
}: TimerProps) {
|
||||
const [progress, setProgress] = useState(initialProgress || 0)
|
||||
const [timeLeft, setTimeLeft] = useState(initialTime)
|
||||
|
||||
useEffect(() => {
|
||||
setTimeLeft(initialTime)
|
||||
setProgress(progress)
|
||||
}, [initialTime])
|
||||
|
||||
useEffect(() => {
|
||||
if (timeLeft <= 0) {
|
||||
return
|
||||
}
|
||||
|
||||
const timer = setInterval(() => {
|
||||
setTimeLeft((prevTime) => {
|
||||
const newTime = prevTime - 1
|
||||
|
||||
if (newTime <= 0 && onEnd) {
|
||||
onEnd()
|
||||
}
|
||||
|
||||
return newTime
|
||||
})
|
||||
setProgress((prevProgress) => prevProgress + 100 / initialTime)
|
||||
}, interval)
|
||||
|
||||
return () => clearInterval(timer)
|
||||
}, [initialTime, interval, timeLeft])
|
||||
|
||||
return (
|
||||
<CircularProgress value={progress} size="lg">
|
||||
<Flexbox gap="xs" alignItems="center" justifyContent="center">
|
||||
<Text fontSize="lg" fontWeight="semi-bold">
|
||||
{formatTime(timeLeft)}
|
||||
</Text>
|
||||
<Text fontSize="xs" secondary>
|
||||
{totalTimeContent}
|
||||
</Text>
|
||||
</Flexbox>
|
||||
</CircularProgress>
|
||||
)
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
@@ -0,0 +1,18 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg viewBox="0 0 331 344" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 52.5 (67469) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>logo</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Logo">
|
||||
<path d="M250.64,41 C270.304004,42.1610882 288.156044,52.8690755 298.438662,69.6705316 C308.721281,86.4719876 310.13355,107.241239 302.22,125.28 C301.7,126.45 301.15,127.61 300.56,128.75 C319.366788,139.878564 330.669003,160.322066 330.091728,182.167133 C329.514454,204.0122 317.148293,223.830245 297.78,233.95 C297.532922,261.641745 278.432026,285.595234 251.49,292 C250.416906,312.172645 238.230063,330.080529 219.858344,338.480949 C201.486625,346.881369 179.969731,344.38443 164.01,332 L160.44,329.23 L160.44,19.93 L162.73,17.32 C175.471771,2.76363972 195.386563,-3.2731374 214.066047,1.75848783 C232.74553,6.79011305 246.933663,22.0130721 250.64,41" id="Path" fill="#C9C9C9"></path>
|
||||
<path d="M169.67,59.35 L169.67,324.76 C183.967722,335.845903 203.509545,337.305349 219.295336,328.466179 C235.081126,319.627008 244.049498,302.203429 242.07,284.22 C268.377478,281.884446 288.549541,259.850947 288.56,233.44 C288.56,231.98 288.47,230.44 288.32,228.72 L288.26,228.14 C308.113863,220.465385 321.113357,201.267433 320.868328,179.983271 C320.623298,158.699109 307.185283,139.805514 287.16,132.59 C299.201053,117.242299 301.432492,96.3705182 292.908203,78.8241398 C284.383914,61.2777614 266.597395,50.1309998 247.09,50.11 C245.54,50.11 243.96,50.19 242.34,50.34 C242.194471,33.1294454 231.430913,17.7984963 215.292982,11.815892 C199.155051,5.83328766 180.999054,10.4432677 169.67,23.4 L169.67,59.4 L169.67,59.35 Z" id="Path" fill="#ED297A"></path>
|
||||
<path d="M311.36,180.57 C311.365994,162.074603 299.120439,145.812103 281.343516,140.707126 C263.566594,135.602149 244.558255,142.889506 234.75,158.57 L226.75,153.57 C237.365806,136.609776 256.918463,127.423938 276.75,130.08 C284.339746,122.340056 288.572378,111.920165 288.53,101.08 C288.53,78.1877971 269.972203,59.63 247.08,59.63 C245.586971,59.6271616 244.094853,59.7039372 242.61,59.86 L241.27,60.02 C237.069339,78.1206974 221.351105,91.2246721 202.79,92.1 L202.38,82.61 C216.541344,82.0019927 228.615323,72.150244 232.052357,58.3988753 C235.48939,44.6475065 229.470406,30.2735808 217.260427,23.0742928 C205.050447,15.8750049 189.55921,17.5660037 179.19,27.23 L179.19,59.35 L169.67,59.35 L169.67,23.4 C180.999054,10.4432677 199.155051,5.83328766 215.292982,11.815892 C231.430913,17.7984963 242.194471,33.1294454 242.34,50.34 C243.96,50.19 245.54,50.11 247.09,50.11 C266.597395,50.1309998 284.383914,61.2777614 292.908203,78.8241398 C301.432492,96.3705182 299.201053,117.242299 287.16,132.59 C307.185283,139.805514 320.623298,158.699109 320.868328,179.983271 C321.113357,201.267433 308.113863,220.465385 288.26,228.14 L288.32,228.72 C288.47,230.4 288.56,231.98 288.56,233.44 C288.549541,259.850947 268.377478,281.884446 242.07,284.22 C244.059426,302.206931 235.092757,319.638427 219.30298,328.47983 C203.513202,337.321234 183.96552,335.856198 169.67,324.76 L169.67,292.46 L179.19,292.46 L179.19,319.77 C190.187352,326.24397 203.809618,326.332461 214.890148,320.00191 C225.970679,313.671359 232.812253,301.891425 232.82,289.13 C232.824107,287.712866 232.740615,286.296832 232.57,284.89 L232.48,284.16 C219.501568,282.845584 207.520172,276.607958 199,266.73 L206.18,260.52 C217.502416,273.612717 235.767179,278.293513 251.991106,272.260226 C268.215032,266.226939 278.983405,250.749421 279,233.44 C279,232.44 279,231.57 278.93,230.74 C251.386749,235.675319 225.010632,217.49628 219.82,190 L229.16,188.25 C233.129854,209.273133 252.444519,223.823215 273.746894,221.838103 C295.049269,219.852991 311.342948,201.984662 311.36,180.59" id="Path" fill="#FFFFFF"></path>
|
||||
<path d="M79.47,41.29 C59.8066341,42.447746 41.9539463,53.1534482 31.6708751,69.95365 C21.3878039,86.7538518 19.9756696,107.522492 27.89,125.56 C28.41,126.74 28.96,127.9 29.56,129.04 C10.7637431,140.17517 -0.530524844,160.614207 0.044524719,182.453634 C0.619574282,204.293062 12.9737988,224.109415 32.33,234.24 C32.5705294,261.940431 51.6712753,285.906111 78.62,292.32 C79.6930938,312.492645 91.8799368,330.400529 110.251656,338.800949 C128.623375,347.201369 150.140269,344.70443 166.1,332.32 L169.67,329.55 L169.67,20.23 L167.38,17.62 C154.639626,3.06383185 134.726538,-2.9741018 116.047549,2.05526536 C97.3685601,7.08463252 83.1792521,22.3047265 79.47,41.29" id="Path" fill="#C9C9C9"></path>
|
||||
<path d="M160.44,59.64 L160.44,325.06 C146.143061,336.173463 126.582248,337.648732 110.780169,328.805327 C94.9780899,319.961922 86.0050706,302.518105 88,284.52 C61.696479,282.179578 41.5299972,260.147436 41.52,233.74 C41.52,232.28 41.6,230.74 41.75,229.02 L41.81,228.44 C21.9555682,220.750788 8.96708703,201.536622 9.23220597,180.246902 C9.49732492,158.957183 22.9602486,140.072414 43,132.88 C30.9727627,117.542153 28.7393251,96.690502 37.2452913,79.1533261 C45.7512576,61.6161502 63.5089397,50.4606896 83,50.41 C84.55,50.41 86.14,50.49 87.75,50.64 C87.8752789,33.414146 98.6417018,18.0612756 114.794365,12.0748572 C130.947029,6.08843887 149.118659,10.7164345 160.44,23.7 L160.44,59.64 Z" id="Path" fill="#1C75DB"></path>
|
||||
<path d="M18.75,180.87 C18.7440057,162.374603 30.9895614,146.112103 48.7664839,141.007126 C66.5434063,135.902149 85.5517453,143.189506 95.36,158.87 L103.36,153.87 C92.7362795,136.89172 73.1584352,127.703237 53.31,130.38 C45.7202536,122.640056 41.4876221,112.220165 41.53,101.38 C41.5326513,90.3850432 45.9036085,79.8416108 53.68103,72.0698157 C61.4584514,64.2980206 72.0050441,59.9346945 83,59.94 C84.496169,59.9342385 85.9915942,60.0076746 87.48,60.16 L88.81,60.33 C93.0175747,78.4370421 108.750476,91.5389411 127.32,92.4 L127.73,82.91 C113.568656,82.3019927 101.494677,72.450244 98.0576434,58.6988753 C94.6206096,44.9475065 100.639594,30.5735808 112.849573,23.3742928 C125.059553,16.1750049 140.55079,17.8660037 150.92,27.53 L150.92,59.64 L160.44,59.64 L160.44,23.7 C149.110946,10.7432677 130.954949,6.13328766 114.817018,12.115892 C98.6790869,18.0984963 87.9155294,33.4294454 87.77,50.64 C86.16,50.49 84.57,50.41 83.02,50.41 C63.5073553,50.4137874 45.7107042,61.5614533 37.1919008,79.1163189 C28.6730973,96.6711845 30.928585,117.549499 43,132.88 C22.966945,140.089556 9.52045448,158.985255 9.27316203,180.274685 C9.02586957,201.564115 22.0298162,220.767055 41.89,228.44 L41.83,229.02 C41.68,230.7 41.6,232.28 41.6,233.74 C41.6062718,260.119384 61.7281371,282.140684 88,284.52 C86.010574,302.506931 94.9772425,319.938427 110.76702,328.77983 C126.556798,337.621234 146.10448,336.156198 160.4,325.06 L160.4,292.76 L150.88,292.76 L150.88,320.07 C139.882648,326.54397 126.260382,326.632461 115.179852,320.30191 C104.099321,313.971359 97.2577469,302.191425 97.25,289.43 C97.2505745,288.013001 97.3340504,286.597248 97.5,285.19 L97.59,284.46 C110.587095,283.147703 122.585122,276.898134 131.11,267 L123.93,260.78 C112.61845,273.906654 94.3352005,278.611779 78.0923104,272.576158 C61.8494202,266.540536 51.0750377,251.038017 51.08,233.71 C51.08,232.71 51.08,231.84 51.15,231.01 C78.7102292,235.962739 105.109178,217.768266 110.29,190.25 L101,188.53 C97.0537654,209.57847 77.7264203,224.158026 56.4035784,222.171249 C35.0807365,220.184472 18.7796392,202.285199 18.79,180.87" id="Path" fill="#FFFFFF"></path>
|
||||
<rect id="Rectangle" fill="#FFFFFF" x="150.92" y="51.12" width="9.53" height="249.42"></rect>
|
||||
<rect id="Rectangle" fill="#FFFFFF" x="169.67" y="42.87" width="9.53" height="257.67"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.6 KiB |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" version="1.1" x="0px" y="0px" viewBox="-20.794 -3 100 100" overflow="visible" enable-background="new -20.794 -3 100 100" xml:space="preserve"><path fill="#FFFFFF" d="M29.206,62.703c8.638,0,15.643-7.002,15.643-15.642V15.642C44.848,7.005,37.843,0,29.206,0 c-8.64,0-15.642,7.005-15.642,15.642v31.419C13.563,55.701,20.565,62.703,29.206,62.703z"></path><path fill="#FFFFFF" d="M52.14,40.702v6.38c0,12.648-10.287,22.935-22.935,22.935c-12.648,0-22.935-10.287-22.935-22.935v-6.38H0 v6.38c0,15.045,11.435,27.465,26.07,29.035v11.612H8.821V94h40.77v-6.271H32.341V76.117c14.635-1.569,26.07-13.989,26.07-29.035 v-6.38H52.14z"></path></svg>
|
||||
|
After Width: | Height: | Size: 772 B |
@@ -0,0 +1,366 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/png" href="/img/favicon.png" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Leon</title>
|
||||
<style>
|
||||
@import './css/style.scss';
|
||||
</style>
|
||||
</head>
|
||||
<body class="settingup">
|
||||
<div id="init"></div>
|
||||
<div id="voice-overlay-bg">
|
||||
<div id="voice-container">
|
||||
<div>
|
||||
<div id="voice-energy-container">
|
||||
<svg
|
||||
class="voice-neon"
|
||||
id="pink-neon-1"
|
||||
viewBox="0 0 237 237"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<g filter="url(#filter0_i_6_16)">
|
||||
<circle
|
||||
cx="118.5"
|
||||
cy="118.5"
|
||||
r="113.5"
|
||||
stroke="#FFF"
|
||||
stroke-width="10"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter
|
||||
id="filter0_i_6_16"
|
||||
x="0"
|
||||
y="0"
|
||||
width="237"
|
||||
height="237"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="BackgroundImageFix"
|
||||
result="shape"
|
||||
/>
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="1"
|
||||
operator="erode"
|
||||
in="SourceAlpha"
|
||||
result="effect1_innerShadow_6_16"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="1" />
|
||||
<feComposite
|
||||
in2="hardAlpha"
|
||||
operator="arithmetic"
|
||||
k2="-1"
|
||||
k3="1"
|
||||
/>
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0.929412 0 0 0 0 0.160784 0 0 0 0 0.478431 0 0 0 1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="shape"
|
||||
result="effect1_innerShadow_6_16"
|
||||
/>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
class="voice-neon"
|
||||
id="blue-neon-1"
|
||||
viewBox="0 0 237 237"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<g filter="url(#filter0_i_6_24)">
|
||||
<circle
|
||||
cx="118.5"
|
||||
cy="118.5"
|
||||
r="116.5"
|
||||
stroke="#FFF"
|
||||
stroke-width="4"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter
|
||||
id="filter0_i_6_24"
|
||||
x="0"
|
||||
y="0"
|
||||
width="237"
|
||||
height="237"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="BackgroundImageFix"
|
||||
result="shape"
|
||||
/>
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="1"
|
||||
operator="erode"
|
||||
in="SourceAlpha"
|
||||
result="effect1_innerShadow_6_24"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="1" />
|
||||
<feComposite
|
||||
in2="hardAlpha"
|
||||
operator="arithmetic"
|
||||
k2="-1"
|
||||
k3="1"
|
||||
/>
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0.109804 0 0 0 0 0.458824 0 0 0 0 0.858824 0 0 0 1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="shape"
|
||||
result="effect1_innerShadow_6_24"
|
||||
/>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
class="voice-neon"
|
||||
id="blue-neon-2"
|
||||
viewBox="0 0 237 237"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<g filter="url(#filter0_i_6_24)">
|
||||
<circle
|
||||
cx="118.5"
|
||||
cy="118.5"
|
||||
r="116.5"
|
||||
stroke="#FFF"
|
||||
stroke-width="4"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter
|
||||
id="filter0_i_6_24"
|
||||
x="0"
|
||||
y="0"
|
||||
width="237"
|
||||
height="237"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="BackgroundImageFix"
|
||||
result="shape"
|
||||
/>
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="5"
|
||||
operator="erode"
|
||||
in="SourceAlpha"
|
||||
result="effect1_innerShadow_6_24"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="1" />
|
||||
<feComposite
|
||||
in2="hardAlpha"
|
||||
operator="arithmetic"
|
||||
k2="-1"
|
||||
k3="1"
|
||||
/>
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0.109804 0 0 0 0 0.458824 0 0 0 0 0.858824 0 0 0 1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="shape"
|
||||
result="effect1_innerShadow_6_24"
|
||||
/>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
id="purple-neon-blur"
|
||||
viewBox="0 0 341 341"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<g opacity="0.72" filter="url(#filter0_f_18_61)">
|
||||
<circle
|
||||
cx="170.5"
|
||||
cy="170.5"
|
||||
r="116.5"
|
||||
stroke="#ED297A"
|
||||
stroke-width="24"
|
||||
/>
|
||||
</g>
|
||||
<g opacity="0.72" filter="url(#filter1_f_18_61)">
|
||||
<circle
|
||||
cx="170.5"
|
||||
cy="170.5"
|
||||
r="116.5"
|
||||
stroke="#1C75DB"
|
||||
stroke-width="24"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter
|
||||
id="filter0_f_18_61"
|
||||
x="0"
|
||||
y="0"
|
||||
width="341"
|
||||
height="341"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="BackgroundImageFix"
|
||||
result="shape"
|
||||
/>
|
||||
<feGaussianBlur
|
||||
stdDeviation="21"
|
||||
result="effect1_foregroundBlur_18_61"
|
||||
/>
|
||||
</filter>
|
||||
<filter
|
||||
id="filter1_f_18_61"
|
||||
x="0"
|
||||
y="0"
|
||||
width="341"
|
||||
height="341"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="BackgroundImageFix"
|
||||
result="shape"
|
||||
/>
|
||||
<feGaussianBlur
|
||||
stdDeviation="21"
|
||||
result="effect1_foregroundBlur_18_61"
|
||||
/>
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
<div id="voice-status"></div>
|
||||
<div id="voice-tips">
|
||||
It is recommended to use a headset for a better voice experience.
|
||||
<br />
|
||||
Otherwise, if your microphone is too sensitive or speakers are too
|
||||
loud,
|
||||
<br />
|
||||
Leon may hear his own voice and get confused.
|
||||
</div>
|
||||
</div>
|
||||
<p id="voice-speech"></p>
|
||||
</div>
|
||||
</div>
|
||||
<aside id="sessions-panel" aria-label="Sessions">
|
||||
<div id="sessions-header">
|
||||
<div>
|
||||
<span id="sessions-eyebrow">Sessions</span>
|
||||
</div>
|
||||
<button id="new-session" type="button" aria-label="New session">
|
||||
<i class="ri-add-line"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div id="sessions-list"></div>
|
||||
</aside>
|
||||
<main>
|
||||
<div id="top-container">
|
||||
<div id="mood"></div>
|
||||
<button id="info">Info</button>
|
||||
</div>
|
||||
<div id="feed">
|
||||
<p id="no-bubble" class="hide">
|
||||
You can start to interact with me, don't be shy.
|
||||
</p>
|
||||
</div>
|
||||
<div id="is-typing">
|
||||
<div class="circle"></div>
|
||||
<div class="circle"></div>
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div id="input-container">
|
||||
<div id="mic-container">
|
||||
<button id="mic-button"></button>
|
||||
<div id="sonar"></div>
|
||||
</div>
|
||||
<label for="utterance"></label>
|
||||
<textarea id="utterance" autocomplete="off" autofocus></textarea>
|
||||
<ul id="tip">
|
||||
<li><kbd>enter</kbd> to submit.</li>
|
||||
<li><kbd>shift</kbd> + <kbd>enter</kbd> for new line.</li>
|
||||
<li>
|
||||
<kbd>shift</kbd> + <kbd>↑</kbd> / <kbd>↓</kbd> to browse history.
|
||||
</li>
|
||||
<li><kbd>alt</kbd> / <kbd>cmd</kbd> + <kbd>c</kbd> to listen.</li>
|
||||
<li><kbd>/</kbd> for commands.</li>
|
||||
<li><kbd>@</kbd> for files.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</main>
|
||||
<footer id="footer">
|
||||
<div id="logo-container">
|
||||
<div id="logo"></div>
|
||||
<div>
|
||||
<small>Leon AI</small>
|
||||
<div id="version">
|
||||
<small>v</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="discord-container">
|
||||
<div>
|
||||
<small>
|
||||
<a href="https://discord.gg/MNQqqKg" target="_blank"
|
||||
>Join us on Discord</a
|
||||
>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<script type="module" src="/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,7 @@
|
||||
import axios from 'axios'
|
||||
|
||||
export async function requestBuiltInCommand(serverUrl, payload) {
|
||||
const response = await axios.post(`${serverUrl}/api/v1/command`, payload)
|
||||
|
||||
return response.data
|
||||
}
|
||||
@@ -0,0 +1,750 @@
|
||||
import { createRef } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
|
||||
import { requestBuiltInCommand } from './api'
|
||||
import { BuiltInCommandsModal } from './modal'
|
||||
import FileSystemAutocomplete from '../file-system-autocomplete'
|
||||
|
||||
const AUTOCOMPLETE_DELAY_MS = 90
|
||||
const CLOSE_ANIMATION_DURATION_MS = 180
|
||||
const ROOT_COMMAND_INPUT = '/'
|
||||
const EDITABLE_ACTION_KEYS = new Set(['Backspace', 'Delete'])
|
||||
const NAVIGATION_DIRECTIONS = {
|
||||
next: 1,
|
||||
previous: -1
|
||||
}
|
||||
|
||||
function isEditableElement(element) {
|
||||
if (!element) {
|
||||
return false
|
||||
}
|
||||
|
||||
const tagName = element.tagName?.toLowerCase()
|
||||
|
||||
return (
|
||||
tagName === 'input' ||
|
||||
tagName === 'textarea' ||
|
||||
element.isContentEditable === true
|
||||
)
|
||||
}
|
||||
|
||||
export default class BuiltInCommands {
|
||||
constructor({
|
||||
serverUrl,
|
||||
input,
|
||||
onSubmitToChat,
|
||||
getActiveSessionId,
|
||||
onCommandExecuted
|
||||
}) {
|
||||
this.serverUrl = serverUrl
|
||||
this.input = input
|
||||
this.onSubmitToChat = onSubmitToChat
|
||||
this.getActiveSessionId = getActiveSessionId
|
||||
this.onCommandExecuted = onCommandExecuted
|
||||
this.sessionId = null
|
||||
this.origin = 'shortcut'
|
||||
this.commandValue = ''
|
||||
this.selectedSuggestionIndex = -1
|
||||
this.suggestions = []
|
||||
this.recentSuggestions = []
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.pendingInput = null
|
||||
this.isOpen = false
|
||||
this.isClosing = false
|
||||
this.isLoading = false
|
||||
this.hasSubmitted = false
|
||||
this.autocompleteTimeout = null
|
||||
this.closeTimeout = null
|
||||
this.shouldFocusInput = false
|
||||
this.modalInputRef = createRef()
|
||||
this.fileSystemAutocomplete = new FileSystemAutocomplete({
|
||||
serverUrl,
|
||||
onValueChange: (value) => {
|
||||
this.handleCommandChange(value)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
init() {
|
||||
this.mount()
|
||||
this.attachEvents()
|
||||
this.render()
|
||||
}
|
||||
|
||||
mount() {
|
||||
this.container = document.createElement('div')
|
||||
document.body.appendChild(this.container)
|
||||
this.root = createRoot(this.container)
|
||||
}
|
||||
|
||||
attachEvents() {
|
||||
document.addEventListener('keydown', (event) => {
|
||||
this.handleDocumentKeyDown(event)
|
||||
})
|
||||
|
||||
this.input.addEventListener('input', () => {
|
||||
this.handleMainInput()
|
||||
})
|
||||
|
||||
this.input.addEventListener('focus', () => {
|
||||
this.handleMainInput()
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
const focusedInputElement = this.modalInputRef.current
|
||||
const shouldRestoreCommandInputFocus =
|
||||
focusedInputElement && document.activeElement === focusedInputElement
|
||||
const selectionStart = shouldRestoreCommandInputFocus
|
||||
? focusedInputElement.selectionStart
|
||||
: null
|
||||
const selectionEnd = shouldRestoreCommandInputFocus
|
||||
? focusedInputElement.selectionEnd
|
||||
: null
|
||||
const { recentSelectedSuggestionIndex, suggestionSelectedSuggestionIndex } =
|
||||
this.getSelectedSuggestionIndices()
|
||||
|
||||
this.root.render(
|
||||
<BuiltInCommandsModal
|
||||
isOpen={this.isOpen}
|
||||
isVisible={this.isOpen || this.isClosing}
|
||||
isLoading={this.isLoading}
|
||||
loadingMessage={this.loadingMessage}
|
||||
commandValue={this.commandValue}
|
||||
suggestions={this.suggestions}
|
||||
recentSuggestions={this.recentSuggestions}
|
||||
recentSelectedSuggestionIndex={recentSelectedSuggestionIndex}
|
||||
suggestionSelectedSuggestionIndex={suggestionSelectedSuggestionIndex}
|
||||
result={this.result}
|
||||
pendingInput={this.pendingInput}
|
||||
hasSubmitted={this.hasSubmitted}
|
||||
inputRef={this.modalInputRef}
|
||||
onCommandChange={(value) => {
|
||||
this.handleCommandChange(value)
|
||||
}}
|
||||
onMaskClick={() => {
|
||||
this.close()
|
||||
}}
|
||||
onSuggestionSelect={(suggestion) => {
|
||||
this.handleSuggestionSelect(suggestion)
|
||||
}}
|
||||
onReturn={() => {
|
||||
this.returnToSuggestions()
|
||||
}}
|
||||
/>
|
||||
)
|
||||
|
||||
if (this.shouldFocusInput) {
|
||||
this.shouldFocusInput = false
|
||||
|
||||
window.requestAnimationFrame(() => {
|
||||
this.focusCommandInput()
|
||||
})
|
||||
} else if (shouldRestoreCommandInputFocus) {
|
||||
window.requestAnimationFrame(() => {
|
||||
this.restoreCommandInputFocus(selectionStart, selectionEnd)
|
||||
})
|
||||
}
|
||||
|
||||
if (
|
||||
this.isOpen &&
|
||||
!this.hasSubmitted &&
|
||||
!this.result &&
|
||||
this.selectedSuggestionIndex >= 0
|
||||
) {
|
||||
window.requestAnimationFrame(() => {
|
||||
this.scrollSelectedSuggestionIntoView()
|
||||
})
|
||||
}
|
||||
|
||||
window.requestAnimationFrame(() => {
|
||||
this.attachFileSystemAutocomplete()
|
||||
})
|
||||
}
|
||||
|
||||
attachFileSystemAutocomplete() {
|
||||
const inputElement = this.modalInputRef.current
|
||||
|
||||
if (!inputElement) {
|
||||
return
|
||||
}
|
||||
|
||||
this.fileSystemAutocomplete.attach(inputElement)
|
||||
}
|
||||
|
||||
handleDocumentKeyDown(event) {
|
||||
if (this.isOpen) {
|
||||
if (event.metaKey || event.ctrlKey || event.altKey) {
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'Escape') {
|
||||
event.preventDefault()
|
||||
this.close()
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'ArrowDown') {
|
||||
event.preventDefault()
|
||||
this.blurCommandInput()
|
||||
this.moveSelection(NAVIGATION_DIRECTIONS.next)
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'ArrowUp') {
|
||||
event.preventDefault()
|
||||
this.blurCommandInput()
|
||||
this.moveSelection(NAVIGATION_DIRECTIONS.previous)
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'Tab') {
|
||||
const suggestion =
|
||||
this.selectedSuggestionIndex >= 0
|
||||
? this.getVisibleSuggestions()[this.selectedSuggestionIndex]
|
||||
: null
|
||||
|
||||
if (suggestion) {
|
||||
event.preventDefault()
|
||||
this.applySuggestion(suggestion, {
|
||||
appendTrailingSpace: true
|
||||
})
|
||||
}
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'Enter' && !event.shiftKey) {
|
||||
event.preventDefault()
|
||||
|
||||
if (this.selectedSuggestionIndex >= 0) {
|
||||
const suggestion =
|
||||
this.getVisibleSuggestions()[this.selectedSuggestionIndex]
|
||||
|
||||
if (suggestion) {
|
||||
this.applySuggestion(suggestion)
|
||||
void this.submit()
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.submit()
|
||||
return
|
||||
}
|
||||
|
||||
if (this.shouldHandleDetachedInputKey(event)) {
|
||||
event.preventDefault()
|
||||
this.handleDetachedInputKey(event)
|
||||
return
|
||||
}
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (
|
||||
event.key !== '/' ||
|
||||
event.metaKey ||
|
||||
event.ctrlKey ||
|
||||
event.altKey ||
|
||||
event.shiftKey
|
||||
) {
|
||||
return
|
||||
}
|
||||
|
||||
const activeElement = document.activeElement
|
||||
|
||||
if (
|
||||
activeElement === this.input ||
|
||||
(activeElement && isEditableElement(activeElement))
|
||||
) {
|
||||
return
|
||||
}
|
||||
|
||||
event.preventDefault()
|
||||
this.open({
|
||||
origin: 'shortcut',
|
||||
rawInput: '/'
|
||||
})
|
||||
}
|
||||
|
||||
handleMainInput() {
|
||||
if (document.activeElement !== this.input) {
|
||||
return
|
||||
}
|
||||
|
||||
const rawValue = this.input.value || ''
|
||||
|
||||
if (!rawValue.startsWith('/')) {
|
||||
return
|
||||
}
|
||||
|
||||
this.open({
|
||||
origin: 'input',
|
||||
rawInput: rawValue
|
||||
})
|
||||
}
|
||||
|
||||
handleCommandChange(value) {
|
||||
this.commandValue = value
|
||||
this.hasSubmitted = false
|
||||
if (!this.pendingInput) {
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.queueAutocomplete()
|
||||
}
|
||||
this.render()
|
||||
}
|
||||
|
||||
open({ origin, rawInput }) {
|
||||
window.clearTimeout(this.closeTimeout)
|
||||
|
||||
if (this.isOpen) {
|
||||
this.origin = origin
|
||||
this.commandValue = this.normalizeCommandValue(rawInput)
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.pendingInput = null
|
||||
this.hasSubmitted = false
|
||||
this.shouldFocusInput = true
|
||||
this.input.value = ''
|
||||
this.queueAutocomplete()
|
||||
this.render()
|
||||
return
|
||||
}
|
||||
|
||||
this.origin = origin
|
||||
this.sessionId = null
|
||||
this.commandValue = this.normalizeCommandValue(rawInput)
|
||||
this.suggestions = []
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.pendingInput = null
|
||||
this.selectedSuggestionIndex = -1
|
||||
this.hasSubmitted = false
|
||||
this.isOpen = true
|
||||
this.isClosing = false
|
||||
this.shouldFocusInput = true
|
||||
this.input.value = ''
|
||||
|
||||
if (this.origin === 'input') {
|
||||
this.input.blur()
|
||||
}
|
||||
|
||||
this.queueAutocomplete()
|
||||
this.render()
|
||||
}
|
||||
|
||||
close() {
|
||||
if (!this.isOpen || this.isClosing) {
|
||||
return
|
||||
}
|
||||
|
||||
this.isClosing = true
|
||||
this.isOpen = false
|
||||
this.fileSystemAutocomplete.close()
|
||||
this.render()
|
||||
|
||||
this.closeTimeout = window.setTimeout(() => {
|
||||
this.resetState()
|
||||
this.render()
|
||||
this.focusMainInput()
|
||||
}, CLOSE_ANIMATION_DURATION_MS)
|
||||
}
|
||||
|
||||
queueAutocomplete() {
|
||||
window.clearTimeout(this.autocompleteTimeout)
|
||||
this.isLoading = true
|
||||
|
||||
this.autocompleteTimeout = window.setTimeout(() => {
|
||||
void this.fetchAutocomplete()
|
||||
}, AUTOCOMPLETE_DELAY_MS)
|
||||
}
|
||||
|
||||
async fetchAutocomplete() {
|
||||
try {
|
||||
const data = await requestBuiltInCommand(this.serverUrl, {
|
||||
mode: 'autocomplete',
|
||||
input: this.buildCommandInput(),
|
||||
session_id: this.sessionId,
|
||||
conversation_session_id: this.getActiveSessionId?.()
|
||||
})
|
||||
|
||||
if (!this.isOpen || this.hasSubmitted) {
|
||||
return
|
||||
}
|
||||
|
||||
this.sessionId = data.session.id
|
||||
this.suggestions = data.suggestions || []
|
||||
this.recentSuggestions = data.recent_suggestions || []
|
||||
this.loadingMessage = data.session.loading_message || null
|
||||
this.pendingInput = data.session.pending_input || null
|
||||
this.selectedSuggestionIndex =
|
||||
this.getVisibleSuggestions().length > 0 ? 0 : -1
|
||||
this.isLoading = false
|
||||
this.render()
|
||||
} catch (error) {
|
||||
if (!this.isOpen || this.hasSubmitted) {
|
||||
return
|
||||
}
|
||||
|
||||
this.isLoading = false
|
||||
this.result = {
|
||||
title: 'Command Error',
|
||||
tone: 'error',
|
||||
blocks: [
|
||||
{
|
||||
type: 'list',
|
||||
items: [
|
||||
{
|
||||
label: error.message || 'Failed to load built-in commands.',
|
||||
tone: 'error'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
this.loadingMessage = null
|
||||
this.render()
|
||||
}
|
||||
}
|
||||
|
||||
async submit() {
|
||||
const commandInput = this.buildCommandInput()
|
||||
|
||||
if (commandInput === ROOT_COMMAND_INPUT) {
|
||||
return
|
||||
}
|
||||
|
||||
window.clearTimeout(this.autocompleteTimeout)
|
||||
this.autocompleteTimeout = null
|
||||
|
||||
await this.resolveLoadingMessageForSubmission(commandInput)
|
||||
|
||||
this.isLoading = true
|
||||
this.hasSubmitted = true
|
||||
this.result = null
|
||||
this.commandValue = ''
|
||||
this.suggestions = []
|
||||
this.selectedSuggestionIndex = -1
|
||||
this.render()
|
||||
|
||||
try {
|
||||
const data = await requestBuiltInCommand(this.serverUrl, {
|
||||
mode: 'execute',
|
||||
input: commandInput,
|
||||
session_id: this.sessionId,
|
||||
conversation_session_id: this.getActiveSessionId?.()
|
||||
})
|
||||
|
||||
if (data.client_action?.type === 'submit_to_chat') {
|
||||
const wasSubmitted = this.onSubmitToChat?.(data.client_action)
|
||||
|
||||
if (!wasSubmitted) {
|
||||
throw new Error('Failed to submit the built-in command to chat.')
|
||||
}
|
||||
|
||||
this.isLoading = false
|
||||
this.close()
|
||||
return
|
||||
}
|
||||
|
||||
this.sessionId = data.session.id
|
||||
this.isLoading = false
|
||||
this.result = data.result
|
||||
this.onCommandExecuted?.(commandInput, data)
|
||||
this.loadingMessage = data.session.loading_message || null
|
||||
this.recentSuggestions = data.recent_suggestions || []
|
||||
this.pendingInput = data.session.pending_input || null
|
||||
this.commandValue = ''
|
||||
this.render()
|
||||
} catch (error) {
|
||||
this.isLoading = false
|
||||
this.result = {
|
||||
title: 'Command Error',
|
||||
tone: 'error',
|
||||
blocks: [
|
||||
{
|
||||
type: 'list',
|
||||
items: [
|
||||
{
|
||||
label:
|
||||
error.message || 'Failed to execute the built-in command.',
|
||||
tone: 'error'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
this.loadingMessage = null
|
||||
this.render()
|
||||
}
|
||||
}
|
||||
|
||||
async resolveLoadingMessageForSubmission(commandInput) {
|
||||
try {
|
||||
const data = await requestBuiltInCommand(this.serverUrl, {
|
||||
mode: 'autocomplete',
|
||||
input: commandInput,
|
||||
session_id: this.sessionId,
|
||||
conversation_session_id: this.getActiveSessionId?.()
|
||||
})
|
||||
|
||||
this.sessionId = data.session.id
|
||||
this.loadingMessage = data.session.loading_message || null
|
||||
} catch {
|
||||
this.loadingMessage = null
|
||||
}
|
||||
}
|
||||
|
||||
moveSelection(direction) {
|
||||
if (this.hasSubmitted || this.result) {
|
||||
return
|
||||
}
|
||||
|
||||
const visibleSuggestions = this.getVisibleSuggestions()
|
||||
|
||||
if (visibleSuggestions.length === 0) {
|
||||
return
|
||||
}
|
||||
|
||||
if (this.selectedSuggestionIndex === -1) {
|
||||
this.selectedSuggestionIndex = 0
|
||||
} else {
|
||||
this.selectedSuggestionIndex =
|
||||
(this.selectedSuggestionIndex +
|
||||
direction +
|
||||
visibleSuggestions.length) %
|
||||
visibleSuggestions.length
|
||||
}
|
||||
|
||||
this.render()
|
||||
}
|
||||
|
||||
handleSuggestionSelect(suggestion) {
|
||||
const normalizedSuggestionValue = this.normalizeCommandValue(suggestion.value)
|
||||
|
||||
if (normalizedSuggestionValue.trim() === this.commandValue.trim()) {
|
||||
void this.submit()
|
||||
return
|
||||
}
|
||||
|
||||
this.applySuggestion(suggestion, {
|
||||
appendTrailingSpace: true
|
||||
})
|
||||
}
|
||||
|
||||
applySuggestion(suggestion, options = {}) {
|
||||
this.commandValue = `${this.normalizeCommandValue(suggestion.value)}${
|
||||
options.appendTrailingSpace ? ' ' : ''
|
||||
}`
|
||||
this.loadingMessage = null
|
||||
this.queueAutocomplete()
|
||||
this.shouldFocusInput = true
|
||||
this.render()
|
||||
}
|
||||
|
||||
returnToSuggestions() {
|
||||
this.sessionId = null
|
||||
this.hasSubmitted = false
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.pendingInput = null
|
||||
this.commandValue = ''
|
||||
this.suggestions = []
|
||||
this.selectedSuggestionIndex = -1
|
||||
this.shouldFocusInput = true
|
||||
this.queueAutocomplete()
|
||||
this.render()
|
||||
}
|
||||
|
||||
focusCommandInput() {
|
||||
const inputElement = this.modalInputRef.current
|
||||
|
||||
if (!inputElement) {
|
||||
return
|
||||
}
|
||||
|
||||
inputElement.focus()
|
||||
|
||||
if (typeof inputElement.setSelectionRange === 'function') {
|
||||
inputElement.setSelectionRange(
|
||||
inputElement.value.length,
|
||||
inputElement.value.length
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
restoreCommandInputFocus(selectionStart, selectionEnd) {
|
||||
const inputElement = this.modalInputRef.current
|
||||
|
||||
if (!inputElement) {
|
||||
return
|
||||
}
|
||||
|
||||
if (document.activeElement !== inputElement) {
|
||||
try {
|
||||
inputElement.focus({ preventScroll: true })
|
||||
} catch {
|
||||
inputElement.focus()
|
||||
}
|
||||
}
|
||||
|
||||
if (
|
||||
typeof inputElement.setSelectionRange === 'function' &&
|
||||
selectionStart !== null &&
|
||||
selectionEnd !== null
|
||||
) {
|
||||
inputElement.setSelectionRange(selectionStart, selectionEnd)
|
||||
}
|
||||
}
|
||||
|
||||
blurCommandInput() {
|
||||
const inputElement = this.modalInputRef.current
|
||||
|
||||
if (!inputElement || document.activeElement !== inputElement) {
|
||||
return
|
||||
}
|
||||
|
||||
inputElement.blur()
|
||||
}
|
||||
|
||||
focusMainInput() {
|
||||
if (!this.input) {
|
||||
return
|
||||
}
|
||||
|
||||
window.requestAnimationFrame(() => {
|
||||
try {
|
||||
this.input.focus({ preventScroll: true })
|
||||
} catch {
|
||||
this.input.focus()
|
||||
}
|
||||
|
||||
if (typeof this.input.setSelectionRange === 'function') {
|
||||
this.input.setSelectionRange(
|
||||
this.input.value.length,
|
||||
this.input.value.length
|
||||
)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
scrollSelectedSuggestionIntoView() {
|
||||
const selectedSuggestionElement = this.container?.querySelector(
|
||||
'.aurora-list-item--selected'
|
||||
)
|
||||
|
||||
if (!selectedSuggestionElement) {
|
||||
return
|
||||
}
|
||||
|
||||
selectedSuggestionElement.scrollIntoView({
|
||||
block: 'nearest'
|
||||
})
|
||||
}
|
||||
|
||||
shouldHandleDetachedInputKey(event) {
|
||||
const inputElement = this.modalInputRef.current
|
||||
|
||||
if (!inputElement || document.activeElement === inputElement) {
|
||||
return false
|
||||
}
|
||||
|
||||
return (
|
||||
event.key.length === 1 ||
|
||||
EDITABLE_ACTION_KEYS.has(event.key)
|
||||
)
|
||||
}
|
||||
|
||||
handleDetachedInputKey(event) {
|
||||
if (event.key.length === 1) {
|
||||
this.commandValue += event.key
|
||||
} else if (event.key === 'Backspace') {
|
||||
this.commandValue = this.commandValue.slice(0, -1)
|
||||
} else if (event.key === 'Delete') {
|
||||
this.commandValue = ''
|
||||
}
|
||||
|
||||
this.hasSubmitted = false
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.queueAutocomplete()
|
||||
this.shouldFocusInput = true
|
||||
this.render()
|
||||
}
|
||||
|
||||
normalizeCommandValue(rawInput) {
|
||||
const normalizedValue = String(rawInput || '').trim()
|
||||
|
||||
if (!normalizedValue.startsWith('/')) {
|
||||
return normalizedValue
|
||||
}
|
||||
|
||||
return normalizedValue.slice(1)
|
||||
}
|
||||
|
||||
buildCommandInput() {
|
||||
if (this.pendingInput) {
|
||||
return this.commandValue
|
||||
}
|
||||
|
||||
return `/${this.commandValue}`.trim()
|
||||
}
|
||||
|
||||
getVisibleSuggestions() {
|
||||
if (this.commandValue.trim() === '') {
|
||||
return [...this.recentSuggestions, ...this.suggestions]
|
||||
}
|
||||
|
||||
return this.suggestions
|
||||
}
|
||||
|
||||
getSelectedSuggestionIndices() {
|
||||
if (this.commandValue.trim() !== '') {
|
||||
return {
|
||||
recentSelectedSuggestionIndex: -1,
|
||||
suggestionSelectedSuggestionIndex: this.selectedSuggestionIndex
|
||||
}
|
||||
}
|
||||
|
||||
const recentSuggestionsLength = this.recentSuggestions.length
|
||||
|
||||
if (this.selectedSuggestionIndex < 0) {
|
||||
return {
|
||||
recentSelectedSuggestionIndex: -1,
|
||||
suggestionSelectedSuggestionIndex: -1
|
||||
}
|
||||
}
|
||||
|
||||
if (this.selectedSuggestionIndex < recentSuggestionsLength) {
|
||||
return {
|
||||
recentSelectedSuggestionIndex: this.selectedSuggestionIndex,
|
||||
suggestionSelectedSuggestionIndex: -1
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
recentSelectedSuggestionIndex: -1,
|
||||
suggestionSelectedSuggestionIndex:
|
||||
this.selectedSuggestionIndex - recentSuggestionsLength
|
||||
}
|
||||
}
|
||||
|
||||
resetState() {
|
||||
window.clearTimeout(this.autocompleteTimeout)
|
||||
this.isClosing = false
|
||||
this.isLoading = false
|
||||
this.sessionId = null
|
||||
this.origin = 'shortcut'
|
||||
this.commandValue = ''
|
||||
this.suggestions = []
|
||||
this.result = null
|
||||
this.loadingMessage = null
|
||||
this.pendingInput = null
|
||||
this.selectedSuggestionIndex = -1
|
||||
this.hasSubmitted = false
|
||||
this.shouldFocusInput = false
|
||||
this.autocompleteTimeout = null
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
import '../../css/built-in-commands.scss'
|
||||
|
||||
export { default as BuiltInCommands } from './built-in-commands.jsx'
|
||||
@@ -0,0 +1,263 @@
|
||||
import {
|
||||
Button,
|
||||
Flexbox,
|
||||
Icon,
|
||||
Input,
|
||||
List,
|
||||
ListHeader,
|
||||
ListItem,
|
||||
Loader,
|
||||
ScrollContainer,
|
||||
Text
|
||||
} from '@aurora'
|
||||
|
||||
import { BuiltInCommandResultRenderer } from './result-renderer'
|
||||
|
||||
const SLASH_COMMAND_ICON_SVG = (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path d="M9.78839 21H7.66003L14.2115 3H16.3398L9.78839 21Z" />
|
||||
</svg>
|
||||
)
|
||||
|
||||
function parseRemixIcon(rawIconName, rawIconType) {
|
||||
const fallbackIcon = {
|
||||
iconName: 'terminal-box',
|
||||
type: 'line'
|
||||
}
|
||||
const normalizedIconName = String(rawIconName || '').trim()
|
||||
const normalizedIconType = ['line', 'fill', 'notype'].includes(rawIconType)
|
||||
? rawIconType
|
||||
: null
|
||||
|
||||
if (!normalizedIconName) {
|
||||
return fallbackIcon
|
||||
}
|
||||
|
||||
const iconWithoutPrefix = normalizedIconName.replace(/^ri-/, '')
|
||||
|
||||
if (iconWithoutPrefix.endsWith('-line')) {
|
||||
return {
|
||||
iconName: iconWithoutPrefix.slice(0, -5),
|
||||
type: 'line'
|
||||
}
|
||||
}
|
||||
|
||||
if (iconWithoutPrefix.endsWith('-fill')) {
|
||||
return {
|
||||
iconName: iconWithoutPrefix.slice(0, -5),
|
||||
type: 'fill'
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
iconName: iconWithoutPrefix,
|
||||
type: normalizedIconType || 'notype'
|
||||
}
|
||||
}
|
||||
|
||||
function SuggestionList({
|
||||
headerTitle,
|
||||
suggestions,
|
||||
selectedSuggestionIndex,
|
||||
onSuggestionSelect
|
||||
}) {
|
||||
return (
|
||||
<List>
|
||||
<ListHeader>{headerTitle}</ListHeader>
|
||||
{suggestions.map((suggestion, index) => {
|
||||
const parsedIcon = parseRemixIcon(
|
||||
suggestion.icon_name,
|
||||
suggestion.icon_type
|
||||
)
|
||||
|
||||
return (
|
||||
<ListItem
|
||||
key={`suggestion-${suggestion.value}-${index}`}
|
||||
name="built-in-command-suggestion"
|
||||
value={suggestion.value}
|
||||
selected={index === selectedSuggestionIndex}
|
||||
onClick={() => {
|
||||
onSuggestionSelect(suggestion)
|
||||
}}
|
||||
>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="md">
|
||||
<Icon
|
||||
iconName={parsedIcon.iconName}
|
||||
type={parsedIcon.type}
|
||||
size="md"
|
||||
bgShape="square"
|
||||
color="blue"
|
||||
bgColor="transparent-blue"
|
||||
/>
|
||||
<div className="built-in-commands-modal__suggestion-copy">
|
||||
<Text fontWeight="semi-bold">{suggestion.usage}</Text>
|
||||
<Text secondary>{suggestion.description}</Text>
|
||||
</div>
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
})}
|
||||
</List>
|
||||
)
|
||||
}
|
||||
|
||||
function LoadingState({ loadingMessage }) {
|
||||
return (
|
||||
<List>
|
||||
<ListHeader>Working</ListHeader>
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Loader size="sm" />
|
||||
<Text>{loadingMessage || 'Working on it...'}</Text>
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
</List>
|
||||
)
|
||||
}
|
||||
|
||||
function EmptyState() {
|
||||
return (
|
||||
<List>
|
||||
<ListHeader>Suggestions</ListHeader>
|
||||
<ListItem>
|
||||
<Text secondary>No matching built-in command.</Text>
|
||||
</ListItem>
|
||||
</List>
|
||||
)
|
||||
}
|
||||
|
||||
export function BuiltInCommandsModal({
|
||||
isOpen,
|
||||
isVisible,
|
||||
isLoading,
|
||||
loadingMessage,
|
||||
commandValue,
|
||||
suggestions,
|
||||
recentSuggestions,
|
||||
recentSelectedSuggestionIndex,
|
||||
suggestionSelectedSuggestionIndex,
|
||||
result,
|
||||
pendingInput,
|
||||
hasSubmitted,
|
||||
inputRef,
|
||||
onCommandChange,
|
||||
onMaskClick,
|
||||
onSuggestionSelect,
|
||||
onReturn
|
||||
}) {
|
||||
const isCommandInputEmpty = commandValue.trim() === ''
|
||||
const pendingInputIcon = pendingInput?.icon_name
|
||||
? parseRemixIcon(pendingInput.icon_name, pendingInput.icon_type)
|
||||
: null
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`built-in-commands-modal ${
|
||||
isOpen
|
||||
? 'built-in-commands-modal--open'
|
||||
: isVisible
|
||||
? ''
|
||||
: 'built-in-commands-modal--hidden'
|
||||
}`}
|
||||
aria-hidden={!isVisible}
|
||||
>
|
||||
<div className="built-in-commands-modal__mask" onClick={onMaskClick} />
|
||||
<div
|
||||
className="built-in-commands-modal__panel"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-label="Built-in commands"
|
||||
onClick={(event) => {
|
||||
event.stopPropagation()
|
||||
}}
|
||||
>
|
||||
<div className="built-in-commands-modal__section built-in-commands-modal__section--top">
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="md">
|
||||
{hasSubmitted && result ? (
|
||||
<div className="built-in-commands-modal__return-button">
|
||||
<Button
|
||||
light
|
||||
iconName="arrow-left-double"
|
||||
iconSize="lg"
|
||||
onClick={() => {
|
||||
onReturn()
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : null}
|
||||
<div className="built-in-commands-modal__input-field">
|
||||
<Input
|
||||
name="built-in-commands"
|
||||
type={pendingInput?.type || 'text'}
|
||||
placeholder={
|
||||
pendingInput?.placeholder || 'Type a built-in command'
|
||||
}
|
||||
maxLength={2_048}
|
||||
iconName={pendingInputIcon?.iconName}
|
||||
iconType={pendingInputIcon ? pendingInputIcon.type : undefined}
|
||||
iconSVG={pendingInput ? undefined : SLASH_COMMAND_ICON_SVG}
|
||||
iconSize="lg"
|
||||
value={commandValue}
|
||||
autofocus={isOpen}
|
||||
inputRef={inputRef}
|
||||
onChange={onCommandChange}
|
||||
/>
|
||||
</div>
|
||||
</Flexbox>
|
||||
</div>
|
||||
<div className="built-in-commands-modal__section built-in-commands-modal__section--middle">
|
||||
<div className="built-in-commands-modal__scroll-area">
|
||||
<ScrollContainer orientation="vertical" height="100%">
|
||||
{isLoading ? (
|
||||
<LoadingState loadingMessage={loadingMessage} />
|
||||
) : result ? (
|
||||
<BuiltInCommandResultRenderer result={result} />
|
||||
) : suggestions.length > 0 ? (
|
||||
<Flexbox gap="md">
|
||||
{isCommandInputEmpty && recentSuggestions.length > 0 ? (
|
||||
<SuggestionList
|
||||
headerTitle="Recently Used Commands"
|
||||
suggestions={recentSuggestions}
|
||||
selectedSuggestionIndex={recentSelectedSuggestionIndex}
|
||||
onSuggestionSelect={onSuggestionSelect}
|
||||
/>
|
||||
) : null}
|
||||
<SuggestionList
|
||||
headerTitle={
|
||||
isCommandInputEmpty ? 'All Commands' : 'Suggested Commands'
|
||||
}
|
||||
suggestions={suggestions}
|
||||
selectedSuggestionIndex={suggestionSelectedSuggestionIndex}
|
||||
onSuggestionSelect={onSuggestionSelect}
|
||||
/>
|
||||
</Flexbox>
|
||||
) : (
|
||||
<EmptyState />
|
||||
)}
|
||||
</ScrollContainer>
|
||||
</div>
|
||||
</div>
|
||||
<div className="built-in-commands-modal__section built-in-commands-modal__section--bottom">
|
||||
<Flexbox flexDirection="row" gap="md">
|
||||
<Text fontSize="xs" secondary>
|
||||
<kbd>↑</kbd> <kbd>↓</kbd> navigate
|
||||
</Text>
|
||||
<Text fontSize="xs" secondary>
|
||||
<kbd>tab</kbd> complete
|
||||
</Text>
|
||||
<Text fontSize="xs" secondary>
|
||||
<kbd>enter</kbd> submit
|
||||
</Text>
|
||||
<Text fontSize="xs" secondary>
|
||||
<kbd>esc</kbd> close
|
||||
</Text>
|
||||
</Flexbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,145 @@
|
||||
import {
|
||||
Flexbox,
|
||||
Icon,
|
||||
Link,
|
||||
List,
|
||||
ListHeader,
|
||||
ListItem,
|
||||
Text
|
||||
} from '@aurora'
|
||||
|
||||
function InlineLabel({ item }) {
|
||||
if (item.inline_link_label && item.inline_link_href) {
|
||||
return (
|
||||
<Text>
|
||||
{item.label}{' '}
|
||||
<Link href={item.inline_link_href} fontSize="md">
|
||||
{item.inline_link_label}
|
||||
</Link>.
|
||||
</Text>
|
||||
)
|
||||
}
|
||||
|
||||
return <Text>{item.label}</Text>
|
||||
}
|
||||
|
||||
function ToneListItem({ item }) {
|
||||
if (item.tone === 'success') {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Icon
|
||||
iconName="check"
|
||||
size="sm"
|
||||
type="fill"
|
||||
bgShape="circle"
|
||||
color="green"
|
||||
bgColor="transparent-green"
|
||||
/>
|
||||
<InlineLabel item={item} />
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
if (item.tone === 'warning') {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Icon
|
||||
iconName="alert"
|
||||
size="sm"
|
||||
type="fill"
|
||||
bgShape="circle"
|
||||
color="yellow"
|
||||
bgColor="transparent-yellow"
|
||||
/>
|
||||
<InlineLabel item={item} />
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
if (item.tone === 'error') {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Icon
|
||||
iconName="close"
|
||||
size="sm"
|
||||
type="fill"
|
||||
bgShape="circle"
|
||||
color="red"
|
||||
bgColor="transparent-red"
|
||||
/>
|
||||
<InlineLabel item={item} />
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
if (item.value || item.description) {
|
||||
return (
|
||||
<ListItem>
|
||||
<div className="built-in-commands-modal__result-item">
|
||||
<div className="built-in-commands-modal__result-copy">
|
||||
<Text fontWeight="semi-bold">{item.label}</Text>
|
||||
{item.description ? <Text secondary>{item.description}</Text> : null}
|
||||
</div>
|
||||
{item.value ? (
|
||||
<div className="built-in-commands-modal__result-value">
|
||||
{item.href ? (
|
||||
<Link href={item.href} fontSize="md">
|
||||
{item.value}
|
||||
</Link>
|
||||
) : (
|
||||
<Text secondary textAlign="right">
|
||||
{item.value}
|
||||
</Text>
|
||||
)}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
if (item.inline_link_label && item.inline_link_href) {
|
||||
return (
|
||||
<ListItem>
|
||||
<InlineLabel item={item} />
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<ListItem>
|
||||
<InlineLabel item={item} />
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
export function BuiltInCommandResultRenderer({ result }) {
|
||||
const blocks = Array.isArray(result?.blocks) ? result.blocks : []
|
||||
|
||||
return (
|
||||
<Flexbox flexDirection="column" gap="sm">
|
||||
{blocks.map((block, index) => {
|
||||
if (block.type !== 'list') {
|
||||
return null
|
||||
}
|
||||
|
||||
const header = block.header || (index === 0 ? result.title : '')
|
||||
|
||||
return (
|
||||
<List key={`result-block-${index}`}>
|
||||
{header ? <ListHeader>{header}</ListHeader> : null}
|
||||
{block.items.map((item, itemIndex) => (
|
||||
<ToneListItem item={item} key={`result-item-${itemIndex}`} />
|
||||
))}
|
||||
</List>
|
||||
)
|
||||
})}
|
||||
</Flexbox>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,957 @@
|
||||
import { createElement } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import axios from 'axios'
|
||||
|
||||
import { WidgetWrapper, Flexbox, Loader, Text } from '@aurora'
|
||||
|
||||
import renderAuroraComponent from './render-aurora-component'
|
||||
import ToolUIHandler from './tool-ui-handler'
|
||||
|
||||
const WIDGETS_TO_FETCH = []
|
||||
const WIDGETS_FETCH_CACHE = new Map()
|
||||
const REPLACED_MESSAGES = new Set()
|
||||
const AUTO_SCROLL_BOTTOM_THRESHOLD_PX = 24
|
||||
const MAXIMUM_BUBBLES_IN_MEMORY = 62
|
||||
const MAXIMUM_WIDGET_FETCH_CONCURRENCY = 4
|
||||
const SECONDS_PER_MINUTE = 60
|
||||
|
||||
function escapeHTML(value) {
|
||||
return String(value || '')
|
||||
.replace(/&/g, '&')
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>')
|
||||
.replace(/"/g, '"')
|
||||
.replace(/'/g, ''')
|
||||
}
|
||||
|
||||
export default class Chatbot {
|
||||
constructor(socket, serverURL, sessionId = null) {
|
||||
this.socket = socket
|
||||
this.serverURL = serverURL
|
||||
this.sessionId = sessionId
|
||||
this.et = new EventTarget()
|
||||
this.feed = document.querySelector('#feed')
|
||||
this.typing = document.querySelector('#is-typing')
|
||||
this.noBubbleMessage = document.querySelector('#no-bubble')
|
||||
this.parsedBubbles = []
|
||||
this.reasoningBlocks = new Map()
|
||||
this.feedAutoScrollEnabled = true
|
||||
this.isProgrammaticFeedScroll = false
|
||||
this.widgetHydrationPromise = null
|
||||
|
||||
// Initialize tool UI handler
|
||||
this.toolUIHandler = new ToolUIHandler(
|
||||
this.feed,
|
||||
this.scrollDown.bind(this),
|
||||
this.formatMessage.bind(this)
|
||||
)
|
||||
}
|
||||
|
||||
async init() {
|
||||
await this.loadFeed()
|
||||
this.scrollDown()
|
||||
|
||||
this.et.addEventListener('to-leon', (event) => {
|
||||
this.createBubble({
|
||||
who: 'me',
|
||||
string: event.detail.string,
|
||||
sentAt: event.detail.sentAt
|
||||
})
|
||||
})
|
||||
|
||||
this.et.addEventListener('me-received', (event) => {
|
||||
this.createBubble({
|
||||
who: 'leon',
|
||||
string: event.detail
|
||||
})
|
||||
})
|
||||
|
||||
// Add event delegation for clickable paths
|
||||
this.feed.addEventListener('click', (event) => {
|
||||
if (event.target.classList.contains('clickable-path')) {
|
||||
const path = event.target.getAttribute('data-path')
|
||||
if (path) {
|
||||
this.openPath(path)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
this.feed.addEventListener(
|
||||
'scroll',
|
||||
() => {
|
||||
this.handleFeedScroll()
|
||||
},
|
||||
{ passive: true }
|
||||
)
|
||||
}
|
||||
|
||||
sendTo(who, string, sentAt = Date.now()) {
|
||||
if (who === 'leon') {
|
||||
this.et.dispatchEvent(
|
||||
new CustomEvent('to-leon', {
|
||||
detail: {
|
||||
string,
|
||||
sentAt
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
receivedFrom(who, string) {
|
||||
if (who === 'leon') {
|
||||
this.et.dispatchEvent(new CustomEvent('me-received', { detail: string }))
|
||||
}
|
||||
}
|
||||
|
||||
isTyping(who, value) {
|
||||
if (who === 'leon') {
|
||||
if (value) {
|
||||
this.enableTyping()
|
||||
} else if (value === false) {
|
||||
this.disableTyping()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
enableTyping() {
|
||||
if (!this.typing.classList.contains('on')) {
|
||||
this.typing.classList.add('on')
|
||||
}
|
||||
}
|
||||
|
||||
disableTyping() {
|
||||
if (this.typing.classList.contains('on')) {
|
||||
this.typing.classList.remove('on')
|
||||
}
|
||||
}
|
||||
|
||||
isElementNearBottom(element) {
|
||||
if (!element) {
|
||||
return true
|
||||
}
|
||||
|
||||
const remainingScrollableDistance =
|
||||
element.scrollHeight - (element.scrollTop + element.clientHeight)
|
||||
|
||||
return remainingScrollableDistance <= AUTO_SCROLL_BOTTOM_THRESHOLD_PX
|
||||
}
|
||||
|
||||
handleFeedScroll() {
|
||||
if (!this.feed || this.isProgrammaticFeedScroll) {
|
||||
return
|
||||
}
|
||||
|
||||
this.feedAutoScrollEnabled = this.isElementNearBottom(this.feed)
|
||||
}
|
||||
|
||||
scrollDown(options = {}) {
|
||||
if (!this.feed) {
|
||||
return
|
||||
}
|
||||
|
||||
const { force = false } = options
|
||||
|
||||
if (!force && !this.feedAutoScrollEnabled) {
|
||||
return
|
||||
}
|
||||
|
||||
this.isProgrammaticFeedScroll = true
|
||||
this.feed.scrollTo(0, this.feed.scrollHeight)
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
this.isProgrammaticFeedScroll = false
|
||||
this.feedAutoScrollEnabled = this.isElementNearBottom(this.feed)
|
||||
})
|
||||
}
|
||||
|
||||
scrollReasoningContentToBottom(reasoningBlock) {
|
||||
if (!reasoningBlock?.content || !reasoningBlock.isAutoScrollEnabled) {
|
||||
return
|
||||
}
|
||||
|
||||
reasoningBlock.isProgrammaticScroll = true
|
||||
reasoningBlock.content.scrollTop = reasoningBlock.content.scrollHeight
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
reasoningBlock.isProgrammaticScroll = false
|
||||
reasoningBlock.isAutoScrollEnabled = this.isElementNearBottom(
|
||||
reasoningBlock.content
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
getWidgetPayload(formattedString) {
|
||||
if (
|
||||
typeof formattedString !== 'string' ||
|
||||
!formattedString.includes('"component":"WidgetWrapper"')
|
||||
) {
|
||||
return null
|
||||
}
|
||||
|
||||
try {
|
||||
return JSON.parse(formattedString)
|
||||
} catch {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
getPlanWidgetInsertionPoint(widgetPayload) {
|
||||
if (!widgetPayload || widgetPayload.widget !== 'PlanWidget') {
|
||||
return null
|
||||
}
|
||||
|
||||
// Always append new plan widgets as new bubbles.
|
||||
// Widget updates are handled via replaceMessageId targeting the same
|
||||
// messageId, so insertion-point heuristics are unnecessary and can cause
|
||||
// visual reuse across turns.
|
||||
return null
|
||||
}
|
||||
|
||||
isPlanWidgetData(data) {
|
||||
return Boolean(data && typeof data === 'object' && data.widget === 'PlanWidget')
|
||||
}
|
||||
|
||||
isSystemWidgetData(data) {
|
||||
return Boolean(
|
||||
data &&
|
||||
typeof data === 'object' &&
|
||||
data.historyMode &&
|
||||
data.historyMode === 'system_widget'
|
||||
)
|
||||
}
|
||||
|
||||
getTimelineItemWeight(item) {
|
||||
if (item.who === 'owner') {
|
||||
return 0
|
||||
}
|
||||
|
||||
if (item.source === 'system_widget') {
|
||||
return 1
|
||||
}
|
||||
|
||||
return 2
|
||||
}
|
||||
|
||||
async hydrateFetchedWidgets() {
|
||||
if (this.widgetHydrationPromise) {
|
||||
return this.widgetHydrationPromise
|
||||
}
|
||||
|
||||
const widgetContainers = [...WIDGETS_TO_FETCH].reverse()
|
||||
WIDGETS_TO_FETCH.length = 0
|
||||
|
||||
if (widgetContainers.length === 0) {
|
||||
return Promise.resolve()
|
||||
}
|
||||
|
||||
const hydrateWidgetContainer = async (widgetContainer) => {
|
||||
const hasWidgetBeenFetched = WIDGETS_FETCH_CACHE.has(
|
||||
widgetContainer.widgetId
|
||||
)
|
||||
|
||||
if (hasWidgetBeenFetched) {
|
||||
const fetchedWidget = WIDGETS_FETCH_CACHE.get(widgetContainer.widgetId)
|
||||
widgetContainer.reactRootNode.render(fetchedWidget.reactNode)
|
||||
|
||||
setTimeout(() => {
|
||||
this.scrollDown()
|
||||
}, 100)
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
const data = await axios.get(
|
||||
`${this.serverURL}/api/v1/fetch-widget?skill_action=${widgetContainer.onFetch.actionName}&widget_id=${widgetContainer.widgetId}${this.sessionId ? `&session_id=${encodeURIComponent(this.sessionId)}` : ''}`
|
||||
)
|
||||
const fetchedWidget = data.data.widget
|
||||
const reactNode = fetchedWidget
|
||||
? renderAuroraComponent(
|
||||
this.socket,
|
||||
fetchedWidget.componentTree,
|
||||
fetchedWidget.supportedEvents
|
||||
)
|
||||
: createElement(WidgetWrapper, {
|
||||
children: createElement(Flexbox, {
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
children: createElement(Text, {
|
||||
secondary: true,
|
||||
children: 'This widget has been deleted.'
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
widgetContainer.reactRootNode.render(reactNode)
|
||||
WIDGETS_FETCH_CACHE.set(widgetContainer.widgetId, {
|
||||
...fetchedWidget,
|
||||
reactNode
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.scrollDown()
|
||||
}, 100)
|
||||
}
|
||||
|
||||
const workerCount = Math.min(
|
||||
MAXIMUM_WIDGET_FETCH_CONCURRENCY,
|
||||
widgetContainers.length
|
||||
)
|
||||
let currentIndex = 0
|
||||
|
||||
this.widgetHydrationPromise = Promise.all(
|
||||
Array.from({ length: workerCount }, async () => {
|
||||
while (currentIndex < widgetContainers.length) {
|
||||
const widgetContainer = widgetContainers[currentIndex]
|
||||
currentIndex += 1
|
||||
|
||||
if (!widgetContainer) {
|
||||
continue
|
||||
}
|
||||
|
||||
await hydrateWidgetContainer(widgetContainer)
|
||||
}
|
||||
})
|
||||
)
|
||||
.catch((error) => {
|
||||
console.error('Failed to hydrate fetched widgets:', error)
|
||||
})
|
||||
.finally(() => {
|
||||
this.widgetHydrationPromise = null
|
||||
})
|
||||
|
||||
return this.widgetHydrationPromise
|
||||
}
|
||||
|
||||
setSessionId(sessionId) {
|
||||
this.sessionId = sessionId
|
||||
}
|
||||
|
||||
resetFeed() {
|
||||
WIDGETS_TO_FETCH.length = 0
|
||||
this.feed.innerHTML = ''
|
||||
this.noBubbleMessage = document.createElement('p')
|
||||
this.noBubbleMessage.id = 'no-bubble'
|
||||
this.noBubbleMessage.className = 'hide'
|
||||
this.noBubbleMessage.textContent =
|
||||
'You can start to interact with me, don\'t be shy.'
|
||||
this.feed.appendChild(this.noBubbleMessage)
|
||||
this.parsedBubbles = []
|
||||
this.reasoningBlocks.clear()
|
||||
this.feedAutoScrollEnabled = true
|
||||
}
|
||||
|
||||
async loadFeed() {
|
||||
WIDGETS_TO_FETCH.length = 0
|
||||
this.resetFeed()
|
||||
const sessionQuery = this.sessionId
|
||||
? `&session_id=${encodeURIComponent(this.sessionId)}`
|
||||
: ''
|
||||
|
||||
const [historyResponse, systemWidgetsResponse] = await Promise.all([
|
||||
axios.get(
|
||||
`${this.serverURL}/api/v1/conversation-history?supports_widgets=true${sessionQuery}`
|
||||
),
|
||||
axios.get(
|
||||
`${this.serverURL}/api/v1/system-widgets?supports_widgets=true${sessionQuery}`
|
||||
)
|
||||
])
|
||||
const history = Array.isArray(historyResponse.data?.history)
|
||||
? historyResponse.data.history
|
||||
: []
|
||||
const systemWidgets = Array.isArray(systemWidgetsResponse.data?.widgets)
|
||||
? systemWidgetsResponse.data.widgets
|
||||
: []
|
||||
|
||||
const timelineItems = [...history, ...systemWidgets]
|
||||
.map((item, index) => ({
|
||||
...item,
|
||||
sortIndex: index
|
||||
}))
|
||||
.sort((left, right) => {
|
||||
if (left.sentAt !== right.sentAt) {
|
||||
return left.sentAt - right.sentAt
|
||||
}
|
||||
|
||||
const leftWeight = this.getTimelineItemWeight(left)
|
||||
const rightWeight = this.getTimelineItemWeight(right)
|
||||
|
||||
if (leftWeight !== rightWeight) {
|
||||
return leftWeight - rightWeight
|
||||
}
|
||||
|
||||
return left.sortIndex - right.sortIndex
|
||||
})
|
||||
|
||||
this.parsedBubbles = history
|
||||
|
||||
if (timelineItems.length === 0) {
|
||||
this.noBubbleMessage.classList.remove('hide')
|
||||
return
|
||||
}
|
||||
|
||||
for (let i = 0; i < timelineItems.length; i += 1) {
|
||||
const bubble = timelineItems[i]
|
||||
|
||||
if (
|
||||
bubble.originalString &&
|
||||
ToolUIHandler.isToolOutputMarker(bubble.originalString)
|
||||
) {
|
||||
continue
|
||||
}
|
||||
|
||||
this.createBubble({
|
||||
who: bubble.who === 'owner' ? 'me' : bubble.who,
|
||||
string: bubble.originalString ? bubble.originalString : bubble.string,
|
||||
metrics: bubble.llmMetrics || null,
|
||||
sentAt: bubble.sentAt,
|
||||
save: false,
|
||||
isCreatingFromLoadingFeed: true,
|
||||
messageId: bubble.messageId
|
||||
})
|
||||
}
|
||||
|
||||
void this.hydrateFetchedWidgets()
|
||||
}
|
||||
|
||||
createBubble(params) {
|
||||
const {
|
||||
who,
|
||||
string,
|
||||
metrics = null,
|
||||
save = true,
|
||||
bubbleId,
|
||||
isCreatingFromLoadingFeed = false,
|
||||
messageId,
|
||||
sentAt = null,
|
||||
beforeElement = null
|
||||
} = params
|
||||
const container = document.createElement('div')
|
||||
const bubble = document.createElement('p')
|
||||
|
||||
if (!this.noBubbleMessage.classList.contains('hide')) {
|
||||
this.noBubbleMessage.classList.add('hide')
|
||||
}
|
||||
|
||||
container.className = `bubble-container ${who}`
|
||||
bubble.className = 'bubble'
|
||||
|
||||
if (messageId) {
|
||||
container.setAttribute('data-message-id', messageId)
|
||||
}
|
||||
|
||||
// Store original string before formatting
|
||||
const originalString = string
|
||||
const formattedString = this.formatMessage(string)
|
||||
const widgetPayload = this.getWidgetPayload(formattedString)
|
||||
const autoPlanInsertionPoint = this.getPlanWidgetInsertionPoint(widgetPayload)
|
||||
const resolvedBeforeElement = beforeElement || autoPlanInsertionPoint
|
||||
|
||||
bubble.innerHTML = formattedString
|
||||
|
||||
if (bubbleId) {
|
||||
container.classList.add(bubbleId)
|
||||
}
|
||||
|
||||
if (resolvedBeforeElement && resolvedBeforeElement.parentNode === this.feed) {
|
||||
this.feed.insertBefore(container, resolvedBeforeElement)
|
||||
} else {
|
||||
this.feed.appendChild(container)
|
||||
}
|
||||
container.appendChild(bubble)
|
||||
|
||||
if (who === 'leon' && metrics) {
|
||||
container.appendChild(this.createMetricsElement(metrics, sentAt))
|
||||
} else if (who === 'me') {
|
||||
const timestampElement = this.createTimestampElement(sentAt)
|
||||
|
||||
if (timestampElement) {
|
||||
container.appendChild(timestampElement)
|
||||
}
|
||||
}
|
||||
|
||||
let widgetComponentTree = null
|
||||
let widgetSupportedEvents = null
|
||||
|
||||
/**
|
||||
* Widget rendering
|
||||
*/
|
||||
if (
|
||||
formattedString.includes &&
|
||||
formattedString.includes('"component":"WidgetWrapper"')
|
||||
) {
|
||||
const parsedWidget = widgetPayload || JSON.parse(formattedString)
|
||||
container.setAttribute('data-widget-id', parsedWidget.id)
|
||||
|
||||
/**
|
||||
* On widget fetching, render the loader
|
||||
*/
|
||||
if (isCreatingFromLoadingFeed && parsedWidget.onFetch) {
|
||||
const root = createRoot(container)
|
||||
|
||||
root.render(
|
||||
createElement(WidgetWrapper, {
|
||||
children: createElement(Flexbox, {
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
children: createElement(Loader)
|
||||
})
|
||||
})
|
||||
)
|
||||
|
||||
WIDGETS_TO_FETCH.push({
|
||||
reactRootNode: root,
|
||||
widgetId: parsedWidget.id,
|
||||
onFetch: parsedWidget.onFetch
|
||||
})
|
||||
|
||||
return container
|
||||
}
|
||||
|
||||
widgetComponentTree = parsedWidget.componentTree
|
||||
widgetSupportedEvents = parsedWidget.supportedEvents
|
||||
|
||||
/**
|
||||
* On widget creation
|
||||
*/
|
||||
const root = createRoot(container)
|
||||
|
||||
const reactNode = renderAuroraComponent(
|
||||
this.socket,
|
||||
widgetComponentTree,
|
||||
widgetSupportedEvents
|
||||
)
|
||||
|
||||
root.render(reactNode)
|
||||
}
|
||||
|
||||
if (save) {
|
||||
this.saveBubble(who, originalString, formattedString, messageId, metrics, sentAt)
|
||||
}
|
||||
|
||||
return container
|
||||
}
|
||||
|
||||
formatReasoningPhaseTitle(phase) {
|
||||
const normalizedPhase =
|
||||
typeof phase === 'string' && phase.trim()
|
||||
? phase.replaceAll('_', ' ').toUpperCase()
|
||||
: 'EXECUTION'
|
||||
|
||||
return `REASONING - ${normalizedPhase}`
|
||||
}
|
||||
|
||||
createOrUpdateReasoningBlock(generationId, token, phase) {
|
||||
if (!generationId || !token) {
|
||||
return null
|
||||
}
|
||||
|
||||
if (!this.noBubbleMessage.classList.contains('hide')) {
|
||||
this.noBubbleMessage.classList.add('hide')
|
||||
}
|
||||
|
||||
let reasoningBlock = this.reasoningBlocks.get(generationId)
|
||||
|
||||
if (!reasoningBlock) {
|
||||
const container = document.createElement('div')
|
||||
const block = document.createElement('div')
|
||||
const header = document.createElement('div')
|
||||
const icon = document.createElement('i')
|
||||
const title = document.createElement('span')
|
||||
const content = document.createElement('div')
|
||||
|
||||
container.className = 'reasoning-block-container leon'
|
||||
container.setAttribute('data-reasoning-id', generationId)
|
||||
block.className = 'reasoning-block'
|
||||
header.className = 'reasoning-header'
|
||||
icon.className = 'ri-brain-ai-3-line reasoning-icon'
|
||||
title.className = 'reasoning-title'
|
||||
title.textContent = this.formatReasoningPhaseTitle(phase)
|
||||
content.className = 'reasoning-content'
|
||||
|
||||
header.appendChild(icon)
|
||||
header.appendChild(title)
|
||||
block.appendChild(header)
|
||||
block.appendChild(content)
|
||||
container.appendChild(block)
|
||||
this.feed.appendChild(container)
|
||||
|
||||
reasoningBlock = {
|
||||
container,
|
||||
content,
|
||||
text: '',
|
||||
isAutoScrollEnabled: true,
|
||||
isProgrammaticScroll: false
|
||||
}
|
||||
content.addEventListener(
|
||||
'scroll',
|
||||
() => {
|
||||
if (reasoningBlock.isProgrammaticScroll) {
|
||||
return
|
||||
}
|
||||
|
||||
reasoningBlock.isAutoScrollEnabled = this.isElementNearBottom(content)
|
||||
},
|
||||
{ passive: true }
|
||||
)
|
||||
this.reasoningBlocks.set(generationId, reasoningBlock)
|
||||
}
|
||||
|
||||
reasoningBlock.text += token
|
||||
reasoningBlock.content.textContent = reasoningBlock.text
|
||||
this.scrollReasoningContentToBottom(reasoningBlock)
|
||||
|
||||
return reasoningBlock.container
|
||||
}
|
||||
|
||||
handleToolOutput(data) {
|
||||
const result = this.toolUIHandler.handleToolOutput(data)
|
||||
|
||||
// Save in memory if it's a new group
|
||||
if (result && result.isNewGroup) {
|
||||
const { toolkitName, toolName, answer } = data
|
||||
const toolInfo = this.toolUIHandler.getToolGroupInfo(
|
||||
result.groupId,
|
||||
toolkitName,
|
||||
toolName,
|
||||
answer
|
||||
)
|
||||
|
||||
this.saveBubble(
|
||||
'leon',
|
||||
toolInfo.originalString,
|
||||
toolInfo.formattedMessage,
|
||||
toolInfo.messageId
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
saveBubble(
|
||||
who,
|
||||
originalString,
|
||||
string,
|
||||
messageId,
|
||||
metrics = null,
|
||||
sentAt = null
|
||||
) {
|
||||
if (!this.noBubbleMessage.classList.contains('hide')) {
|
||||
this.noBubbleMessage.classList.add('hide')
|
||||
}
|
||||
|
||||
if (this.parsedBubbles.length === MAXIMUM_BUBBLES_IN_MEMORY) {
|
||||
this.parsedBubbles.shift()
|
||||
}
|
||||
|
||||
// Store both original and formatted strings
|
||||
this.parsedBubbles.push({
|
||||
who,
|
||||
sentAt,
|
||||
string,
|
||||
originalString,
|
||||
messageId,
|
||||
llmMetrics: metrics
|
||||
})
|
||||
this.scrollDown()
|
||||
}
|
||||
|
||||
formatMessage(message) {
|
||||
const isWidget =
|
||||
message.includes && message.includes('"component":"WidgetWrapper"')
|
||||
|
||||
if (typeof message === 'string' && !isWidget) {
|
||||
message = escapeHTML(message)
|
||||
message = message.replace(/\n/g, '<br />')
|
||||
|
||||
// Handle HTTP/HTTPS URLs with simple regex
|
||||
message = message.replace(/https?:\/\/[^\s<>"{}|\\^`[\]]+/gi, (match) => {
|
||||
return `<a href="${match}" target="_blank" rel="noopener noreferrer" class="clickable-url" title="Open URL in browser">${match}</a>`
|
||||
})
|
||||
|
||||
// Handle file paths with delimiters for exact matching
|
||||
message = message.replace(
|
||||
/\[FILE_PATH\](.*?)\[\/FILE_PATH\]/g,
|
||||
(match, filePath) => {
|
||||
return `<span class="clickable-path" data-path="${filePath}" title="Open in file explorer">${filePath}</span>`
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
return message
|
||||
}
|
||||
|
||||
formatMetricTimestamp(sentAt) {
|
||||
if (typeof sentAt !== 'number' || !Number.isFinite(sentAt)) {
|
||||
return ''
|
||||
}
|
||||
|
||||
const date = new Date(sentAt)
|
||||
const now = new Date()
|
||||
|
||||
if (Number.isNaN(date.getTime()) || Number.isNaN(now.getTime())) {
|
||||
return ''
|
||||
}
|
||||
|
||||
const timeFormatter = new Intl.DateTimeFormat(undefined, {
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
hour12: false
|
||||
})
|
||||
const formattedTime = timeFormatter.format(date)
|
||||
const startOfToday = new Date(
|
||||
now.getFullYear(),
|
||||
now.getMonth(),
|
||||
now.getDate()
|
||||
)
|
||||
const startOfTargetDay = new Date(
|
||||
date.getFullYear(),
|
||||
date.getMonth(),
|
||||
date.getDate()
|
||||
)
|
||||
const dayDifference = Math.round(
|
||||
(startOfToday.getTime() - startOfTargetDay.getTime()) / 86_400_000
|
||||
)
|
||||
|
||||
if (dayDifference === 0) {
|
||||
return `Today, ${formattedTime}`
|
||||
}
|
||||
|
||||
if (dayDifference === 1) {
|
||||
return `Yesterday, ${formattedTime}`
|
||||
}
|
||||
|
||||
if (dayDifference > 1 && dayDifference < 7) {
|
||||
const weekdayFormatter = new Intl.DateTimeFormat(undefined, {
|
||||
weekday: 'long'
|
||||
})
|
||||
|
||||
return `${weekdayFormatter.format(date)}, ${formattedTime}`
|
||||
}
|
||||
|
||||
const monthDayFormatter = new Intl.DateTimeFormat(undefined, {
|
||||
month: 'short',
|
||||
day: 'numeric'
|
||||
})
|
||||
|
||||
return `${monthDayFormatter.format(date)}, ${formattedTime}`
|
||||
}
|
||||
|
||||
formatFullMetricTimestamp(sentAt) {
|
||||
if (typeof sentAt !== 'number' || !Number.isFinite(sentAt)) {
|
||||
return ''
|
||||
}
|
||||
|
||||
const date = new Date(sentAt)
|
||||
|
||||
if (Number.isNaN(date.getTime())) {
|
||||
return ''
|
||||
}
|
||||
|
||||
const year = date.getFullYear()
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0')
|
||||
const day = String(date.getDate()).padStart(2, '0')
|
||||
const hours = String(date.getHours()).padStart(2, '0')
|
||||
const minutes = String(date.getMinutes()).padStart(2, '0')
|
||||
const seconds = String(date.getSeconds()).padStart(2, '0')
|
||||
|
||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
|
||||
}
|
||||
|
||||
formatTimestampMarkup(sentAt) {
|
||||
const formattedTimestamp = this.formatMetricTimestamp(sentAt)
|
||||
const fullFormattedTimestamp = this.formatFullMetricTimestamp(sentAt)
|
||||
|
||||
if (!formattedTimestamp) {
|
||||
return ''
|
||||
}
|
||||
|
||||
return `
|
||||
<span class="bubble-metric-item">
|
||||
<i class="ri-time-line" aria-hidden="true"></i>
|
||||
<span title="${fullFormattedTimestamp || formattedTimestamp}">${formattedTimestamp}</span>
|
||||
</span>
|
||||
`.trim()
|
||||
}
|
||||
|
||||
formatTurnDuration(durationMs) {
|
||||
const durationSeconds = Number(durationMs || 0) / 1_000
|
||||
const roundedDurationSeconds = Math.max(0, Number(durationSeconds.toFixed(1)))
|
||||
|
||||
if (roundedDurationSeconds < SECONDS_PER_MINUTE) {
|
||||
return `${roundedDurationSeconds.toFixed(1)}s`
|
||||
}
|
||||
|
||||
const minutes = Math.floor(roundedDurationSeconds / SECONDS_PER_MINUTE)
|
||||
const seconds = roundedDurationSeconds % SECONDS_PER_MINUTE
|
||||
|
||||
return `${minutes}m${seconds.toFixed(1)}s`
|
||||
}
|
||||
|
||||
formatMetrics(metrics, sentAt = null) {
|
||||
if (!metrics) {
|
||||
return ''
|
||||
}
|
||||
|
||||
const inputTokens = Number(metrics.inputTokens || 0)
|
||||
const outputTokens = Number(metrics.outputTokens || 0)
|
||||
const totalTokens = Number(metrics.totalTokens || inputTokens + outputTokens)
|
||||
const turnDuration = this.formatTurnDuration(metrics.durationMs)
|
||||
const tokensPerSecond = Number(
|
||||
metrics.tokensPerSecond || metrics.averagedPhaseTokensPerSecond || 0
|
||||
)
|
||||
const tokenFormatter = new Intl.NumberFormat()
|
||||
const timestampMarkup = this.formatTimestampMarkup(sentAt)
|
||||
|
||||
return `
|
||||
<span class="bubble-metric-item">
|
||||
<i class="ri-copper-coin-line" aria-hidden="true"></i>
|
||||
<span>${tokenFormatter.format(totalTokens)} (i:${tokenFormatter.format(inputTokens)}/o:${tokenFormatter.format(outputTokens)}) tok</span>
|
||||
</span>
|
||||
<span class="bubble-metric-item">
|
||||
<i class="ri-timer-flash-line" aria-hidden="true"></i>
|
||||
<span>${turnDuration}</span>
|
||||
</span>
|
||||
<span class="bubble-metric-item">
|
||||
<i class="ri-flashlight-line" aria-hidden="true"></i>
|
||||
<span>${tokensPerSecond.toFixed(2)} t/s</span>
|
||||
</span>
|
||||
${timestampMarkup}
|
||||
`.trim()
|
||||
}
|
||||
|
||||
createMetricsElement(metrics, sentAt = null) {
|
||||
const metricsElement = document.createElement('div')
|
||||
|
||||
metricsElement.className = 'bubble-metrics'
|
||||
metricsElement.innerHTML = this.formatMetrics(metrics, sentAt)
|
||||
|
||||
return metricsElement
|
||||
}
|
||||
|
||||
createTimestampElement(sentAt) {
|
||||
const timestampMarkup = this.formatTimestampMarkup(sentAt)
|
||||
|
||||
if (!timestampMarkup) {
|
||||
return null
|
||||
}
|
||||
|
||||
const timestampElement = document.createElement('div')
|
||||
|
||||
timestampElement.className = 'bubble-metrics'
|
||||
timestampElement.innerHTML = timestampMarkup
|
||||
|
||||
return timestampElement
|
||||
}
|
||||
|
||||
updateBubbleMetrics(container, metrics, sentAt = null) {
|
||||
if (!container) {
|
||||
return
|
||||
}
|
||||
|
||||
const existingMetricsElement = container.querySelector('.bubble-metrics')
|
||||
|
||||
if (!metrics) {
|
||||
if (existingMetricsElement) {
|
||||
existingMetricsElement.remove()
|
||||
}
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (existingMetricsElement) {
|
||||
existingMetricsElement.innerHTML = this.formatMetrics(metrics, sentAt)
|
||||
return
|
||||
}
|
||||
|
||||
container.appendChild(this.createMetricsElement(metrics, sentAt))
|
||||
}
|
||||
|
||||
getLatestReasoningContainer() {
|
||||
const reasoningContainers = this.feed.querySelectorAll(
|
||||
'.reasoning-block-container'
|
||||
)
|
||||
|
||||
if (reasoningContainers.length === 0) {
|
||||
return null
|
||||
}
|
||||
|
||||
return reasoningContainers[reasoningContainers.length - 1] || null
|
||||
}
|
||||
|
||||
replaceMessage(replaceMessageId, newData) {
|
||||
const existingBubble = document.querySelector(
|
||||
`[data-message-id="${replaceMessageId}"]`
|
||||
)
|
||||
const isPlanWidget = this.isPlanWidgetData(newData)
|
||||
const nextSibling = existingBubble ? existingBubble.nextSibling : null
|
||||
|
||||
if (existingBubble) {
|
||||
existingBubble.remove()
|
||||
|
||||
const bubbleIndex = this.parsedBubbles.findIndex(
|
||||
(bubble) => bubble.messageId === replaceMessageId
|
||||
)
|
||||
if (bubbleIndex !== -1) {
|
||||
this.parsedBubbles.splice(bubbleIndex, 1)
|
||||
}
|
||||
}
|
||||
|
||||
const isTextAnswerPayload = Boolean(
|
||||
newData &&
|
||||
typeof newData === 'object' &&
|
||||
typeof newData.answer === 'string' &&
|
||||
!newData.widget &&
|
||||
!newData.componentTree
|
||||
)
|
||||
const bubbleString = isTextAnswerPayload
|
||||
? newData.answer
|
||||
: typeof newData === 'string'
|
||||
? newData
|
||||
: JSON.stringify(newData)
|
||||
const metrics =
|
||||
isTextAnswerPayload && newData.llmMetrics ? newData.llmMetrics : null
|
||||
|
||||
const shouldSaveMessage = !this.isSystemWidgetData(newData)
|
||||
const beforeElement = isPlanWidget ? null : nextSibling
|
||||
|
||||
this.createBubble({
|
||||
who: 'leon',
|
||||
string: bubbleString,
|
||||
save: shouldSaveMessage,
|
||||
messageId: replaceMessageId,
|
||||
beforeElement,
|
||||
metrics,
|
||||
sentAt:
|
||||
newData && typeof newData === 'object' && typeof newData.sentAt === 'number'
|
||||
? newData.sentAt
|
||||
: Date.now()
|
||||
})
|
||||
|
||||
/**
|
||||
* Only scroll down on the first replacement of this message
|
||||
* to avoid repeating scrolling for every message replacement
|
||||
*/
|
||||
if (!REPLACED_MESSAGES.has(replaceMessageId)) {
|
||||
REPLACED_MESSAGES.add(replaceMessageId)
|
||||
this.scrollDown()
|
||||
}
|
||||
}
|
||||
|
||||
openPath(filePath) {
|
||||
// Send request to server to open the file path in system file explorer
|
||||
fetch(`${this.serverURL}/api/v1/open-path`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({ path: filePath })
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
if (!data.success) {
|
||||
console.error('Failed to open path:', data.error)
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Error opening path:', error)
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,651 @@
|
||||
import { io } from 'socket.io-client'
|
||||
|
||||
import Chatbot from './chatbot'
|
||||
import VoiceEnergy from './voice-energy'
|
||||
import { ASR_DISABLED_MESSAGE, INIT_MESSAGES } from './constants'
|
||||
import handleSuggestions from './suggestion-handler.js'
|
||||
|
||||
const LEON_CLIENT_INTERFACE_PROTOCOL_VERSION = 1
|
||||
const LEON_EVENTS = {
|
||||
init: 'leon:init',
|
||||
utterance: 'leon:utterance',
|
||||
ready: 'leon:ready',
|
||||
answer: 'leon:answer',
|
||||
isTyping: 'leon:is-typing',
|
||||
suggest: 'leon:suggest',
|
||||
llmToken: 'leon:llm-token',
|
||||
llmReasoningToken: 'leon:llm-reasoning-token',
|
||||
ownerUtterance: 'leon:owner-utterance',
|
||||
error: 'leon:error'
|
||||
}
|
||||
|
||||
export default class Client {
|
||||
constructor(client, serverUrl, input, options = {}) {
|
||||
this.client = client
|
||||
this._input = input
|
||||
this.voiceSpeechElement = document.querySelector('#voice-speech')
|
||||
this.serverUrl = serverUrl
|
||||
this.socket = io(this.serverUrl)
|
||||
this.activeSessionId = options.activeSessionId || null
|
||||
this.history = localStorage.getItem('history')
|
||||
this.parsedHistory = []
|
||||
this.chatbot = new Chatbot(this.socket, this.serverUrl, this.activeSessionId)
|
||||
this.voiceEnergy = new VoiceEnergy(this)
|
||||
this._recorder = {}
|
||||
this._suggestions = []
|
||||
this._answerGenerationId = 'xxx'
|
||||
this._activeStreamGenerationId = null
|
||||
this._ttsAudioContext = null
|
||||
this._isLeonGeneratingAnswer = false
|
||||
this._isVoiceModeEnabled = false
|
||||
this._hasSentInitMessages = false
|
||||
this._chatbotInitPromise = null
|
||||
// this._ttsAudioContextes = {}
|
||||
}
|
||||
|
||||
set input(newInput) {
|
||||
if (typeof newInput !== 'undefined') {
|
||||
this._input.value = newInput
|
||||
}
|
||||
}
|
||||
|
||||
get input() {
|
||||
return this._input
|
||||
}
|
||||
|
||||
set recorder(recorder) {
|
||||
this._recorder = recorder
|
||||
}
|
||||
|
||||
get recorder() {
|
||||
return this._recorder
|
||||
}
|
||||
|
||||
updateMood(mood) {
|
||||
const moodContainer = document.querySelector('#mood')
|
||||
|
||||
if (!moodContainer || !mood?.emoji || !mood?.type) {
|
||||
return
|
||||
}
|
||||
|
||||
moodContainer.textContent = `Leon's mood: ${mood.emoji}`
|
||||
moodContainer.setAttribute('title', mood.type)
|
||||
}
|
||||
|
||||
setSessionPanel(sessionPanel) {
|
||||
this.sessionPanel = sessionPanel
|
||||
}
|
||||
|
||||
async setActiveSession(sessionId) {
|
||||
if (!sessionId || sessionId === this.activeSessionId) {
|
||||
return
|
||||
}
|
||||
|
||||
this.activeSessionId = sessionId
|
||||
this.chatbot.setSessionId(sessionId)
|
||||
this.socket.emit('session-change', sessionId)
|
||||
await this.chatbot.loadFeed()
|
||||
this.chatbot.scrollDown({ force: true })
|
||||
}
|
||||
|
||||
async sendInitMessages() {
|
||||
for (let i = 0; i < INIT_MESSAGES.length; i++) {
|
||||
const messages = INIT_MESSAGES[i]
|
||||
const message = messages[Math.floor(Math.random() * messages.length)]
|
||||
const sendingDelay = Math.floor(Math.random() * 2000) + 1000
|
||||
const typingFactorDelay = Math.floor(Math.random() * 4) + 2
|
||||
|
||||
setTimeout(() => {
|
||||
this.chatbot.isTyping('leon', true)
|
||||
}, sendingDelay / typingFactorDelay)
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, sendingDelay))
|
||||
|
||||
this.chatbot.receivedFrom('leon', message)
|
||||
this.chatbot.isTyping('leon', false)
|
||||
}
|
||||
}
|
||||
|
||||
setInitStatus(statusName, statusType) {
|
||||
window.leonInitStatusEvent.dispatchEvent(
|
||||
new CustomEvent('initStatusChange', {
|
||||
detail: {
|
||||
statusName,
|
||||
statusType
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
waitForInitUICompletion() {
|
||||
if (this._hasSentInitMessages || this.chatbot.parsedBubbles?.length > 0) {
|
||||
return
|
||||
}
|
||||
|
||||
const trySendInitMessages = () => {
|
||||
const initializedInitElement = document.querySelector('#init .initialized')
|
||||
|
||||
if (!initializedInitElement) {
|
||||
return false
|
||||
}
|
||||
|
||||
this._hasSentInitMessages = true
|
||||
this.sendInitMessages()
|
||||
return true
|
||||
}
|
||||
|
||||
if (trySendInitMessages()) {
|
||||
return
|
||||
}
|
||||
|
||||
const interval = setInterval(() => {
|
||||
if (trySendInitMessages()) {
|
||||
clearInterval(interval)
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
|
||||
asrStartRecording() {
|
||||
if (!window.leonConfigInfo.asr.enabled) {
|
||||
alert(ASR_DISABLED_MESSAGE)
|
||||
return
|
||||
}
|
||||
|
||||
if (!this._isVoiceModeEnabled) {
|
||||
this.enableVoiceMode()
|
||||
|
||||
this.voiceEnergy.status = 'listening'
|
||||
|
||||
this.socket.emit('asr-start-record')
|
||||
}
|
||||
}
|
||||
|
||||
init() {
|
||||
this._chatbotInitPromise = this.chatbot.init()
|
||||
this.voiceEnergy.init()
|
||||
|
||||
if (window.leonConfigInfo?.tcpServer?.enabled === false) {
|
||||
this.setInitStatus('tcpServerBoot', 'success')
|
||||
}
|
||||
|
||||
this.socket.on('connect', () => {
|
||||
this.socket.emit(LEON_EVENTS.init, {
|
||||
protocolVersion: LEON_CLIENT_INTERFACE_PROTOCOL_VERSION,
|
||||
client: {
|
||||
id: this.client,
|
||||
type: 'web_app',
|
||||
name: 'Leon Web App'
|
||||
},
|
||||
sessionId: this.activeSessionId,
|
||||
capabilities: {
|
||||
supportsWidgets: true,
|
||||
supportsTokenStreaming: true,
|
||||
supportsVoice: true
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
/**
|
||||
* Init status listeners
|
||||
*/
|
||||
this.socket.on('init-llama-server-boot', (status) => {
|
||||
this.setInitStatus('llamaServerBoot', status)
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.ready, () => {
|
||||
this.setInitStatus('clientCoreServerHandshake', 'success')
|
||||
this.setInitStatus('tcpServerBoot', 'success')
|
||||
|
||||
void this._chatbotInitPromise?.then(() => {
|
||||
setTimeout(() => {
|
||||
const body = document.querySelector('body')
|
||||
body.classList.remove('settingup')
|
||||
}, 250)
|
||||
|
||||
this.waitForInitUICompletion()
|
||||
})
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.answer, (data) => {
|
||||
/*if (this._isVoiceModeEnabled) {
|
||||
this.voiceEnergy.status = 'listening'
|
||||
}*/
|
||||
|
||||
// Leon has finished to answer
|
||||
this._isLeonGeneratingAnswer = false
|
||||
|
||||
const isPlanWidget =
|
||||
data && typeof data === 'object' && data.widget === 'PlanWidget'
|
||||
|
||||
if (isPlanWidget) {
|
||||
this.chatbot.isTyping('leon', false)
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle message replacement if replaceMessageId is provided
|
||||
*/
|
||||
if (data.replaceMessageId) {
|
||||
this.chatbot.replaceMessage(data.replaceMessageId, data)
|
||||
return
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle tool output messages
|
||||
*/
|
||||
if (data.isToolOutput) {
|
||||
this.chatbot.handleToolOutput(data)
|
||||
return
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle widget data directly
|
||||
*/
|
||||
if (data.widget || data.componentTree) {
|
||||
const isSystemWidget = this.chatbot.isSystemWidgetData(data)
|
||||
// Pass the entire widget data as JSON string for chatbot.js to handle
|
||||
const widgetString =
|
||||
typeof data === 'string' ? data : JSON.stringify(data)
|
||||
|
||||
this.chatbot.createBubble({
|
||||
who: 'leon',
|
||||
string: widgetString,
|
||||
save: !isSystemWidget,
|
||||
messageId: data.widget?.id || data.id || `msg-${Date.now()}`
|
||||
})
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
const answerText = typeof data === 'string' ? data : data.answer
|
||||
const llmMetrics =
|
||||
data && typeof data === 'object' && data.llmMetrics
|
||||
? data.llmMetrics
|
||||
: null
|
||||
|
||||
/**
|
||||
* Just save the bubble if the newest bubble is from the streaming.
|
||||
* Otherwise, create a new bubble
|
||||
*/
|
||||
const streamGenerationId =
|
||||
this._activeStreamGenerationId || this._answerGenerationId
|
||||
const streamedBubbleContainerElement = streamGenerationId
|
||||
? document.querySelector(
|
||||
`.bubble-container.leon.${streamGenerationId}`
|
||||
)
|
||||
: null
|
||||
const isBubbleFromStreaming = Boolean(streamedBubbleContainerElement)
|
||||
|
||||
if (isBubbleFromStreaming && streamedBubbleContainerElement) {
|
||||
this.chatbot.saveBubble(
|
||||
'leon',
|
||||
answerText,
|
||||
answerText,
|
||||
null,
|
||||
llmMetrics,
|
||||
data && typeof data === 'object' && typeof data.sentAt === 'number'
|
||||
? data.sentAt
|
||||
: Date.now()
|
||||
)
|
||||
|
||||
// Slightly delay the update to avoid the stream animation to be interrupted
|
||||
setTimeout(() => {
|
||||
// Update the text of the bubble (quick emoji fix)
|
||||
streamedBubbleContainerElement.querySelector('p.bubble').innerHTML =
|
||||
this.chatbot.formatMessage(answerText)
|
||||
this.chatbot.updateBubbleMetrics(
|
||||
streamedBubbleContainerElement,
|
||||
llmMetrics,
|
||||
data && typeof data === 'object' && typeof data.sentAt === 'number'
|
||||
? data.sentAt
|
||||
: Date.now()
|
||||
)
|
||||
}, 2_500)
|
||||
} else {
|
||||
this.chatbot.createBubble({
|
||||
who: 'leon',
|
||||
string: answerText,
|
||||
save:
|
||||
!(
|
||||
data &&
|
||||
typeof data === 'object' &&
|
||||
data.historyMode === 'system_widget'
|
||||
),
|
||||
metrics: llmMetrics,
|
||||
messageId: data && typeof data === 'object' ? data.messageId : null,
|
||||
sentAt:
|
||||
data && typeof data === 'object' && typeof data.sentAt === 'number'
|
||||
? data.sentAt
|
||||
: Date.now()
|
||||
})
|
||||
}
|
||||
this.chatbot.scrollDown({ force: true })
|
||||
|
||||
this._activeStreamGenerationId = null
|
||||
this._answerGenerationId = 'xxx'
|
||||
void this.sessionPanel?.refresh()
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.suggest, (data) => {
|
||||
setTimeout(() => {
|
||||
handleSuggestions(data, this.chatbot, this)
|
||||
}, 400)
|
||||
setTimeout(() => {
|
||||
this.chatbot.scrollDown()
|
||||
}, 450)
|
||||
/*data?.forEach((suggestionText) => {
|
||||
this.addSuggestion(suggestionText)
|
||||
})*/
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.isTyping, (data) => {
|
||||
this.chatbot.isTyping('leon', data)
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.ownerUtterance, (data) => {
|
||||
if (!data?.utterance) {
|
||||
return
|
||||
}
|
||||
|
||||
this.chatbot.createBubble({
|
||||
who: 'me',
|
||||
string: data.utterance,
|
||||
messageId: data.messageId,
|
||||
sentAt: typeof data.sentAt === 'number' ? data.sentAt : Date.now()
|
||||
})
|
||||
})
|
||||
|
||||
this.socket.on('recognized', (data, cb) => {
|
||||
this._input.value = data
|
||||
this.send('utterance')
|
||||
|
||||
cb('string-received')
|
||||
})
|
||||
|
||||
this.socket.on('widget-send-utterance', (utterance) => {
|
||||
this._input.value = utterance
|
||||
this.send('utterance')
|
||||
})
|
||||
|
||||
this.socket.on('new-mood', (mood) => {
|
||||
this.updateMood(mood)
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.llmToken, (data) => {
|
||||
if (this._isVoiceModeEnabled) {
|
||||
this.voiceEnergy.status = 'processing'
|
||||
}
|
||||
|
||||
this._isLeonGeneratingAnswer = true
|
||||
const previousGenerationId = this._answerGenerationId
|
||||
const newGenerationId = data.generationId
|
||||
this._answerGenerationId = newGenerationId
|
||||
this._activeStreamGenerationId = newGenerationId
|
||||
const isSameGeneration = previousGenerationId === newGenerationId
|
||||
let bubbleContainerElement = null
|
||||
|
||||
if (!isSameGeneration) {
|
||||
bubbleContainerElement = this.chatbot.createBubble({
|
||||
who: 'leon',
|
||||
string: data.token,
|
||||
save: false,
|
||||
bubbleId: newGenerationId
|
||||
})
|
||||
} else {
|
||||
bubbleContainerElement = document.querySelector(
|
||||
`.${previousGenerationId}`
|
||||
)
|
||||
}
|
||||
|
||||
const bubbleElement = bubbleContainerElement.querySelector('p.bubble')
|
||||
|
||||
// Token is already appened when it's a new generation
|
||||
if (isSameGeneration) {
|
||||
// bubbleElement.textContent += data.token
|
||||
|
||||
const tokenSpan = document.createElement('span')
|
||||
tokenSpan.className = 'llm-token fade-in'
|
||||
tokenSpan.textContent = data.token
|
||||
|
||||
bubbleElement.appendChild(tokenSpan)
|
||||
}
|
||||
|
||||
this.chatbot.scrollDown()
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.llmReasoningToken, (data) => {
|
||||
if (!data?.generationId || !data?.token) {
|
||||
return
|
||||
}
|
||||
|
||||
if (this._isVoiceModeEnabled) {
|
||||
this.voiceEnergy.status = 'processing'
|
||||
}
|
||||
|
||||
this._isLeonGeneratingAnswer = true
|
||||
this.chatbot.createOrUpdateReasoningBlock(
|
||||
data.generationId,
|
||||
data.token,
|
||||
data.phase
|
||||
)
|
||||
this.chatbot.scrollDown()
|
||||
})
|
||||
|
||||
this.socket.on('asr-speech', (text) => {
|
||||
if (!this._isVoiceModeEnabled) {
|
||||
this.enableVoiceMode()
|
||||
}
|
||||
|
||||
this.voiceEnergy.status = 'listening'
|
||||
this._input.value = text
|
||||
|
||||
if (this.voiceSpeechElement) {
|
||||
this.voiceSpeechElement.textContent = text
|
||||
}
|
||||
})
|
||||
|
||||
this.socket.on('asr-end-of-owner-speech', () => {
|
||||
this.voiceEnergy.status = 'processing'
|
||||
|
||||
setTimeout(() => {
|
||||
this.send('utterance')
|
||||
}, 200)
|
||||
})
|
||||
|
||||
this.socket.on('asr-active-listening-disabled', () => {
|
||||
this.voiceEnergy.status = 'idle'
|
||||
})
|
||||
|
||||
/**
|
||||
* Only used for "local" TTS provider as a PoC for now.
|
||||
* Target to do a better implementation in the future
|
||||
* with streaming support
|
||||
*/
|
||||
this.socket.on('tts-stream', (data) => {
|
||||
this.voiceEnergy.status = 'talking'
|
||||
|
||||
// const { audioId, chunk } = data
|
||||
const { chunk } = data
|
||||
this._ttsAudioContext = new AudioContext()
|
||||
// this._ttsAudioContextes[audioId] = ctx
|
||||
|
||||
const source = this._ttsAudioContext.createBufferSource()
|
||||
this._ttsAudioContext.decodeAudioData(chunk, (buffer) => {
|
||||
source.buffer = buffer
|
||||
|
||||
source.connect(this._ttsAudioContext.destination)
|
||||
source.start(0)
|
||||
})
|
||||
})
|
||||
|
||||
/**
|
||||
* When Leon got interrupted by the owner voice
|
||||
* while he is speaking
|
||||
*/
|
||||
this.socket.on('tts-interruption', async () => {
|
||||
if (this._ttsAudioContext) {
|
||||
await this._ttsAudioContext.close()
|
||||
}
|
||||
})
|
||||
|
||||
this.socket.on('tts-end-of-speech', async () => {
|
||||
this.voiceEnergy.status = 'listening'
|
||||
|
||||
if (window.leonConfigInfo?.asr?.enabled) {
|
||||
this.socket.emit('asr-start-record')
|
||||
}
|
||||
})
|
||||
|
||||
this.socket.on('audio-forwarded', (data, cb) => {
|
||||
const ctx = new AudioContext()
|
||||
const source = ctx.createBufferSource()
|
||||
|
||||
ctx.decodeAudioData(data.buffer, (buffer) => {
|
||||
source.buffer = buffer
|
||||
|
||||
source.connect(ctx.destination)
|
||||
source.start(0)
|
||||
|
||||
/**
|
||||
* When the after speech option is enabled and
|
||||
* the answer is a final one
|
||||
*/
|
||||
if (window.leonConfigInfo.after_speech && data.is_final_answer) {
|
||||
// Enable recording after the speech + 500ms
|
||||
setTimeout(() => {
|
||||
this._recorder.start()
|
||||
this._recorder.enabled = true
|
||||
|
||||
// Check every second if the recorder is enabled to stop it
|
||||
const id = setInterval(() => {
|
||||
if (this._recorder.enabled) {
|
||||
if (this._recorder.countSilenceAfterTalk <= 8) {
|
||||
// Stop recording if there was no noise for 8 seconds
|
||||
if (this._recorder.countSilenceAfterTalk === 8) {
|
||||
this._recorder.stop()
|
||||
this._recorder.enabled = false
|
||||
this._recorder.countSilenceAfterTalk = 0
|
||||
clearInterval(id)
|
||||
} else if (!this._recorder.noiseDetected) {
|
||||
this._recorder.countSilenceAfterTalk += 1
|
||||
} else {
|
||||
clearInterval(id)
|
||||
}
|
||||
}
|
||||
}
|
||||
}, 1_000)
|
||||
}, data.duration + 500)
|
||||
}
|
||||
})
|
||||
|
||||
cb('audio-received')
|
||||
})
|
||||
|
||||
this.socket.on(LEON_EVENTS.error, (data) => {
|
||||
console.error('Leon client interface error:', data)
|
||||
})
|
||||
|
||||
if (this.history !== null) {
|
||||
this.parsedHistory = JSON.parse(this.history)
|
||||
}
|
||||
}
|
||||
|
||||
send(keyword) {
|
||||
if (keyword === 'utterance') {
|
||||
return this.sendUtterance(this._input.value)
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
|
||||
sendUtterance(value, options = {}) {
|
||||
if (this._isLeonGeneratingAnswer) {
|
||||
return false
|
||||
}
|
||||
|
||||
const trimmedValue = String(value || '').trim()
|
||||
|
||||
if (trimmedValue === '') {
|
||||
return false
|
||||
}
|
||||
|
||||
const sentAt =
|
||||
typeof options.sentAt === 'number' ? options.sentAt : Date.now()
|
||||
|
||||
this.socket.emit(LEON_EVENTS.utterance, {
|
||||
value: trimmedValue,
|
||||
sentAt,
|
||||
sessionId: this.activeSessionId,
|
||||
...(options.commandContext
|
||||
? { commandContext: options.commandContext }
|
||||
: {})
|
||||
})
|
||||
this.chatbot.sendTo('leon', trimmedValue, sentAt)
|
||||
this.chatbot.scrollDown({ force: true })
|
||||
|
||||
this.save(trimmedValue)
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
save(value = this._input.value) {
|
||||
let val = value
|
||||
|
||||
if (localStorage.getItem('history') === null) {
|
||||
localStorage.setItem('history', JSON.stringify([]))
|
||||
this.parsedHistory = JSON.parse(localStorage.getItem('history'))
|
||||
} else if (this.parsedHistory.length >= 32) {
|
||||
this.parsedHistory.shift()
|
||||
}
|
||||
|
||||
if (val[0] === ' ') {
|
||||
val = val.substr(1, val.length - 1)
|
||||
}
|
||||
|
||||
if (this.parsedHistory[this.parsedHistory.length - 1] !== val) {
|
||||
this.parsedHistory.push(val)
|
||||
localStorage.setItem('history', JSON.stringify(this.parsedHistory))
|
||||
}
|
||||
|
||||
this._input.value = ''
|
||||
setTimeout(() => {
|
||||
// Remove the last character to avoid the space
|
||||
this._input.value = this._input.value.slice(0, -1)
|
||||
}, 0)
|
||||
}
|
||||
|
||||
enableVoiceMode() {
|
||||
if (!this._isVoiceModeEnabled) {
|
||||
this._isVoiceModeEnabled = true
|
||||
|
||||
const body = document.querySelector('body')
|
||||
if (!body.classList.contains('voice-mode-enabled')) {
|
||||
body.classList.add('voice-mode-enabled')
|
||||
|
||||
const voiceOverlayTransitor = document.createElement('div')
|
||||
voiceOverlayTransitor.id = 'voice-overlay-transitor'
|
||||
body.appendChild(voiceOverlayTransitor)
|
||||
voiceOverlayTransitor.addEventListener('animationend', () => {
|
||||
voiceOverlayTransitor.removeEventListener('animationend', () => {})
|
||||
voiceOverlayTransitor.remove()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
disableVoiceMode() {
|
||||
if (this._isVoiceModeEnabled) {
|
||||
this._isVoiceModeEnabled = false
|
||||
|
||||
const body = document.querySelector('body')
|
||||
|
||||
const voiceContainer = document.querySelector('#voice-container')
|
||||
if (voiceContainer) {
|
||||
voiceContainer.style.animation = 'none'
|
||||
voiceContainer.style.animation = null
|
||||
}
|
||||
|
||||
if (body.classList.contains('voice-mode-enabled')) {
|
||||
body.classList.remove('voice-mode-enabled')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
export const INIT_MESSAGES = [
|
||||
[
|
||||
'Hi, I\'m Leon, your open-source personal assistant. I\'m still evolving, but I\'m here to help.'
|
||||
],
|
||||
[
|
||||
`Want to follow the project?
|
||||
|
||||
- Regular progress updates: https://x.com/grenlouis
|
||||
- Blog posts: https://blog.getleon.ai/
|
||||
- Email updates: https://leonai.substack.com/subscribe`
|
||||
],
|
||||
[
|
||||
`Come hang out on Discord: https://discord.gg/MNQqqKg
|
||||
That's where people will help shape the ecosystem and build what comes next.`
|
||||
],
|
||||
[
|
||||
'Leon is built independently in spare time. If you want to help accelerate development, you can support the project here: http://sponsor.getleon.ai/'
|
||||
]
|
||||
]
|
||||
|
||||
export const ASR_DISABLED_MESSAGE =
|
||||
'Voice mode is not enabled yet. Run /voice setup from the chat, wait for the resources to install, then restart Leon by using /restart.'
|
||||
@@ -0,0 +1,386 @@
|
||||
import axios from 'axios'
|
||||
|
||||
const AUTOCOMPLETE_DELAY_MS = 80
|
||||
const CLOSE_DELAY_MS = 120
|
||||
const DROPDOWN_MARGIN_PX = 8
|
||||
const MINIMUM_DROPDOWN_HEIGHT_PX = 196
|
||||
const MAXIMUM_DROPDOWN_HEIGHT_PX = 280
|
||||
const FILE_SYSTEM_TRIGGER = '@'
|
||||
const FOLDER_TYPE = 'folder'
|
||||
const DEFAULT_FILE_ICON_NAME = 'file-line'
|
||||
const DEFAULT_FOLDER_ICON_NAME = 'folder-3-line'
|
||||
const NAVIGATION_DIRECTIONS = {
|
||||
next: 1,
|
||||
previous: -1
|
||||
}
|
||||
|
||||
function isWhitespace(character) {
|
||||
return character.trim() === ''
|
||||
}
|
||||
|
||||
function findPathToken(input) {
|
||||
const selectionStart = input.selectionStart ?? input.value.length
|
||||
let tokenStart = selectionStart
|
||||
|
||||
while (
|
||||
tokenStart > 0 &&
|
||||
!isWhitespace(input.value.charAt(tokenStart - 1))
|
||||
) {
|
||||
tokenStart -= 1
|
||||
}
|
||||
|
||||
if (input.value.charAt(tokenStart) !== FILE_SYSTEM_TRIGGER) {
|
||||
return null
|
||||
}
|
||||
|
||||
return {
|
||||
start: tokenStart,
|
||||
end: selectionStart,
|
||||
value: input.value.slice(tokenStart, selectionStart)
|
||||
}
|
||||
}
|
||||
|
||||
export default class FileSystemAutocomplete {
|
||||
constructor({ serverUrl, input = null, onValueChange = null }) {
|
||||
this.serverUrl = serverUrl
|
||||
this.input = null
|
||||
this.onValueChange = onValueChange
|
||||
this.dropdown = document.createElement('div')
|
||||
this.dropdown.className = 'file-system-autocomplete file-system-autocomplete--hidden'
|
||||
this.entries = []
|
||||
this.selectedEntryIndex = -1
|
||||
this.token = null
|
||||
this.isOpen = false
|
||||
this.requestCounter = 0
|
||||
this.autocompleteTimeout = null
|
||||
this.closeTimeout = null
|
||||
this.shouldScrollSelectedEntry = false
|
||||
|
||||
this.handleInput = this.handleInput.bind(this)
|
||||
this.handleKeyDown = this.handleKeyDown.bind(this)
|
||||
this.handleFocus = this.handleFocus.bind(this)
|
||||
this.handleClick = this.handleClick.bind(this)
|
||||
this.handleBlur = this.handleBlur.bind(this)
|
||||
this.handleWindowChange = this.handleWindowChange.bind(this)
|
||||
|
||||
document.body.appendChild(this.dropdown)
|
||||
|
||||
if (input) {
|
||||
this.attach(input)
|
||||
}
|
||||
}
|
||||
|
||||
attach(input) {
|
||||
if (this.input === input) {
|
||||
return
|
||||
}
|
||||
|
||||
window.clearTimeout(this.closeTimeout)
|
||||
|
||||
if (this.input) {
|
||||
this.removeInputListeners()
|
||||
}
|
||||
|
||||
this.input = input
|
||||
this.input.addEventListener('input', this.handleInput)
|
||||
this.input.addEventListener('keydown', this.handleKeyDown)
|
||||
this.input.addEventListener('focus', this.handleFocus)
|
||||
this.input.addEventListener('click', this.handleClick)
|
||||
this.input.addEventListener('blur', this.handleBlur)
|
||||
window.addEventListener('resize', this.handleWindowChange)
|
||||
window.addEventListener('scroll', this.handleWindowChange, true)
|
||||
}
|
||||
|
||||
removeInputListeners() {
|
||||
if (!this.input) {
|
||||
return
|
||||
}
|
||||
|
||||
this.input.removeEventListener('input', this.handleInput)
|
||||
this.input.removeEventListener('keydown', this.handleKeyDown)
|
||||
this.input.removeEventListener('focus', this.handleFocus)
|
||||
this.input.removeEventListener('click', this.handleClick)
|
||||
this.input.removeEventListener('blur', this.handleBlur)
|
||||
window.removeEventListener('resize', this.handleWindowChange)
|
||||
window.removeEventListener('scroll', this.handleWindowChange, true)
|
||||
this.input = null
|
||||
}
|
||||
|
||||
detach() {
|
||||
this.removeInputListeners()
|
||||
this.close()
|
||||
}
|
||||
|
||||
handleInput() {
|
||||
window.clearTimeout(this.closeTimeout)
|
||||
this.queueAutocomplete()
|
||||
}
|
||||
|
||||
handleFocus() {
|
||||
window.clearTimeout(this.closeTimeout)
|
||||
this.queueAutocomplete()
|
||||
}
|
||||
|
||||
handleClick() {
|
||||
this.queueAutocomplete()
|
||||
}
|
||||
|
||||
handleBlur() {
|
||||
this.queueClose()
|
||||
}
|
||||
|
||||
queueClose() {
|
||||
window.clearTimeout(this.closeTimeout)
|
||||
this.closeTimeout = window.setTimeout(() => {
|
||||
this.close()
|
||||
}, CLOSE_DELAY_MS)
|
||||
}
|
||||
|
||||
handleWindowChange() {
|
||||
if (this.isOpen) {
|
||||
this.positionDropdown()
|
||||
}
|
||||
}
|
||||
|
||||
handleKeyDown(event) {
|
||||
if (!this.isOpen) {
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'Escape') {
|
||||
event.preventDefault()
|
||||
event.stopImmediatePropagation()
|
||||
this.close()
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'ArrowDown') {
|
||||
event.preventDefault()
|
||||
event.stopImmediatePropagation()
|
||||
this.moveSelection(NAVIGATION_DIRECTIONS.next)
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'ArrowUp') {
|
||||
event.preventDefault()
|
||||
event.stopImmediatePropagation()
|
||||
this.moveSelection(NAVIGATION_DIRECTIONS.previous)
|
||||
return
|
||||
}
|
||||
|
||||
if (event.key === 'Tab' || event.key === 'Enter') {
|
||||
const selectedEntry = this.entries[this.selectedEntryIndex]
|
||||
|
||||
if (selectedEntry) {
|
||||
event.preventDefault()
|
||||
event.stopImmediatePropagation()
|
||||
this.applyEntry(selectedEntry)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
queueAutocomplete() {
|
||||
window.clearTimeout(this.autocompleteTimeout)
|
||||
this.autocompleteTimeout = window.setTimeout(() => {
|
||||
void this.fetchAutocomplete()
|
||||
}, AUTOCOMPLETE_DELAY_MS)
|
||||
}
|
||||
|
||||
async fetchAutocomplete() {
|
||||
if (!this.input) {
|
||||
this.close()
|
||||
return
|
||||
}
|
||||
|
||||
if (document.activeElement !== this.input) {
|
||||
this.queueClose()
|
||||
return
|
||||
}
|
||||
|
||||
const token = findPathToken(this.input)
|
||||
|
||||
if (!token) {
|
||||
this.close()
|
||||
return
|
||||
}
|
||||
|
||||
const requestId = this.requestCounter + 1
|
||||
this.requestCounter = requestId
|
||||
this.token = token
|
||||
|
||||
try {
|
||||
const response = await axios.post(
|
||||
`${this.serverUrl}/api/v1/file-system/list`,
|
||||
{
|
||||
value: token.value
|
||||
}
|
||||
)
|
||||
|
||||
if (requestId !== this.requestCounter) {
|
||||
return
|
||||
}
|
||||
|
||||
this.entries = response.data.entries || []
|
||||
this.selectedEntryIndex = this.entries.length > 0 ? 0 : -1
|
||||
this.render()
|
||||
} catch {
|
||||
if (requestId !== this.requestCounter) {
|
||||
return
|
||||
}
|
||||
|
||||
this.entries = []
|
||||
this.selectedEntryIndex = -1
|
||||
this.render()
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
if (!this.input || !this.token) {
|
||||
this.close()
|
||||
return
|
||||
}
|
||||
|
||||
this.dropdown.innerHTML = ''
|
||||
|
||||
if (this.entries.length === 0) {
|
||||
const emptyElement = document.createElement('div')
|
||||
emptyElement.className = 'file-system-autocomplete__empty'
|
||||
emptyElement.textContent = 'No matching file system entry.'
|
||||
this.dropdown.appendChild(emptyElement)
|
||||
} else {
|
||||
this.entries.forEach((entry, index) => {
|
||||
const item = document.createElement('button')
|
||||
const icon = document.createElement('i')
|
||||
const label = document.createElement('span')
|
||||
|
||||
item.type = 'button'
|
||||
item.className = `file-system-autocomplete__item${
|
||||
index === this.selectedEntryIndex
|
||||
? ' file-system-autocomplete__item--selected'
|
||||
: ''
|
||||
}`
|
||||
icon.className = `ri-${
|
||||
entry.iconName ||
|
||||
(entry.type === FOLDER_TYPE
|
||||
? DEFAULT_FOLDER_ICON_NAME
|
||||
: DEFAULT_FILE_ICON_NAME)
|
||||
}`
|
||||
label.className = 'file-system-autocomplete__label'
|
||||
label.textContent = entry.value
|
||||
|
||||
item.addEventListener('mousedown', (event) => {
|
||||
event.preventDefault()
|
||||
})
|
||||
item.addEventListener('click', () => {
|
||||
this.applyEntry(entry)
|
||||
})
|
||||
|
||||
item.appendChild(icon)
|
||||
item.appendChild(label)
|
||||
this.dropdown.appendChild(item)
|
||||
})
|
||||
}
|
||||
|
||||
this.isOpen = true
|
||||
this.dropdown.classList.remove('file-system-autocomplete--hidden')
|
||||
this.positionDropdown()
|
||||
|
||||
if (this.shouldScrollSelectedEntry) {
|
||||
this.shouldScrollSelectedEntry = false
|
||||
this.scrollSelectedEntryIntoView()
|
||||
}
|
||||
}
|
||||
|
||||
positionDropdown() {
|
||||
const inputRect = this.input.getBoundingClientRect()
|
||||
const spaceBelow = window.innerHeight - inputRect.bottom
|
||||
const spaceAbove = inputRect.top
|
||||
const shouldOpenAbove =
|
||||
spaceBelow < MINIMUM_DROPDOWN_HEIGHT_PX && spaceAbove > spaceBelow
|
||||
const availableHeight =
|
||||
(shouldOpenAbove ? spaceAbove : spaceBelow) - DROPDOWN_MARGIN_PX * 2
|
||||
const maxHeight = Math.min(
|
||||
MAXIMUM_DROPDOWN_HEIGHT_PX,
|
||||
Math.max(MINIMUM_DROPDOWN_HEIGHT_PX, availableHeight)
|
||||
)
|
||||
|
||||
this.dropdown.style.left = `${inputRect.left}px`
|
||||
this.dropdown.style.width = `${inputRect.width}px`
|
||||
this.dropdown.style.maxHeight = `${maxHeight}px`
|
||||
|
||||
if (shouldOpenAbove) {
|
||||
this.dropdown.style.top = ''
|
||||
this.dropdown.style.bottom = `${
|
||||
window.innerHeight - inputRect.top + DROPDOWN_MARGIN_PX
|
||||
}px`
|
||||
} else {
|
||||
this.dropdown.style.top = `${inputRect.bottom + DROPDOWN_MARGIN_PX}px`
|
||||
this.dropdown.style.bottom = ''
|
||||
}
|
||||
}
|
||||
|
||||
moveSelection(direction) {
|
||||
if (this.entries.length === 0) {
|
||||
return
|
||||
}
|
||||
|
||||
this.selectedEntryIndex =
|
||||
(this.selectedEntryIndex + direction + this.entries.length) %
|
||||
this.entries.length
|
||||
this.shouldScrollSelectedEntry = true
|
||||
this.render()
|
||||
}
|
||||
|
||||
scrollSelectedEntryIntoView() {
|
||||
const selectedEntryElement = this.dropdown.querySelector(
|
||||
'.file-system-autocomplete__item--selected'
|
||||
)
|
||||
|
||||
if (!selectedEntryElement) {
|
||||
return
|
||||
}
|
||||
|
||||
selectedEntryElement.scrollIntoView({
|
||||
block: 'nearest'
|
||||
})
|
||||
}
|
||||
|
||||
applyEntry(entry) {
|
||||
if (!this.input || !this.token) {
|
||||
return
|
||||
}
|
||||
|
||||
const completedValue = entry.absolutePath || entry.value
|
||||
const nextCharacter = this.input.value.charAt(this.token.end)
|
||||
const shouldAddTrailingWhitespace =
|
||||
nextCharacter === '' || !isWhitespace(nextCharacter)
|
||||
const insertedValue = `${completedValue}${
|
||||
shouldAddTrailingWhitespace ? ' ' : ''
|
||||
}`
|
||||
const nextValue = `${this.input.value.slice(0, this.token.start)}${
|
||||
insertedValue
|
||||
}${this.input.value.slice(this.token.end)}`
|
||||
const nextCursorPosition = this.token.start + insertedValue.length
|
||||
|
||||
this.input.value = nextValue
|
||||
this.input.setSelectionRange(nextCursorPosition, nextCursorPosition)
|
||||
this.input.dispatchEvent(new Event('input', { bubbles: true }))
|
||||
|
||||
if (this.onValueChange) {
|
||||
this.onValueChange(nextValue)
|
||||
window.requestAnimationFrame(() => {
|
||||
this.input?.setSelectionRange(nextCursorPosition, nextCursorPosition)
|
||||
})
|
||||
}
|
||||
|
||||
this.close()
|
||||
}
|
||||
|
||||
close() {
|
||||
this.isOpen = false
|
||||
this.entries = []
|
||||
this.selectedEntryIndex = -1
|
||||
this.token = null
|
||||
this.dropdown.classList.add('file-system-autocomplete--hidden')
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,252 @@
|
||||
import { useEffect, useState, useRef } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import {
|
||||
WidgetWrapper,
|
||||
Text,
|
||||
Icon,
|
||||
Flexbox,
|
||||
List,
|
||||
ListHeader,
|
||||
ListItem,
|
||||
Loader
|
||||
} from '@aurora'
|
||||
|
||||
const container = document.querySelector('#init')
|
||||
const root = createRoot(container)
|
||||
const LLAMA_SERVER_BOOT_STATUS = 'llamaServerBoot'
|
||||
const INIT_ERROR_STATUS = 'error'
|
||||
const INIT_ERROR_DISMISS_SECONDS = 10
|
||||
const INIT_ERROR_DISMISS_INTERVAL_MS = 1_000
|
||||
|
||||
function Item({ children, status }) {
|
||||
if (status === 'error') {
|
||||
return <ErrorListItem>{children}</ErrorListItem>
|
||||
}
|
||||
if (status === 'warning') {
|
||||
return <WarningListItem>{children}</WarningListItem>
|
||||
}
|
||||
if (status === 'success') {
|
||||
return <SuccessListItem>{children}</SuccessListItem>
|
||||
}
|
||||
if (status === 'loading') {
|
||||
return <LoadingListItem>{children}</LoadingListItem>
|
||||
}
|
||||
|
||||
return <ListItem>{children}</ListItem>
|
||||
}
|
||||
|
||||
function LoadingListItem({ children }) {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Loader size="sm" />
|
||||
<Text>{children}</Text>
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
function ErrorListItem({ children }) {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Icon
|
||||
iconName="close"
|
||||
size="sm"
|
||||
type="fill"
|
||||
bgShape="circle"
|
||||
color="red"
|
||||
bgColor="transparent-red"
|
||||
/>
|
||||
<Text>{children}</Text>
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
function WarningListItem({ children }) {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Icon
|
||||
iconName="alert"
|
||||
size="sm"
|
||||
type="fill"
|
||||
bgShape="circle"
|
||||
color="yellow"
|
||||
bgColor="transparent-yellow"
|
||||
/>
|
||||
<Text>{children}</Text>
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
function SuccessListItem({ children }) {
|
||||
return (
|
||||
<ListItem>
|
||||
<Flexbox flexDirection="row" alignItems="center" gap="sm">
|
||||
<Icon
|
||||
iconName="check"
|
||||
size="sm"
|
||||
type="fill"
|
||||
bgShape="circle"
|
||||
color="green"
|
||||
bgColor="transparent-green"
|
||||
/>
|
||||
<Text>{children}</Text>
|
||||
</Flexbox>
|
||||
</ListItem>
|
||||
)
|
||||
}
|
||||
|
||||
function Init() {
|
||||
const parentRef = useRef(null)
|
||||
const [config, setConfig] = useState(() => ({ ...window.leonConfigInfo }))
|
||||
const usesLlamaCPP =
|
||||
config.llm?.workflowProvider === 'llamacpp' ||
|
||||
config.llm?.agentProvider === 'llamacpp'
|
||||
const [initErrorCountdown, setInitErrorCountdown] = useState(null)
|
||||
const [areInitErrorsDismissed, setAreInitErrorsDismissed] = useState(false)
|
||||
const [statusMap, setStatusMap] = useState({
|
||||
clientCoreServerHandshake: 'loading',
|
||||
tcpServerBoot:
|
||||
window.leonConfigInfo?.tcpServer?.enabled === false ? 'success' : 'loading',
|
||||
[LLAMA_SERVER_BOOT_STATUS]:
|
||||
window.leonConfigInfo?.llm?.workflowProvider === 'llamacpp' ||
|
||||
window.leonConfigInfo?.llm?.agentProvider === 'llamacpp'
|
||||
? 'loading'
|
||||
: 'success'
|
||||
})
|
||||
const hasInitError = Object.values(statusMap).some(
|
||||
(status) => status === INIT_ERROR_STATUS
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
setTimeout(() => {
|
||||
if (parentRef.current) {
|
||||
parentRef.current.classList.remove('not-initialized')
|
||||
}
|
||||
}, 250)
|
||||
|
||||
function handleStatusChange(event) {
|
||||
const { statusName, statusType } = event.detail
|
||||
|
||||
if (statusType === INIT_ERROR_STATUS) {
|
||||
setAreInitErrorsDismissed(false)
|
||||
}
|
||||
|
||||
setStatusMap((prev) => ({ ...prev, [statusName]: statusType }))
|
||||
}
|
||||
|
||||
window.leonInitStatusEvent.addEventListener(
|
||||
'initStatusChange',
|
||||
handleStatusChange
|
||||
)
|
||||
return () =>
|
||||
window.leonInitStatusEvent.removeEventListener(
|
||||
'initStatusChange',
|
||||
handleStatusChange
|
||||
)
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (!hasInitError || areInitErrorsDismissed) {
|
||||
setInitErrorCountdown(null)
|
||||
return
|
||||
}
|
||||
|
||||
let secondsLeft = INIT_ERROR_DISMISS_SECONDS
|
||||
setInitErrorCountdown(secondsLeft)
|
||||
|
||||
const interval = setInterval(() => {
|
||||
secondsLeft -= 1
|
||||
setInitErrorCountdown(secondsLeft)
|
||||
|
||||
if (secondsLeft <= 0) {
|
||||
clearInterval(interval)
|
||||
setAreInitErrorsDismissed(true)
|
||||
}
|
||||
}, INIT_ERROR_DISMISS_INTERVAL_MS)
|
||||
|
||||
return () => clearInterval(interval)
|
||||
}, [hasInitError, areInitErrorsDismissed])
|
||||
|
||||
const statuses = []
|
||||
for (let key of Object.keys(statusMap)) {
|
||||
if (key === 'tcpServerBoot' && config.tcpServer?.enabled === false) {
|
||||
statuses.push('success')
|
||||
} else if (statusMap[key] === INIT_ERROR_STATUS && areInitErrorsDismissed) {
|
||||
statuses.push('success')
|
||||
} else if (
|
||||
key === LLAMA_SERVER_BOOT_STATUS &&
|
||||
!usesLlamaCPP
|
||||
) {
|
||||
statuses.push('success')
|
||||
} else {
|
||||
statuses.push(statusMap[key])
|
||||
}
|
||||
}
|
||||
|
||||
const areAllStatusesSuccess = statuses.every((status) => status === 'success')
|
||||
const getInitMessage = (status, defaultMessage) => {
|
||||
if (status === INIT_ERROR_STATUS && initErrorCountdown !== null) {
|
||||
return `An error occurred during the initialization. This message will disappear in ${initErrorCountdown} seconds`
|
||||
}
|
||||
|
||||
return defaultMessage
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (window.leonConfigInfo) {
|
||||
setConfig({ ...window.leonConfigInfo })
|
||||
}
|
||||
}, [window.leonConfigInfo])
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
position: 'fixed',
|
||||
width: '100vw',
|
||||
height: '100vh',
|
||||
zIndex: 9999,
|
||||
backgroundColor: 'var(--black-color)'
|
||||
}}
|
||||
ref={parentRef}
|
||||
className={areAllStatusesSuccess ? 'initialized' : 'not-initialized'}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: '33%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)'
|
||||
}}
|
||||
>
|
||||
<WidgetWrapper noPadding>
|
||||
<List>
|
||||
<ListHeader>Leon is getting ready...</ListHeader>
|
||||
<Item status={statusMap.clientCoreServerHandshake}>
|
||||
{getInitMessage(
|
||||
statusMap.clientCoreServerHandshake,
|
||||
'Client and core server handshaked'
|
||||
)}
|
||||
</Item>
|
||||
{config.tcpServer?.enabled !== false && (
|
||||
<Item status={statusMap.tcpServerBoot}>
|
||||
{getInitMessage(statusMap.tcpServerBoot, 'TCP server booted')}
|
||||
</Item>
|
||||
)}
|
||||
{usesLlamaCPP && (
|
||||
<Item status={statusMap[LLAMA_SERVER_BOOT_STATUS]}>
|
||||
{getInitMessage(
|
||||
statusMap[LLAMA_SERVER_BOOT_STATUS],
|
||||
'llama-server booted'
|
||||
)}
|
||||
</Item>
|
||||
)}
|
||||
</List>
|
||||
</WidgetWrapper>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
root.render(<Init />)
|
||||
@@ -0,0 +1,44 @@
|
||||
const listener = {}
|
||||
|
||||
listener.listening = (
|
||||
stream,
|
||||
minDecibels,
|
||||
maxBlankTime,
|
||||
cbOnStart,
|
||||
cbOnEnd
|
||||
) => {
|
||||
const ctx = new AudioContext()
|
||||
const analyser = ctx.createAnalyser()
|
||||
const streamNode = ctx.createMediaStreamSource(stream)
|
||||
streamNode.connect(analyser)
|
||||
analyser.minDecibels = minDecibels
|
||||
|
||||
const data = new Uint8Array(analyser.frequencyBinCount)
|
||||
let silenceStart = performance.now()
|
||||
let triggered = false
|
||||
|
||||
const loop = (time) => {
|
||||
requestAnimationFrame(loop)
|
||||
|
||||
analyser.getByteFrequencyData(data)
|
||||
|
||||
if (data.some((v) => v)) {
|
||||
if (triggered) {
|
||||
triggered = false
|
||||
|
||||
cbOnStart()
|
||||
}
|
||||
silenceStart = time
|
||||
}
|
||||
|
||||
if (!triggered && time - silenceStart > maxBlankTime) {
|
||||
cbOnEnd()
|
||||
|
||||
triggered = true
|
||||
}
|
||||
}
|
||||
|
||||
loop()
|
||||
}
|
||||
|
||||
export default listener
|
||||
@@ -0,0 +1,213 @@
|
||||
import axios from 'axios'
|
||||
import '@aurora/style.css'
|
||||
|
||||
window.leonInitStatusEvent = new EventTarget()
|
||||
|
||||
import './init'
|
||||
import Client from './client'
|
||||
import { BuiltInCommands } from './built-in-commands'
|
||||
import FileSystemAutocomplete from './file-system-autocomplete'
|
||||
import SessionsPanel from './sessions'
|
||||
// import Recorder from './recorder'
|
||||
// import listener from './listener'
|
||||
import { onkeydownstartrecording, onkeydowninput } from './onkeydown'
|
||||
|
||||
const config = {
|
||||
app: 'webapp',
|
||||
server_host: import.meta.env.VITE_LEON_HOST,
|
||||
server_port: import.meta.env.VITE_LEON_PORT,
|
||||
min_decibels: -40, // Noise detection sensitivity
|
||||
max_blank_time: 1_000 // Maximum time to consider a blank (ms)
|
||||
}
|
||||
const serverUrl =
|
||||
import.meta.env.VITE_LEON_NODE_ENV === 'production'
|
||||
? ''
|
||||
: `${config.server_host}:${config.server_port}`
|
||||
|
||||
document.addEventListener('DOMContentLoaded', async () => {
|
||||
try {
|
||||
const [response, sessionsResponse] = await Promise.all([
|
||||
axios.get(`${serverUrl}/api/v1/info`),
|
||||
axios.get(`${serverUrl}/api/v1/sessions`)
|
||||
])
|
||||
const input = document.querySelector('#utterance')
|
||||
const mic = document.querySelector('#mic-button')
|
||||
const v = document.querySelector('#version small')
|
||||
const infoButton = document.querySelector('#info')
|
||||
const client = new Client(config.app, serverUrl, input, {
|
||||
activeSessionId: sessionsResponse.data.active_session_id
|
||||
})
|
||||
const sessionsPanel = new SessionsPanel({
|
||||
serverUrl,
|
||||
socket: client.socket,
|
||||
activeSessionId: sessionsResponse.data.active_session_id,
|
||||
initialPayload: sessionsResponse.data,
|
||||
onSelect: (sessionId) => client.setActiveSession(sessionId)
|
||||
})
|
||||
const fileSystemAutocomplete = new FileSystemAutocomplete({
|
||||
serverUrl,
|
||||
input
|
||||
})
|
||||
const builtInCommands = new BuiltInCommands({
|
||||
serverUrl,
|
||||
input,
|
||||
getActiveSessionId: () => sessionsPanel.getActiveSessionId(),
|
||||
onCommandExecuted: (commandInput) => {
|
||||
if (commandInput.trim().startsWith('/session')) {
|
||||
void sessionsPanel.refresh()
|
||||
}
|
||||
},
|
||||
onSubmitToChat: (clientAction) => {
|
||||
return client.sendUtterance(clientAction.utterance, {
|
||||
commandContext: {
|
||||
forcedRoutingMode: clientAction.command_context?.forced_routing_mode,
|
||||
forcedSkillName: clientAction.command_context?.forced_skill_name,
|
||||
forcedToolName: clientAction.command_context?.forced_tool_name
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
// let rec = {}
|
||||
// let chunks = []
|
||||
|
||||
window.leonConfigInfo = response.data
|
||||
const infoKeys = [
|
||||
'timeZone',
|
||||
'telemetry',
|
||||
'gpu',
|
||||
'graphicsComputeAPI',
|
||||
'totalVRAM',
|
||||
'freeVRAM',
|
||||
'usedVRAM',
|
||||
'llm',
|
||||
'asr',
|
||||
'tts',
|
||||
'mood',
|
||||
'version'
|
||||
]
|
||||
const infoToDisplay = {}
|
||||
infoKeys.forEach((key) => {
|
||||
infoToDisplay[key] = window.leonConfigInfo[key]
|
||||
})
|
||||
|
||||
v.textContent += window.leonConfigInfo.version
|
||||
|
||||
client.updateMood(window.leonConfigInfo.mood)
|
||||
client.setSessionPanel(sessionsPanel)
|
||||
sessionsPanel.init()
|
||||
client.init()
|
||||
fileSystemAutocomplete.attach(input)
|
||||
builtInCommands.init()
|
||||
|
||||
infoButton.addEventListener('click', () => {
|
||||
alert(JSON.stringify(infoToDisplay, null, 2))
|
||||
})
|
||||
|
||||
/*if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
|
||||
navigator.mediaDevices
|
||||
.getUserMedia({ audio: true })
|
||||
.then((stream) => {
|
||||
if (MediaRecorder) {
|
||||
rec = new Recorder(stream, mic, window.leonConfigInfo)
|
||||
client.recorder = rec
|
||||
|
||||
rec.ondataavailable((e) => {
|
||||
chunks.push(e.data)
|
||||
})
|
||||
|
||||
rec.onstart(() => {
|
||||
/!* *!/
|
||||
})
|
||||
|
||||
rec.onstop(() => {
|
||||
const blob = new Blob(chunks)
|
||||
chunks = []
|
||||
rec.enabled = false
|
||||
|
||||
// Ensure there are some data
|
||||
if (blob.size >= 1_000) {
|
||||
client.socket.emit('recognize', blob)
|
||||
}
|
||||
})
|
||||
|
||||
listener.listening(
|
||||
stream,
|
||||
config.min_decibels,
|
||||
config.max_blank_time,
|
||||
() => {
|
||||
// Noise detected
|
||||
rec.noiseDetected = true
|
||||
},
|
||||
() => {
|
||||
// Noise ended
|
||||
|
||||
rec.noiseDetected = false
|
||||
if (rec.enabled && !rec.hotwordTriggered) {
|
||||
rec.stop()
|
||||
rec.enabled = false
|
||||
rec.hotwordTriggered = false
|
||||
rec.countSilenceAfterTalk = 0
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
client.socket.on('enable-record', () => {
|
||||
rec.hotwordTriggered = true
|
||||
rec.start()
|
||||
setTimeout(() => {
|
||||
rec.hotwordTriggered = false
|
||||
}, config.max_blank_time)
|
||||
rec.enabled = true
|
||||
})
|
||||
} else {
|
||||
console.error('MediaRecorder is not supported on your browser.')
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(
|
||||
'MediaDevices.getUserMedia() threw the following error:',
|
||||
err
|
||||
)
|
||||
})
|
||||
} else {
|
||||
console.error(
|
||||
'MediaDevices.getUserMedia() is not supported on your browser.'
|
||||
)
|
||||
}*/
|
||||
|
||||
document.addEventListener('keydown', (e) => {
|
||||
onkeydownstartrecording(e, () => {
|
||||
client.asrStartRecording()
|
||||
/*if (rec.enabled === false) {
|
||||
input.value = ''
|
||||
rec.start()
|
||||
rec.enabled = true
|
||||
} else {
|
||||
rec.stop()
|
||||
rec.enabled = false
|
||||
}*/
|
||||
})
|
||||
})
|
||||
|
||||
input.addEventListener('keydown', (e) => {
|
||||
onkeydowninput(e, client)
|
||||
})
|
||||
|
||||
mic.addEventListener('click', (e) => {
|
||||
e.preventDefault()
|
||||
|
||||
client.asrStartRecording()
|
||||
|
||||
/*if (rec.enabled === false) {
|
||||
rec.start()
|
||||
rec.enabled = true
|
||||
} else {
|
||||
rec.stop()
|
||||
rec.enabled = false
|
||||
}*/
|
||||
})
|
||||
} catch (e) {
|
||||
alert(`Error: ${e.message}; ${JSON.stringify(e.response?.data)}`)
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,38 @@
|
||||
let index = -1
|
||||
let parsedHistory = null
|
||||
|
||||
const onkeydowninput = (e, client) => {
|
||||
const key = e.which || e.keyCode
|
||||
|
||||
if (localStorage.getItem('history') !== null && (key === 38 || key === 40)) {
|
||||
parsedHistory = JSON.parse(localStorage.getItem('history')).reverse()
|
||||
}
|
||||
|
||||
if (key === 13 && !e.shiftKey) {
|
||||
if (client.send('utterance')) {
|
||||
parsedHistory = JSON.parse(localStorage.getItem('history')).reverse()
|
||||
index = -1
|
||||
}
|
||||
} else if (localStorage.getItem('history') !== null) {
|
||||
if (e.shiftKey) {
|
||||
if (key === 38 && index < parsedHistory.length - 1) {
|
||||
index += 1
|
||||
client.input = parsedHistory[index]
|
||||
} else if (key === 40 && index - 1 >= 0) {
|
||||
index -= 1
|
||||
client.input = parsedHistory[index]
|
||||
} else if (key === 40 && index - 1 < 0) {
|
||||
client.input = ''
|
||||
index = -1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const onkeydownstartrecording = (e, cb) => {
|
||||
if ((e.metaKey || e.altKey) && e.key === 'c') {
|
||||
cb()
|
||||
}
|
||||
}
|
||||
|
||||
export { onkeydowninput, onkeydownstartrecording }
|
||||
@@ -0,0 +1,63 @@
|
||||
import on from '../sounds/on.mp3'
|
||||
import off from '../sounds/off.mp3'
|
||||
|
||||
export default class Recorder {
|
||||
constructor(stream, el, info) {
|
||||
this.recorder = new MediaRecorder(stream, { audioBitsPerSecond: 16000 })
|
||||
this.el = el
|
||||
this.audioOn = new Audio(on)
|
||||
this.audioOff = new Audio(off)
|
||||
this.playSound = true
|
||||
this.info = info
|
||||
this.enabled = false
|
||||
this.hotwordTriggered = false
|
||||
this.noiseDetected = false
|
||||
this.countSilenceAfterTalk = 0
|
||||
}
|
||||
|
||||
start(playSound = true) {
|
||||
if (this.info.asr.enabled === false) {
|
||||
console.warn('ASR disabled')
|
||||
} else {
|
||||
this.playSound = playSound
|
||||
this.recorder.start(playSound)
|
||||
}
|
||||
}
|
||||
|
||||
stop(playSound = true) {
|
||||
if (this.info.asr.enabled === false) {
|
||||
console.warn('ASR disabled')
|
||||
} else {
|
||||
this.playSound = playSound
|
||||
this.recorder.stop(playSound)
|
||||
}
|
||||
}
|
||||
|
||||
onstart(cb) {
|
||||
this.recorder.onstart = (e) => {
|
||||
if (this.playSound) {
|
||||
this.audioOn.play()
|
||||
}
|
||||
this.el.classList.add('enabled')
|
||||
|
||||
cb(e)
|
||||
}
|
||||
}
|
||||
|
||||
onstop(cb) {
|
||||
this.recorder.onstop = (e) => {
|
||||
if (this.playSound) {
|
||||
this.audioOff.play()
|
||||
}
|
||||
this.el.classList.remove('enabled')
|
||||
|
||||
cb(e)
|
||||
}
|
||||
}
|
||||
|
||||
ondataavailable(cb) {
|
||||
this.recorder.ondataavailable = (e) => {
|
||||
cb(e)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
import { createElement } from 'react'
|
||||
|
||||
import * as auroraComponents from '@aurora'
|
||||
|
||||
import * as customAuroraComponents from '../custom-aurora-components'
|
||||
|
||||
export default function renderAuroraComponent(
|
||||
socket,
|
||||
component,
|
||||
supportedEvents
|
||||
) {
|
||||
if (component) {
|
||||
// `import/namespace` cannot statically validate dynamic component lookups.
|
||||
// eslint-disable-next-line import/namespace
|
||||
let reactComponent = auroraComponents[component.component]
|
||||
/**
|
||||
* Find custom component if a former component is not found
|
||||
*/
|
||||
if (!reactComponent) {
|
||||
// eslint-disable-next-line import/namespace
|
||||
reactComponent = customAuroraComponents[component.component]
|
||||
}
|
||||
|
||||
if (!reactComponent) {
|
||||
console.error(`Component ${component.component} not found`)
|
||||
return null
|
||||
}
|
||||
|
||||
// Check if the browsed component has a supported event and bind it
|
||||
if (reactComponent && Array.isArray(component.events)) {
|
||||
component.events.forEach((event) => {
|
||||
if (supportedEvents.includes(event.type)) {
|
||||
component.props[event.type] = (data) => {
|
||||
const { method } = event
|
||||
|
||||
socket.emit('widget-event', { method, data })
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// When children is a component, then wrap it in an array to render properly
|
||||
const isComponent = !!component.props?.children?.component
|
||||
if (isComponent) {
|
||||
component.props.children = [component.props.children]
|
||||
}
|
||||
|
||||
if (component.props?.children && Array.isArray(component.props.children)) {
|
||||
component.props.children = component.props.children.map((child) => {
|
||||
return renderAuroraComponent(socket, child, supportedEvents)
|
||||
})
|
||||
}
|
||||
|
||||
return createElement(reactComponent, component.props)
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,288 @@
|
||||
import axios from 'axios'
|
||||
|
||||
const DAY_MS = 24 * 60 * 60 * 1_000
|
||||
const GROUP_DATE_FORMATTER = new Intl.DateTimeFormat(undefined, {
|
||||
month: 'long',
|
||||
day: 'numeric',
|
||||
year: 'numeric'
|
||||
})
|
||||
|
||||
function createElement(tagName, className, textContent = '') {
|
||||
const element = document.createElement(tagName)
|
||||
|
||||
if (className) {
|
||||
element.className = className
|
||||
}
|
||||
|
||||
if (textContent) {
|
||||
element.textContent = textContent
|
||||
}
|
||||
|
||||
return element
|
||||
}
|
||||
|
||||
function getDayKey(timestamp) {
|
||||
const date = new Date(timestamp)
|
||||
|
||||
return new Date(
|
||||
date.getFullYear(),
|
||||
date.getMonth(),
|
||||
date.getDate()
|
||||
).getTime()
|
||||
}
|
||||
|
||||
function getGroupLabel(timestamp) {
|
||||
const now = Date.now()
|
||||
const todayKey = getDayKey(now)
|
||||
const yesterdayKey = todayKey - DAY_MS
|
||||
const itemKey = getDayKey(timestamp)
|
||||
|
||||
if (itemKey === todayKey) {
|
||||
return 'Today'
|
||||
}
|
||||
|
||||
if (itemKey === yesterdayKey) {
|
||||
return 'Yesterday'
|
||||
}
|
||||
|
||||
return GROUP_DATE_FORMATTER.format(new Date(timestamp))
|
||||
}
|
||||
|
||||
export default class SessionsPanel {
|
||||
constructor({
|
||||
serverUrl,
|
||||
socket,
|
||||
activeSessionId,
|
||||
initialPayload,
|
||||
onSelect
|
||||
}) {
|
||||
this.serverUrl = serverUrl
|
||||
this.socket = socket
|
||||
this.activeSessionId = activeSessionId
|
||||
this.sessions = initialPayload?.sessions || []
|
||||
this.supportedProviders = initialPayload?.supported_providers || []
|
||||
this.currentModelTarget = initialPayload?.current_model_target || ''
|
||||
this.onSelect = onSelect
|
||||
this.container = document.querySelector('#sessions-panel')
|
||||
this.list = document.querySelector('#sessions-list')
|
||||
this.newButton = document.querySelector('#new-session')
|
||||
}
|
||||
|
||||
init() {
|
||||
this.newButton.addEventListener('click', () => {
|
||||
void this.createSession()
|
||||
})
|
||||
this.list.addEventListener('click', (event) => {
|
||||
void this.handleClick(event)
|
||||
})
|
||||
this.render()
|
||||
}
|
||||
|
||||
getActiveSessionId() {
|
||||
return this.activeSessionId
|
||||
}
|
||||
|
||||
async refresh() {
|
||||
const previousActiveSessionId = this.activeSessionId
|
||||
const response = await axios.get(`${this.serverUrl}/api/v1/sessions`)
|
||||
|
||||
this.applyPayload(response.data)
|
||||
|
||||
if (
|
||||
response.data.active_session_id &&
|
||||
response.data.active_session_id !== previousActiveSessionId
|
||||
) {
|
||||
await this.onSelect?.(response.data.active_session_id)
|
||||
}
|
||||
}
|
||||
|
||||
async createSession() {
|
||||
const response = await axios.post(`${this.serverUrl}/api/v1/sessions`)
|
||||
|
||||
this.applyPayload(response.data)
|
||||
await this.selectSession(response.data.session.id)
|
||||
}
|
||||
|
||||
async selectSession(sessionId) {
|
||||
this.activeSessionId = sessionId
|
||||
this.socket.emit('session-change', sessionId)
|
||||
await this.onSelect?.(sessionId)
|
||||
await axios.patch(`${this.serverUrl}/api/v1/sessions/${sessionId}`, {
|
||||
is_active: true
|
||||
})
|
||||
await this.refresh()
|
||||
}
|
||||
|
||||
async updateSession(sessionId, payload) {
|
||||
const response = await axios.patch(
|
||||
`${this.serverUrl}/api/v1/sessions/${sessionId}`,
|
||||
payload
|
||||
)
|
||||
|
||||
this.applyPayload(response.data)
|
||||
}
|
||||
|
||||
async deleteSession(sessionId) {
|
||||
const wasActiveSession = this.activeSessionId === sessionId
|
||||
const response = await axios.delete(
|
||||
`${this.serverUrl}/api/v1/sessions/${sessionId}`
|
||||
)
|
||||
|
||||
this.applyPayload(response.data)
|
||||
|
||||
if (wasActiveSession) {
|
||||
await this.selectSession(response.data.active_session_id)
|
||||
}
|
||||
}
|
||||
|
||||
async handleClick(event) {
|
||||
const button = event.target.closest('button')
|
||||
const item = event.target.closest('.session-item')
|
||||
|
||||
if (!item) {
|
||||
return
|
||||
}
|
||||
|
||||
const sessionId = item.getAttribute('data-session-id')
|
||||
|
||||
if (!button) {
|
||||
await this.selectSession(sessionId)
|
||||
return
|
||||
}
|
||||
|
||||
const action = button.getAttribute('data-action')
|
||||
|
||||
if (action === 'rename') {
|
||||
const currentTitle = item.getAttribute('data-session-title') || ''
|
||||
const title = window.prompt('Session title', currentTitle)
|
||||
|
||||
if (title && title.trim()) {
|
||||
await this.updateSession(sessionId, { title: title.trim() })
|
||||
}
|
||||
} else if (action === 'pin') {
|
||||
await this.updateSession(sessionId, {
|
||||
is_pinned: button.getAttribute('aria-pressed') !== 'true'
|
||||
})
|
||||
} else if (action === 'delete') {
|
||||
await this.deleteSession(sessionId)
|
||||
} else if (action === 'model') {
|
||||
await this.updateSessionModel(sessionId)
|
||||
}
|
||||
}
|
||||
|
||||
async updateSessionModel(sessionId) {
|
||||
const provider = window.prompt(
|
||||
`Provider (${this.supportedProviders.join(', ')})`
|
||||
)
|
||||
|
||||
if (!provider) {
|
||||
return
|
||||
}
|
||||
|
||||
const model = window.prompt('Model')
|
||||
|
||||
if (!model) {
|
||||
return
|
||||
}
|
||||
|
||||
await this.updateSession(sessionId, {
|
||||
provider: provider.trim(),
|
||||
model: model.trim()
|
||||
})
|
||||
}
|
||||
|
||||
applyPayload(payload) {
|
||||
this.sessions = payload.sessions || []
|
||||
this.supportedProviders = payload.supported_providers || []
|
||||
this.currentModelTarget = payload.current_model_target || ''
|
||||
this.activeSessionId = payload.active_session_id || this.activeSessionId
|
||||
this.render()
|
||||
}
|
||||
|
||||
render() {
|
||||
this.list.innerHTML = ''
|
||||
|
||||
const pinnedSessions = this.sessions.filter((session) => session.isPinned)
|
||||
const unpinnedSessions = this.sessions.filter((session) => !session.isPinned)
|
||||
|
||||
if (pinnedSessions.length > 0) {
|
||||
this.renderGroup('Pinned', pinnedSessions)
|
||||
}
|
||||
|
||||
const groupedSessions = new Map()
|
||||
|
||||
for (const session of unpinnedSessions) {
|
||||
const timestamp = session.lastMessageAt || session.updatedAt
|
||||
const groupLabel = getGroupLabel(timestamp)
|
||||
const group = groupedSessions.get(groupLabel) || []
|
||||
|
||||
group.push(session)
|
||||
groupedSessions.set(groupLabel, group)
|
||||
}
|
||||
|
||||
for (const [label, sessions] of groupedSessions.entries()) {
|
||||
this.renderGroup(label, sessions)
|
||||
}
|
||||
}
|
||||
|
||||
renderGroup(label, sessions) {
|
||||
const group = createElement('section', 'session-group')
|
||||
const heading = createElement('h2', 'session-group-title', label)
|
||||
|
||||
group.appendChild(heading)
|
||||
|
||||
for (const session of sessions) {
|
||||
group.appendChild(this.createSessionItem(session))
|
||||
}
|
||||
|
||||
this.list.appendChild(group)
|
||||
}
|
||||
|
||||
createSessionItem(session) {
|
||||
const item = createElement('article', 'session-item')
|
||||
const title = createElement('div', 'session-title', session.title)
|
||||
const meta = createElement(
|
||||
'div',
|
||||
'session-meta',
|
||||
session.modelTarget || this.currentModelTarget || 'Default model'
|
||||
)
|
||||
const actions = createElement('div', 'session-actions')
|
||||
|
||||
item.setAttribute('data-session-id', session.id)
|
||||
item.setAttribute('data-session-title', session.title)
|
||||
|
||||
if (session.id === this.activeSessionId) {
|
||||
item.classList.add('session-item--active')
|
||||
}
|
||||
|
||||
actions.appendChild(
|
||||
this.createActionButton(
|
||||
'pin',
|
||||
session.isPinned ? 'ri-pushpin-fill' : 'ri-pushpin-line',
|
||||
session.isPinned
|
||||
)
|
||||
)
|
||||
actions.appendChild(this.createActionButton('rename', 'ri-edit-line'))
|
||||
actions.appendChild(this.createActionButton('model', 'ri-brain-line'))
|
||||
actions.appendChild(this.createActionButton('delete', 'ri-delete-bin-line'))
|
||||
|
||||
item.appendChild(title)
|
||||
item.appendChild(meta)
|
||||
item.appendChild(actions)
|
||||
|
||||
return item
|
||||
}
|
||||
|
||||
createActionButton(action, iconClassName, isPressed = false) {
|
||||
const button = createElement('button', 'session-action')
|
||||
const icon = createElement('i', iconClassName)
|
||||
|
||||
button.type = 'button'
|
||||
button.setAttribute('data-action', action)
|
||||
button.setAttribute('aria-label', action)
|
||||
button.setAttribute('aria-pressed', String(isPressed))
|
||||
button.appendChild(icon)
|
||||
|
||||
return button
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
import { createElement } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
|
||||
import { WidgetWrapper, List, ListHeader, ListItem } from '@aurora'
|
||||
|
||||
export default function handleSuggestions(data, chatbot, client) {
|
||||
const container = document.createElement('div')
|
||||
container.className = 'bubble-container leon'
|
||||
|
||||
chatbot.feed.appendChild(container)
|
||||
|
||||
const root = createRoot(container)
|
||||
|
||||
root.render(
|
||||
createElement(WidgetWrapper, {
|
||||
noPadding: true,
|
||||
children: createElement(List, {
|
||||
children: [
|
||||
createElement(ListHeader, {
|
||||
children: 'Suggestions'
|
||||
}),
|
||||
...data.map((suggestionText) => {
|
||||
return createElement(ListItem, {
|
||||
children: suggestionText,
|
||||
name: 'suggestion',
|
||||
value: suggestionText,
|
||||
onClick: (suggestion) => {
|
||||
const parent = container.parentNode
|
||||
|
||||
if (parent) {
|
||||
parent.removeChild(container)
|
||||
}
|
||||
|
||||
client.input.value = suggestion.value
|
||||
client.send('utterance')
|
||||
}
|
||||
})
|
||||
})
|
||||
]
|
||||
})
|
||||
})
|
||||
)
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,74 @@
|
||||
const STATUS = {
|
||||
listening: 'Listening...',
|
||||
processing: 'Processing...',
|
||||
talking: 'Talking...',
|
||||
idle: 'Idle'
|
||||
}
|
||||
|
||||
export default class VoiceEnergy {
|
||||
constructor(client) {
|
||||
this.client = client
|
||||
this.voiceEnergyContainerElement = document.querySelector(
|
||||
'#voice-energy-container'
|
||||
)
|
||||
this.voiceOverlayElement = document.querySelector('#voice-overlay-bg')
|
||||
this.statusElement = document.querySelector('#voice-status')
|
||||
this._status = 'idle'
|
||||
}
|
||||
|
||||
get status() {
|
||||
return this._status
|
||||
}
|
||||
|
||||
set status(newStatus) {
|
||||
if (this._status !== newStatus) {
|
||||
this._status = newStatus
|
||||
|
||||
if (this.statusElement) {
|
||||
this.statusElement.textContent = STATUS[newStatus]
|
||||
}
|
||||
|
||||
// Clean up speech text when listening
|
||||
if (newStatus === 'listening' && this.client.voiceSpeechElement) {
|
||||
this.client.voiceSpeechElement.textContent = ''
|
||||
}
|
||||
|
||||
if (this.voiceEnergyContainerElement) {
|
||||
this.voiceEnergyContainerElement.className = ''
|
||||
this.voiceEnergyContainerElement.classList.add(newStatus)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
init() {
|
||||
if (this.voiceEnergyContainerElement) {
|
||||
if (this.voiceOverlayElement) {
|
||||
this.voiceOverlayElement.addEventListener('click', (e) => {
|
||||
e.preventDefault()
|
||||
this.client.disableVoiceMode()
|
||||
})
|
||||
}
|
||||
|
||||
const particles = new Set()
|
||||
const particleColors = ['blue', 'pink']
|
||||
|
||||
for (let i = 0; i < 32; i += 1) {
|
||||
const particle = document.createElement('div')
|
||||
const randomColor = Math.floor(Math.random() * 2)
|
||||
let random = Math.floor(Math.random() * 32)
|
||||
|
||||
while (particles.has(random)) {
|
||||
random = Math.floor(Math.random() * 32)
|
||||
}
|
||||
|
||||
particles.add(random)
|
||||
particle.setAttribute('data-particle', String(random))
|
||||
particle.classList.add('voice-particle', particleColors[randomColor])
|
||||
particle.style.transform = `rotate(${
|
||||
i * 11.25
|
||||
}deg) translate(110px) rotate(-${i * 11.25}deg)`
|
||||
this.voiceEnergyContainerElement.appendChild(particle)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"extends": "../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"jsx": "react-jsx",
|
||||
"noEmit": true
|
||||
},
|
||||
"include": ["./src/**/*", "../aurora/src/**/*", "../aurora/global.d.ts"],
|
||||
"exclude": ["./dist", "../node_modules"]
|
||||
}
|
||||
@@ -0,0 +1,143 @@
|
||||
import dns from 'node:dns'
|
||||
import fs from 'node:fs'
|
||||
import { fileURLToPath } from 'node:url'
|
||||
|
||||
import dotenv from 'dotenv'
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import YAML from 'yaml'
|
||||
|
||||
import {
|
||||
PROFILE_CONFIG_PATH,
|
||||
PROFILE_DOT_ENV_PATH
|
||||
} from '../server/src/leon-roots.ts'
|
||||
|
||||
const APP_DEV_SERVER_PORT = 5_173
|
||||
const NODE_MODULES_PATH_SEGMENT = '/node_modules/'
|
||||
const REACT_VENDOR_PACKAGES = ['react', 'react-dom', 'scheduler']
|
||||
const REALTIME_VENDOR_PACKAGES = [
|
||||
'socket.io-client',
|
||||
'socket.io-parser',
|
||||
'engine.io-client',
|
||||
'engine.io-parser'
|
||||
]
|
||||
const UI_VENDOR_PACKAGE_PREFIXES = ['@ark-ui/', '@zag-js/', '@floating-ui/']
|
||||
|
||||
dotenv.config({ path: PROFILE_DOT_ENV_PATH })
|
||||
|
||||
dns.setDefaultResultOrder('verbatim')
|
||||
|
||||
function readAppLeonConfig() {
|
||||
if (!fs.existsSync(PROFILE_CONFIG_PATH)) {
|
||||
throw new Error(`Profile config file not found at "${PROFILE_CONFIG_PATH}".`)
|
||||
}
|
||||
|
||||
const config = YAML.parse(fs.readFileSync(PROFILE_CONFIG_PATH, 'utf8'))
|
||||
const server = config?.server
|
||||
|
||||
if (
|
||||
!server ||
|
||||
typeof server.host !== 'string' ||
|
||||
!Number.isInteger(server.port)
|
||||
) {
|
||||
throw new Error(
|
||||
`Profile config file "${PROFILE_CONFIG_PATH}" must define server.host and server.port.`
|
||||
)
|
||||
}
|
||||
|
||||
return {
|
||||
host: server.host,
|
||||
port: server.port
|
||||
}
|
||||
}
|
||||
|
||||
function normalizeModuleId(moduleId) {
|
||||
return moduleId.replaceAll('\\', '/')
|
||||
}
|
||||
|
||||
function isNodeModule(moduleId) {
|
||||
return normalizeModuleId(moduleId).includes(NODE_MODULES_PATH_SEGMENT)
|
||||
}
|
||||
|
||||
function includesVendorPackage(moduleId, packageName) {
|
||||
return normalizeModuleId(moduleId).includes(
|
||||
`${NODE_MODULES_PATH_SEGMENT}${packageName}/`
|
||||
)
|
||||
}
|
||||
|
||||
function includesVendorPackagePrefix(moduleId, packagePrefix) {
|
||||
return normalizeModuleId(moduleId).includes(
|
||||
`${NODE_MODULES_PATH_SEGMENT}${packagePrefix}`
|
||||
)
|
||||
}
|
||||
|
||||
// Map necessary Leon's env vars as Vite only expose VITE_*
|
||||
const leonConfig = readAppLeonConfig()
|
||||
process.env.VITE_LEON_NODE_ENV = process.env.LEON_NODE_ENV
|
||||
process.env.VITE_LEON_HOST = leonConfig.host
|
||||
process.env.VITE_LEON_PORT = String(leonConfig.port)
|
||||
|
||||
export default defineConfig({
|
||||
root: 'app/src',
|
||||
resolve: {
|
||||
alias: [
|
||||
{
|
||||
find: '@aurora/style.css',
|
||||
replacement: fileURLToPath(
|
||||
new URL('../aurora/style.css', import.meta.url)
|
||||
)
|
||||
},
|
||||
{
|
||||
find: '@aurora',
|
||||
replacement: fileURLToPath(
|
||||
new URL('../aurora/src/index.ts', import.meta.url)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
build: {
|
||||
outDir: '../dist',
|
||||
emptyOutDir: true,
|
||||
rolldownOptions: {
|
||||
output: {
|
||||
codeSplitting: {
|
||||
groups: [
|
||||
{
|
||||
name: 'react-vendor',
|
||||
test: (moduleId) =>
|
||||
REACT_VENDOR_PACKAGES.some((packageName) =>
|
||||
includesVendorPackage(moduleId, packageName)
|
||||
),
|
||||
priority: 30
|
||||
},
|
||||
{
|
||||
name: 'realtime-vendor',
|
||||
test: (moduleId) =>
|
||||
REALTIME_VENDOR_PACKAGES.some((packageName) =>
|
||||
includesVendorPackage(moduleId, packageName)
|
||||
),
|
||||
priority: 20
|
||||
},
|
||||
{
|
||||
name: 'ui-vendor',
|
||||
test: (moduleId) =>
|
||||
UI_VENDOR_PACKAGE_PREFIXES.some((packagePrefix) =>
|
||||
includesVendorPackagePrefix(moduleId, packagePrefix)
|
||||
),
|
||||
priority: 10
|
||||
},
|
||||
{
|
||||
name: 'vendor',
|
||||
test: isNodeModule,
|
||||
priority: 0
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
server: {
|
||||
port: APP_DEV_SERVER_PORT
|
||||
},
|
||||
plugins: [react()]
|
||||
})
|
||||
Vendored
+3
@@ -0,0 +1,3 @@
|
||||
declare module '*.css'
|
||||
declare module '*.scss'
|
||||
declare module '*.sass'
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,31 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Aurora</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/main.tsx"></script>
|
||||
</body>
|
||||
<style>
|
||||
body {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
margin: 32px 0;
|
||||
font-family: var(--a-font-family);
|
||||
}
|
||||
|
||||
#root {
|
||||
width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 24px 0;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
</html>
|
||||
@@ -0,0 +1,24 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
|
||||
import '@fontsource/source-sans-pro/200.css'
|
||||
import '@fontsource/source-sans-pro/300.css'
|
||||
import '@fontsource/source-sans-pro/400.css'
|
||||
import '@fontsource/source-sans-pro/600.css'
|
||||
import '@fontsource/source-sans-pro/700.css'
|
||||
import '@fontsource/source-sans-pro/900.css'
|
||||
import 'remixicon/fonts/remixicon.css'
|
||||
import '../src/styles/main.sass'
|
||||
import { App } from './App.tsx'
|
||||
|
||||
const rootElement = document.getElementById('root')
|
||||
|
||||
if (rootElement != null) {
|
||||
ReactDOM.createRoot(rootElement).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
)
|
||||
} else {
|
||||
console.error('Error: Root element not found!')
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
<svg width="800" height="192" viewBox="0 0 800 192" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M126.205 101.717C125.951 86.239 132.637 74.1902 146.246 65.5659C138.571 54.4049 127.251 48.1317 112.283 46.7293C106.959 46.2293 100.151 47.4878 91.8707 50.5366C82.9634 53.839 77.9488 55.4805 76.8366 55.4805C74.4854 55.4805 69.9707 54.0927 63.2805 51.2951C56.6049 48.5049 50.9098 47.1098 46.2073 47.1098C38.2902 47.239 30.9244 49.4268 24.122 53.6732C17.3171 57.9244 11.8756 63.7317 7.79512 71.0805C2.59268 80.2171 0 91.1268 0 103.807C0 115.222 1.91219 126.634 5.74634 138.056C9.33415 148.966 13.9195 158.541 19.4805 166.778C24.4244 174.263 28.7707 179.717 32.4707 183.146C37.7976 188.471 43.2341 191.012 48.8098 190.754C52.3951 190.622 57.0927 189.293 62.9098 186.749C68.3488 184.351 73.7976 183.144 79.2439 183.144C84.3146 183.144 89.5683 184.344 95.0195 186.749C101.078 189.293 106.032 190.559 109.866 190.559C115.559 190.31 120.876 187.834 125.832 183.146C127.556 181.617 129.446 179.527 131.485 176.863C133.839 173.761 136.1 170.589 138.263 167.351C140.066 164.559 141.769 161.704 143.368 158.79C145.084 155.653 146.602 152.412 147.915 149.085C148.527 147.69 149.083 146.266 149.583 144.807C150.076 143.349 150.571 141.863 151.066 140.339C146.488 138.315 142.341 135.449 138.632 131.768C130.476 123.663 126.329 113.639 126.205 101.717ZM260.783 135.634H259.883L222.193 49.5024H192.595V188.471H218.39V98.4683H219.588L251.085 169.937H269.176L300.573 98.4683H301.776V188.471H327.868V49.5024H298.473L260.783 135.634ZM102.815 31.322C109.376 23.0756 112.656 14.1976 112.656 4.68293V2.78293C112.656 2.14391 112.593 1.5122 112.471 0.878052C107.89 1.13171 103.037 2.59269 97.8976 5.25122C92.7659 7.91952 88.5293 11.2854 85.1829 15.3366C78.5049 23.3341 75.161 31.8902 75.161 41.0244V42.8268C75.161 43.4024 75.2244 44.0024 75.3463 44.6415C85.6195 45.6537 94.7756 41.2122 102.815 31.322ZM629.351 49.5024H658.344V188.473H629.351V49.5024ZM745.91 71.5927C763.105 71.5927 772.198 84.8293 772.198 99.0829H800V96.1293C800 69.2537 779.502 46.8585 745.707 46.8585C709.512 46.8585 687.92 70.6805 687.92 111.305V126.985C687.92 167.598 709.312 191.124 745.605 191.124C780.3 191.124 800 168.412 800 143.168V140.115H772.2C772.2 154.476 763.305 166.385 746.115 166.385C728.512 166.385 717.312 153.861 717.312 127.08V111.412C717.312 84.7244 728.615 71.5927 745.91 71.5927ZM438.756 137.259C438.756 155.895 427.859 166.173 411.863 166.173C395.766 166.173 384.871 155.993 384.871 137.259V49.5024H356.073V141.332C356.073 170.966 377.066 191.122 411.859 191.122C446.554 191.122 467.646 170.966 467.646 141.332V49.5024H438.756V137.259ZM563.571 107.534L542.878 102.856C530.683 100.302 524.283 94.9098 524.283 86.8634C524.283 76.1781 532.978 69.4561 546.983 69.4561C562.778 69.4561 570.676 78.5171 571.373 88.2927H598.368C598.068 63.7537 577.576 46.6512 547.078 46.6512C518.188 46.6512 495.39 61.8244 495.39 89.1073C495.39 112.727 511.39 123.715 530.585 127.9L551.078 132.68C564.876 135.837 571.873 140.422 571.873 149.883C571.873 160.683 563.273 168.015 547.18 168.015C529.883 168.015 520.783 158.849 519.988 148.563H492.19C492.598 168.215 505.593 191.122 545.785 191.122C579.576 191.122 600.476 174.324 600.476 147.029C600.466 121.78 583.568 111.905 563.571 107.534Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.7 KiB |
@@ -0,0 +1,64 @@
|
||||
<svg width="103" height="21" viewBox="0 0 103 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_22_189)">
|
||||
<path d="M20.4846 6.48553H16.075V9.05876H20.4846V6.48553Z" fill="#29AB70"/>
|
||||
<path d="M20.4846 10.0692H16.075V12.6424H20.4846V10.0692Z" fill="url(#paint0_linear_22_189)"/>
|
||||
<path d="M20.4846 13.6511H16.075V16.2243H20.4846V13.6511Z" fill="url(#paint1_linear_22_189)"/>
|
||||
<path d="M4.5 17.2348H0.0905304V19.808H4.5V17.2348Z" fill="url(#paint2_linear_22_189)"/>
|
||||
<path d="M9.82757 17.2348H5.41811V19.808H9.82757V17.2348Z" fill="url(#paint3_linear_22_189)"/>
|
||||
<path d="M15.1569 17.2348H10.7474V19.808H15.1569V17.2348Z" fill="url(#paint4_linear_22_189)"/>
|
||||
<path d="M20.4846 17.2348H16.075V19.808H20.4846V17.2348Z" fill="url(#paint5_linear_22_189)"/>
|
||||
<path d="M15.1569 13.6511H10.7474V16.2243H15.1569V13.6511Z" fill="url(#paint6_linear_22_189)"/>
|
||||
<path d="M9.82757 13.6511H5.41811V16.2243H9.82757V13.6511Z" fill="url(#paint7_linear_22_189)"/>
|
||||
<path d="M9.82757 10.0692H5.41811V12.6424H9.82757V10.0692Z" fill="url(#paint8_linear_22_189)"/>
|
||||
<path d="M59.5733 17.011C57.6607 17.011 56.0872 15.8585 56.0588 13.834H65.1157C65.2344 13.2988 65.294 12.7521 65.2933 12.2038C65.2933 8.54729 62.7911 6.21381 59.108 6.21381C55.1709 6.21381 52.4716 9.27894 52.4716 13.074C52.4716 17.2916 55.3964 20.1046 59.5289 20.1046C62.6508 20.1046 64.8156 18.5294 65.7444 15.942L62.6668 14.7397C62.2442 16.2528 61.2035 17.011 59.5733 17.011ZM59.0956 9.11024C60.6938 9.11024 61.7949 9.98218 61.7949 11.3318L61.7664 11.4437H56.0588C56.3962 9.98219 57.634 9.11024 59.0956 9.11024Z" fill="white"/>
|
||||
<path d="M77.7348 9.44758V6.49432H66.1224V9.58788H73.2081L65.8969 16.7304V19.8222H77.9319V16.5883H70.3952L77.7348 9.44758Z" fill="white"/>
|
||||
<path d="M99.4234 10.7973C99.4245 11.0212 99.4096 11.245 99.379 11.4668H102.79C102.873 11.0331 102.913 10.5924 102.909 10.1509C102.909 7.87246 101.476 6.21381 99.086 6.21381C97.5392 6.21381 96.4435 6.97387 95.8806 8.20987V6.49617H92.2827V19.8151H95.8806V11.2466C95.8806 9.89694 96.6122 9.13865 97.7363 9.13865C98.7486 9.13865 99.4234 9.81348 99.4234 10.7973Z" fill="white"/>
|
||||
<path d="M34.6291 8.49219C33.8122 7.11412 32.2939 6.21376 30.4115 6.21376C26.755 6.21376 24.0841 9.02673 24.0841 13.216C24.0841 17.3484 26.7283 20.1046 30.4949 20.1046C32.3791 20.1046 33.8975 19.2877 34.7694 17.9114V19.8222H38.227V0.14032H34.6291V8.49219ZM31.2248 17.0483C29.2287 17.0483 27.6731 15.5868 27.6731 13.2249C27.6731 10.8346 29.2199 9.31797 31.2248 9.31797C33.1641 9.31797 34.7677 10.8363 34.7677 13.2249C34.7677 15.5779 33.1641 17.0483 31.2248 17.0483Z" fill="white"/>
|
||||
<path d="M85.2076 17.011C83.295 17.011 81.7216 15.8585 81.6932 13.834H90.7501C90.8689 13.2988 90.9284 12.7521 90.9277 12.2038C90.9277 8.54729 88.4255 6.21381 84.7424 6.21381C80.8053 6.21381 78.106 9.27894 78.106 13.074C78.106 17.2916 81.0308 20.1046 85.1632 20.1046C88.2852 20.1046 90.45 18.5294 91.3788 15.942L88.2994 14.7397C87.8785 16.2528 86.8397 17.011 85.2076 17.011ZM84.7299 9.11024C86.3282 9.11024 87.4292 9.98218 87.4292 11.3318L87.4008 11.4437H81.6897C82.0306 9.98219 83.2666 9.11024 84.7299 9.11024Z" fill="white"/>
|
||||
<path d="M46.2843 17.011C44.3717 17.011 42.7983 15.8585 42.7699 13.834H51.8268C51.9434 13.2986 51.9999 12.7518 51.9955 12.2038C51.9955 8.54729 49.4933 6.21381 45.8101 6.21381C41.873 6.21381 39.1737 9.27894 39.1737 13.074C39.1737 17.2916 42.0986 20.1046 46.231 20.1046C49.353 20.1046 51.5178 18.5294 52.4465 15.942L49.3778 14.7397C48.9552 16.2528 47.9145 17.011 46.2843 17.011ZM45.8066 9.11024C47.4049 9.11024 48.5059 9.98218 48.5059 11.3318L48.4775 11.4437H42.7699C43.1073 9.98219 44.345 9.11024 45.8066 9.11024Z" fill="white"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_22_189" x1="18.5666" y1="12.9798" x2="17.993" y2="9.72996" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#2C8C9D"/>
|
||||
<stop offset="0.04" stop-color="#298E9A"/>
|
||||
<stop offset="0.39" stop-color="#129C83"/>
|
||||
<stop offset="0.72" stop-color="#05A475"/>
|
||||
<stop offset="1" stop-color="#00A770"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_22_189" x1="16.0093" y1="16.0946" x2="20.5503" y2="13.7807" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#2839BA"/>
|
||||
<stop offset="1" stop-color="#148CB3"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_22_189" x1="0.0905304" y1="18.5205" x2="4.5" y2="18.5205" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F6A500"/>
|
||||
<stop offset="1" stop-color="#F29100"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint3_linear_22_189" x1="5.41811" y1="18.5205" x2="9.82757" y2="18.5205" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F29100"/>
|
||||
<stop offset="1" stop-color="#D12F5F"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint4_linear_22_189" x1="10.7474" y1="18.5205" x2="15.1569" y2="18.5205" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#B4197C"/>
|
||||
<stop offset="1" stop-color="#472EAD"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint5_linear_22_189" x1="16.075" y1="18.5205" x2="20.4846" y2="18.5205" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#2839BA"/>
|
||||
<stop offset="1" stop-color="#3072B7"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint6_linear_22_189" x1="10.5734" y1="15.6329" x2="15.3291" y2="14.2424" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#B4197C"/>
|
||||
<stop offset="1" stop-color="#373AAC"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint7_linear_22_189" x1="5.26361" y1="14.079" x2="9.98385" y2="15.7963" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FFCB00"/>
|
||||
<stop offset="1" stop-color="#D12F5F"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint8_linear_22_189" x1="5.79104" y1="9.66424" x2="9.45464" y2="13.0455" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FFCF00"/>
|
||||
<stop offset="1" stop-color="#ED743B"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_22_189">
|
||||
<rect width="103" height="20.2448" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 111 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
@@ -0,0 +1,11 @@
|
||||
<svg width="102" height="31" viewBox="0 0 102 31" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M24.7443 13.5867C19.8876 10.7025 11.8767 10.4373 7.24037 11.8444C6.49582 12.0702 5.70854 11.6499 5.48295 10.9054C5.25735 10.1606 5.6772 9.37381 6.42224 9.14747C11.7444 7.53182 20.5916 7.84398 26.1827 11.1629C26.8525 11.5603 27.0722 12.4252 26.6751 13.0939C26.2779 13.7635 25.4123 13.9842 24.7443 13.5867ZM24.5852 17.8586C24.2446 18.4116 23.5217 18.5848 22.9696 18.2455C18.9205 15.7566 12.7463 15.0356 7.95602 16.4896C7.33483 16.6773 6.67869 16.3271 6.49006 15.7071C6.30283 15.0859 6.65325 14.4309 7.27333 14.242C12.7456 12.5815 19.5483 13.3858 24.1987 16.2437C24.7509 16.5837 24.9247 17.3071 24.5852 17.8586ZM22.7416 21.9613C22.471 22.4051 21.8928 22.5444 21.4505 22.2738C17.9124 20.1114 13.4591 19.6229 8.21451 20.821C7.70905 20.9369 7.20543 20.62 7.0901 20.1148C6.97436 19.6094 7.28985 19.1059 7.79642 18.9905C13.5357 17.6785 18.4589 18.2432 22.4302 20.6699C22.8729 20.9402 23.0124 21.5187 22.7416 21.9613ZM15.8319 0.229734C7.51087 0.229734 0.76506 6.97516 0.76506 15.2962C0.76506 23.618 7.51087 30.3632 15.8319 30.3632C24.1532 30.3632 30.8987 23.618 30.8987 15.2962C30.8987 6.97516 24.1532 0.229734 15.8319 0.229734Z" fill="#1ED760"/>
|
||||
<path d="M41.7566 14.1389C39.1552 13.5186 38.6919 13.0831 38.6919 12.1685C38.6919 11.304 39.5059 10.7225 40.716 10.7225C41.889 10.7225 43.052 11.1642 44.2717 12.0735C44.3086 12.101 44.3548 12.112 44.4003 12.1048C44.4458 12.0979 44.486 12.0731 44.5128 12.0353L45.783 10.2448C45.8351 10.1712 45.8209 10.0694 45.7506 10.0131C44.2992 8.84846 42.6648 8.28227 40.7545 8.28227C37.9456 8.28227 35.9836 9.96772 35.9836 12.3797C35.9836 14.9661 37.6761 15.8817 40.6008 16.5886C43.0902 17.162 43.5103 17.6423 43.5103 18.5012C43.5103 19.4527 42.6607 20.0443 41.2935 20.0443C39.7752 20.0443 38.5365 19.5328 37.1509 18.3329C37.1166 18.3034 37.0694 18.2898 37.0259 18.2923C36.9802 18.2961 36.9383 18.3173 36.9091 18.3523L35.4849 20.0473C35.4252 20.1177 35.4327 20.2228 35.5016 20.2836C37.1139 21.7227 39.0964 22.483 41.2359 22.483C44.2627 22.483 46.2185 20.8291 46.2185 18.2694C46.2185 16.1061 44.926 14.9098 41.7566 14.1389Z" fill="#1ED760"/>
|
||||
<path d="M55.2635 17.0382C55.2635 18.8649 54.1383 20.1396 52.5271 20.1396C50.9343 20.1396 49.7328 18.807 49.7328 17.0382C49.7328 15.2697 50.9343 13.9369 52.5271 13.9369C54.1124 13.9369 55.2635 15.2409 55.2635 17.0382ZM53.0663 11.5732C51.7544 11.5732 50.6783 12.09 49.791 13.1488V11.957C49.791 11.8629 49.7147 11.7863 49.6206 11.7863H47.2914C47.1973 11.7863 47.1212 11.8629 47.1212 11.957V25.1992C47.1212 25.2933 47.1973 25.3699 47.2914 25.3699H49.6206C49.7147 25.3699 49.791 25.2933 49.791 25.1992V21.0194C50.6785 22.0154 51.7548 22.5019 53.0663 22.5019C55.504 22.5019 57.9718 20.6253 57.9718 17.0382C57.9718 13.4503 55.504 11.5732 53.0663 11.5732Z" fill="#1ED760"/>
|
||||
<path d="M64.2972 20.1587C62.6274 20.1587 61.3686 18.817 61.3686 17.0382C61.3686 15.2519 62.5839 13.9556 64.2587 13.9556C65.9393 13.9556 67.2067 15.2972 67.2067 17.0772C67.2067 18.8633 65.9831 20.1587 64.2972 20.1587ZM64.2972 11.5733C61.1579 11.5733 58.6984 13.9907 58.6984 17.0772C58.6984 20.1302 61.141 22.5223 64.2587 22.5223C67.4093 22.5223 69.8763 20.113 69.8763 17.0382C69.8763 13.9737 67.4262 11.5733 64.2972 11.5733Z" fill="#1ED760"/>
|
||||
<path d="M76.5803 11.7863H74.0171V9.16561C74.0171 9.07152 73.9411 8.99505 73.847 8.99505H71.518C71.4237 8.99505 71.3471 9.07152 71.3471 9.16561V11.7863H70.2271C70.1332 11.7863 70.0574 11.8629 70.0574 11.957V13.9589C70.0574 14.0529 70.1332 14.1295 70.2271 14.1295H71.3471V19.3096C71.3471 21.403 72.389 22.4643 74.4438 22.4643C75.2793 22.4643 75.9726 22.2918 76.6258 21.9213C76.6789 21.8917 76.712 21.8344 76.712 21.7736V19.8673C76.712 19.8084 76.6812 19.753 76.6311 19.722C76.5803 19.6902 76.5172 19.6886 76.4652 19.7143C76.0165 19.94 75.5827 20.0443 75.0978 20.0443C74.3506 20.0443 74.0171 19.7051 74.0171 18.9446V14.1295H76.5803C76.6744 14.1295 76.7502 14.0529 76.7502 13.9589V11.957C76.7502 11.8629 76.6744 11.7863 76.5803 11.7863Z" fill="#1ED760"/>
|
||||
<path d="M85.5108 11.7966V11.4747C85.5108 10.5278 85.8739 10.1055 86.6882 10.1055C87.1738 10.1055 87.5639 10.202 88.0007 10.3477C88.0545 10.3646 88.1106 10.3561 88.1543 10.3239C88.1993 10.2917 88.2247 10.2401 88.2247 10.1854V8.22252C88.2247 8.14749 88.1765 8.0811 88.1043 8.05915C87.6428 7.92188 87.0524 7.78082 86.1682 7.78082C84.0166 7.78082 82.8796 8.99238 82.8796 11.2833V11.7762H81.7605C81.6666 11.7762 81.5895 11.8527 81.5895 11.9468V13.9589C81.5895 14.053 81.6666 14.1295 81.7605 14.1295H82.8796V22.1196C82.8796 22.2137 82.9555 22.2902 83.0494 22.2902H85.3786C85.4727 22.2902 85.5493 22.2137 85.5493 22.1196V14.1295H87.7242L91.0557 22.1175C90.6775 22.9568 90.3056 23.1238 89.7979 23.1238C89.3875 23.1238 88.9553 23.0012 88.5135 22.7594C88.4719 22.7365 88.4228 22.7328 88.3778 22.7466C88.3334 22.7625 88.2959 22.7954 88.277 22.8388L87.4876 24.5708C87.45 24.6526 87.482 24.7488 87.5608 24.7912C88.385 25.2376 89.1291 25.4281 90.0485 25.4281C91.7685 25.4281 92.7192 24.6268 93.5574 22.4714L97.5985 12.029C97.6187 11.9765 97.6127 11.9173 97.5805 11.8705C97.5485 11.8244 97.4969 11.7966 97.4404 11.7966H95.0154C94.9429 11.7966 94.8778 11.8426 94.8541 11.9108L92.37 19.0063L89.6491 11.9061C89.6243 11.8401 89.5607 11.7966 89.49 11.7966H85.5108Z" fill="#1ED760"/>
|
||||
<path d="M80.3336 11.7863H78.0042C77.9101 11.7863 77.8336 11.8629 77.8336 11.957V22.1196C77.8336 22.2137 77.9101 22.2902 78.0042 22.2902H80.3336C80.4275 22.2902 80.5041 22.2137 80.5041 22.1196V11.957C80.5041 11.8629 80.4275 11.7863 80.3336 11.7863Z" fill="#1ED760"/>
|
||||
<path d="M79.1806 7.15901C78.258 7.15901 77.509 7.90621 77.509 8.82882C77.509 9.75215 78.258 10.5001 79.1806 10.5001C80.1031 10.5001 80.8512 9.75215 80.8512 8.82882C80.8512 7.90621 80.1031 7.15901 79.1806 7.15901Z" fill="#1ED760"/>
|
||||
<path d="M99.6825 12.7972H99.2557V13.3415H99.6825C99.8955 13.3415 100.023 13.2372 100.023 13.0692C100.023 12.8922 99.8955 12.7972 99.6825 12.7972ZM99.9592 13.5736L100.423 14.2228H100.032L99.6145 13.6274H99.2557V14.2228H98.9285V12.502H99.6958C100.095 12.502 100.358 12.7066 100.358 13.0509C100.358 13.333 100.195 13.5054 99.9592 13.5736ZM99.5958 11.9295C98.7561 11.9295 98.1206 12.5969 98.1206 13.4143C98.1206 14.2313 98.7516 14.8898 99.5871 14.8898C100.427 14.8898 101.063 14.2228 101.063 13.405C101.063 12.588 100.431 11.9295 99.5958 11.9295ZM99.5871 15.0538C98.6652 15.0538 97.9479 14.3134 97.9479 13.4143C97.9479 12.5152 98.6746 11.7664 99.5958 11.7664C100.517 11.7664 101.235 12.5067 101.235 13.405C101.235 14.3042 100.509 15.0538 99.5871 15.0538Z" fill="#1ED760"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 57 KiB |
@@ -0,0 +1,25 @@
|
||||
<svg width="130" height="25" viewBox="0 0 130 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_22_225)">
|
||||
<path d="M94.1544 10.5232C93.6569 13.0503 93.2788 16.1346 93.0799 17.408H92.9405C92.7813 16.0948 92.4033 13.0303 91.8859 10.543L90.6125 4.35469H86.7323V21.0494H89.14V7.28786L89.3786 8.57318L91.8262 21.0494H94.2341L96.6416 8.57318L96.8999 7.28043V15.5532L96.9001 21.0494H99.3078V4.35469H95.388L94.1544 10.5232Z" fill="white"/>
|
||||
<path d="M105.815 18.5423C105.596 18.9999 105.119 19.3181 104.641 19.3181C104.084 19.3181 103.865 18.8805 103.865 17.8059V8.85182H101.119V17.9652C101.119 20.2136 101.855 21.2483 103.487 21.2483C104.601 21.2483 105.497 20.7508 106.114 19.557H106.173L106.412 21.0494H108.561V8.85182H105.815V18.5423Z" fill="white"/>
|
||||
<path d="M113.874 13.6672C112.978 13.0106 112.421 12.5728 112.421 11.6176C112.421 10.9411 112.74 10.563 113.496 10.563C114.272 10.563 114.531 11.1003 114.551 12.9309L116.859 12.8314C117.038 9.86658 116.063 8.6328 113.536 8.6328C111.188 8.6328 110.033 9.68756 110.033 11.8564C110.033 13.8263 110.989 14.7218 112.541 15.8958C113.874 16.9305 114.65 17.5076 114.65 18.3432C114.65 18.98 114.252 19.4177 113.555 19.4177C112.74 19.4177 112.262 18.6418 112.382 17.2888L110.054 17.3284C109.695 19.8555 110.71 21.3279 113.416 21.3279C115.784 21.3279 117.018 20.2337 117.018 18.0448C117.018 16.055 116.023 15.2591 113.874 13.6672Z" fill="white"/>
|
||||
<path d="M118.53 21.0494H121.157V8.8518H118.53V21.0494Z" fill="white"/>
|
||||
<path d="M119.863 4.03635C118.849 4.03635 118.372 4.41446 118.372 5.72779C118.372 7.08092 118.849 7.41913 119.863 7.41913C120.898 7.41913 121.356 7.08092 121.356 5.72779C121.356 4.47414 120.898 4.03635 119.863 4.03635Z" fill="white"/>
|
||||
<path d="M129.992 16.652L127.584 16.5325C127.584 18.6816 127.345 19.3779 126.53 19.3779C125.714 19.3779 125.574 18.602 125.574 16.0749V13.707C125.574 11.2594 125.734 10.4834 126.549 10.4834C127.306 10.4834 127.505 11.2196 127.505 13.4881L129.892 13.3289C130.052 11.4385 129.813 10.1451 129.077 9.40885C128.539 8.87158 127.724 8.61302 126.589 8.61302C123.923 8.61302 122.828 10.0457 122.828 14.0651V15.7763C122.828 19.9154 123.764 21.2483 126.49 21.2483C127.644 21.2483 128.44 21.0096 128.977 20.4923C129.753 19.7758 130.052 18.5423 129.992 16.652Z" fill="white"/>
|
||||
<path d="M39.3351 18.7816C39.4874 18.3835 39.5639 17.7337 39.5639 16.8312V13.03C39.5639 12.1543 39.4874 11.5144 39.3351 11.1095C39.1823 10.7048 38.9137 10.5024 38.5291 10.5024C38.1574 10.5024 37.8953 10.7048 37.743 11.1095C37.5903 11.5144 37.5142 12.1543 37.5142 13.03V16.8312C37.5142 17.7337 37.5868 18.3835 37.7329 18.7816C37.8788 19.1795 38.1441 19.3786 38.5291 19.3786C38.9137 19.3786 39.1823 19.1795 39.3351 18.7816ZM36.2504 20.692C35.6995 20.321 35.3081 19.7436 35.0763 18.9608C34.8438 18.1779 34.7279 17.1365 34.7279 15.836V14.0649C34.7279 12.7514 34.8603 11.6965 35.1258 10.9004C35.3912 10.1045 35.8056 9.52419 36.3697 9.15917C36.9334 8.79449 37.6732 8.61196 38.5886 8.61196C39.4908 8.61196 40.2139 8.79778 40.7581 9.16909C41.3019 9.54066 41.6997 10.1212 41.9521 10.9104C42.2041 11.6999 42.3303 12.7514 42.3303 14.0649V15.836C42.3303 17.1365 42.2075 18.1815 41.962 18.9706C41.7165 19.7602 41.3184 20.3373 40.768 20.7021C40.2171 21.0669 39.4709 21.2494 38.5291 21.2494C37.5605 21.2494 36.8007 21.0636 36.2504 20.692Z" fill="white"/>
|
||||
<path d="M78.8683 10.7304C78.7291 10.903 78.6361 11.1849 78.5898 11.5763C78.5431 11.9678 78.5202 12.5613 78.5202 13.3575V14.2332H80.5303V13.3575C80.5303 12.5748 80.5035 11.9811 80.4508 11.5763C80.3976 11.1717 80.3017 10.8865 80.162 10.7205C80.0227 10.5547 79.8069 10.4717 79.5151 10.4717C79.2233 10.4717 79.0078 10.5582 78.8683 10.7304ZM78.5202 15.8651V16.482C78.5202 17.2651 78.5431 17.8522 78.5898 18.2435C78.6361 18.6349 78.7321 18.92 78.8786 19.0993C79.0243 19.2784 79.2497 19.3678 79.555 19.3678C79.9661 19.3678 80.2481 19.2086 80.4009 18.8903C80.5532 18.5718 80.6363 18.0413 80.6496 17.2979L83.0179 17.4373C83.0312 17.5438 83.0378 17.6897 83.0378 17.8753C83.0378 19.0031 82.7293 19.8454 82.1125 20.4028C81.4954 20.9599 80.623 21.2386 79.4952 21.2386C78.142 21.2386 77.1931 20.8141 76.6491 19.9649C76.1052 19.116 75.8333 17.8026 75.8333 16.0244V13.8948C75.8333 12.0639 76.1152 10.7273 76.6791 9.88457C77.243 9.04213 78.2085 8.62074 79.5749 8.62074C80.517 8.62074 81.2398 8.79341 81.7442 9.1383C82.2483 9.48349 82.6031 10.0208 82.809 10.7502C83.0145 11.4801 83.1178 12.4887 83.1178 13.7754V15.8651H78.5202Z" fill="white"/>
|
||||
<path d="M29.5625 15.6366L26.4379 4.35238H29.1644L30.259 9.4671C30.5378 10.7277 30.7432 11.8024 30.8761 12.6912H30.9556C31.0483 12.0543 31.254 10.9865 31.5726 9.48705L32.7071 4.35238H35.4336L32.2691 15.6366V21.0503H29.5625V15.6366Z" fill="white"/>
|
||||
<path d="M51.1979 8.85064V21.0502H49.0483L48.8095 19.5576H48.7501C48.1658 20.6856 47.2902 21.2493 46.1228 21.2493C45.3136 21.2493 44.7162 20.984 44.3319 20.4532C43.9469 19.9226 43.7545 19.0935 43.7545 17.9655V8.85064H46.5009V17.8065C46.5009 18.3505 46.5607 18.7385 46.6803 18.9707C46.7996 19.2028 46.9984 19.319 47.2772 19.319C47.5161 19.319 47.7449 19.246 47.9638 19.0999C48.1828 18.9541 48.345 18.7685 48.4515 18.5425V8.85064H51.1979Z" fill="white"/>
|
||||
<path d="M65.2854 8.85064V21.0502H63.1358L62.8969 19.5576H62.8376C62.2533 20.6856 61.3777 21.2493 60.2103 21.2493C59.4011 21.2493 58.8037 20.984 58.4194 20.4532C58.0344 19.9226 57.842 19.0935 57.842 17.9655V8.85064H60.5884V17.8065C60.5884 18.3505 60.6482 18.7385 60.7675 18.9707C60.8871 19.2028 61.0859 19.319 61.3646 19.319C61.6035 19.319 61.8323 19.246 62.0513 19.0999C62.2703 18.9541 62.4324 18.7685 62.5389 18.5425V8.85064H65.2854Z" fill="white"/>
|
||||
<path d="M58.6608 6.56181H55.9343V21.0501H53.2476V6.56181H50.5211V4.35272H58.6608V6.56181Z" fill="white"/>
|
||||
<path d="M71.8573 15.7769C71.8573 16.6661 71.8207 17.3626 71.7478 17.8665C71.675 18.371 71.552 18.7293 71.3795 18.9413C71.2073 19.1538 70.9748 19.2598 70.683 19.2598C70.4574 19.2598 70.2485 19.2068 70.0564 19.1006C69.8637 18.9943 69.7082 18.8353 69.5887 18.6228V11.697C69.6812 11.3656 69.8406 11.0935 70.0662 10.8811C70.2916 10.669 70.5371 10.5627 70.8026 10.5627C71.0813 10.5627 71.2966 10.6722 71.4494 10.891C71.6017 11.1098 71.708 11.4782 71.7678 11.9956C71.8275 12.513 71.8573 13.2494 71.8573 14.2047V15.7769ZM74.3752 10.8006C74.2089 10.0315 73.9402 9.47416 73.569 9.12899C73.1974 8.7841 72.6865 8.61159 72.0367 8.61159C71.5321 8.61159 71.0614 8.7543 70.6235 9.03944C70.1858 9.32485 69.8472 9.69963 69.6086 10.164H69.5882L69.5887 3.73559H66.9416V21.0501H69.2105L69.4892 19.8957H69.5488C69.7609 20.3073 70.0793 20.632 70.5039 20.8709C70.9285 21.1098 71.3995 21.2292 71.9171 21.2292C72.8456 21.2292 73.5291 20.8014 73.9668 19.9456C74.4047 19.0899 74.6239 17.7533 74.6239 15.9353V14.0049C74.6239 12.6386 74.5406 11.5705 74.3752 10.8006Z" fill="white"/>
|
||||
<path d="M12.0901 24.6219C18.7674 24.6219 24.1803 19.209 24.1803 12.5318C24.1803 5.85459 18.7674 0.441692 12.0901 0.441692C5.41292 0.441692 0 5.85459 0 12.5318C0 19.209 5.41292 24.6219 12.0901 24.6219Z" fill="#ED1D24"/>
|
||||
<path d="M12.0901 5.18941C8.03538 5.18941 4.74754 8.47706 4.74754 12.5318C4.74754 16.5865 8.03538 19.8743 12.0901 19.8743C16.1448 19.8743 19.4326 16.5865 19.4326 12.5318C19.4326 8.47706 16.1448 5.18941 12.0901 5.18941ZM12.0901 6.16527C15.6009 6.16527 18.4567 9.02104 18.4567 12.5318C18.4567 16.0425 15.6009 18.8984 12.0901 18.8984C8.57936 18.8984 5.72349 16.0425 5.72349 12.5318C5.72349 9.02104 8.57936 6.16527 12.0901 6.16527Z" fill="white"/>
|
||||
<path d="M9.75453 16.1039L15.9369 12.5318L9.75453 8.95969V16.1039Z" fill="white"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_22_225">
|
||||
<rect width="130" height="24.18" fill="white" transform="translate(0 0.442017)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.5 KiB |
@@ -0,0 +1,36 @@
|
||||
.aurora-preview-page {
|
||||
min-height: 100vh;
|
||||
padding: 32px;
|
||||
background:
|
||||
radial-gradient(circle at top left, rgba(28, 117, 219, 0.16), transparent 30%),
|
||||
radial-gradient(circle at top right, rgba(237, 41, 122, 0.14), transparent 30%),
|
||||
var(--black-color);
|
||||
color: var(--white-color);
|
||||
}
|
||||
|
||||
.aurora-preview-shell {
|
||||
width: min(1_440px, 100%);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.aurora-preview-header {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.aurora-preview-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.aurora-preview-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.aurora-preview-widget {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
import { fileURLToPath } from 'node:url'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
const AURORA_PREVIEW_DEV_SERVER_PORT = 5_175
|
||||
|
||||
export default defineConfig({
|
||||
root: fileURLToPath(new URL('.', import.meta.url)),
|
||||
resolve: {
|
||||
alias: [
|
||||
{
|
||||
find: '@aurora/style.css',
|
||||
replacement: fileURLToPath(new URL('../style.css', import.meta.url))
|
||||
},
|
||||
{
|
||||
find: '@aurora',
|
||||
replacement: fileURLToPath(new URL('../src/index.ts', import.meta.url))
|
||||
}
|
||||
]
|
||||
},
|
||||
server: {
|
||||
port: AURORA_PREVIEW_DEV_SERVER_PORT
|
||||
},
|
||||
plugins: [react()]
|
||||
})
|
||||
@@ -0,0 +1,61 @@
|
||||
@use '../../styles/main.sass' as *
|
||||
|
||||
.aurora-button
|
||||
position: relative
|
||||
display: inline-block
|
||||
font-size: var(--a-font-size-md)
|
||||
line-height: var(--a-line-height-md)
|
||||
font-weight: var(--a-font-weight-semi-bold)
|
||||
border-radius: var(--a-border-radius-md)
|
||||
height: var(--a-button-size-md)
|
||||
border: none
|
||||
cursor: pointer
|
||||
padding: 0 var(--a-space-lg)
|
||||
box-shadow: 0 0 10px 2px transparent
|
||||
transition: opacity var(--a-transition-duration-main) var(--a-transition-timing-main), transform var(--a-transition-duration-main), background-color var(--a-transition-duration-main) var(--a-transition-timing-main), border-color var(--a-transition-duration-main) var(--a-transition-timing-main), color var(--a-transition-duration-main) var(--a-transition-timing-main), box-shadow var(--a-transition-duration-main) var(--a-transition-timing-main)
|
||||
&:hover:not(&--disabled, &--loading)
|
||||
transform: scale3d(1.01, 1.01, 1.01)
|
||||
&:active:not(&--disabled, &--loading)
|
||||
transform: scale3d(.96, .96, .96)
|
||||
|
||||
&--primary
|
||||
color: var(--a-color-text)
|
||||
background-color: var(--a-color-accent)
|
||||
&:hover:not(.aurora-button--disabled, .aurora-button--loading)
|
||||
background-color: var(--a-color-accent-hover)
|
||||
|
||||
&--secondary
|
||||
background-color: transparent
|
||||
color: var(--a-color-accent)
|
||||
border: 1px solid var(--a-color-accent)
|
||||
&:hover:not(.aurora-button--disabled, .aurora-button--loading), &:hover:not(.aurora-button--disabled, .aurora-button--loading) .aurora-icon
|
||||
border-color: var(--a-color-accent-hover)
|
||||
color: var(--a-color-accent-hover)
|
||||
.aurora-icon
|
||||
color: var(--a-color-accent)
|
||||
|
||||
&--danger
|
||||
background-color: var(--a-color-background-danger)
|
||||
color: var(--a-color-text-danger)
|
||||
&:hover:not(.aurora-button--disabled, .aurora-button--loading)
|
||||
background-color: var(--a-color-danger-hover)
|
||||
|
||||
&--light
|
||||
background-color: transparent
|
||||
color: var(--a-color-accent)
|
||||
&:hover:not(.aurora-button--disabled, .aurora-button--loading), &:hover:not(.aurora-button--disabled, .aurora-button--loading) .aurora-icon
|
||||
color: var(--a-color-accent-hover)
|
||||
.aurora-icon
|
||||
color: var(--a-color-accent)
|
||||
|
||||
&--disabled
|
||||
opacity: var(--a-opacity-disabled)
|
||||
cursor: not-allowed
|
||||
|
||||
&--loading
|
||||
opacity: var(--a-opacity-disabled)
|
||||
cursor: wait
|
||||
|
||||
.aurora-loader
|
||||
&::before, &::after
|
||||
background-color: var(--a-color-white)
|
||||
@@ -0,0 +1,114 @@
|
||||
import classNames from 'clsx'
|
||||
|
||||
import { generateKeyId } from '../../lib/utils'
|
||||
import { Flexbox, Icon, Loader } from '../..'
|
||||
|
||||
import './button.sass'
|
||||
|
||||
interface ButtonOnClickData {
|
||||
name: string | undefined
|
||||
value: string | number | undefined
|
||||
}
|
||||
|
||||
export interface ButtonProps {
|
||||
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
|
||||
children?: any
|
||||
// children?: React.ReactNode
|
||||
type?: 'button' | 'submit'
|
||||
iconName?: string
|
||||
iconPosition?: 'left' | 'right'
|
||||
secondary?: boolean
|
||||
danger?: boolean
|
||||
light?: boolean
|
||||
disabled?: boolean
|
||||
loading?: boolean
|
||||
name?: string
|
||||
value?: string | number | undefined
|
||||
onClick?: (data: ButtonOnClickData) => void
|
||||
}
|
||||
|
||||
export function Button({
|
||||
children,
|
||||
type = 'button',
|
||||
iconName,
|
||||
iconPosition = 'left',
|
||||
secondary,
|
||||
danger,
|
||||
light,
|
||||
disabled,
|
||||
loading,
|
||||
name,
|
||||
value,
|
||||
onClick
|
||||
}: ButtonProps) {
|
||||
let variant = 'primary'
|
||||
|
||||
if (secondary) {
|
||||
variant = 'secondary'
|
||||
} else if (danger) {
|
||||
variant = 'danger'
|
||||
} else if (light) {
|
||||
variant = 'light'
|
||||
}
|
||||
|
||||
return (
|
||||
<button
|
||||
key={`aurora-button_${generateKeyId()}`}
|
||||
type={type}
|
||||
name={name}
|
||||
value={value}
|
||||
className={classNames('aurora-button', {
|
||||
'aurora-button--disabled': disabled,
|
||||
'aurora-button--loading': loading,
|
||||
[`aurora-button--${variant}`]: variant
|
||||
})}
|
||||
disabled={disabled || loading}
|
||||
onClick={(event) => {
|
||||
if (type !== 'button') {
|
||||
return
|
||||
}
|
||||
|
||||
event.preventDefault()
|
||||
|
||||
const data = {
|
||||
name,
|
||||
value
|
||||
}
|
||||
|
||||
if (onClick) {
|
||||
onClick(data)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{loading ? (
|
||||
<Loader />
|
||||
) : (
|
||||
<>
|
||||
{iconName && iconPosition === 'left' && (
|
||||
<Flexbox
|
||||
flexDirection="row"
|
||||
justifyContent="center"
|
||||
alignItems="center"
|
||||
gap="xs"
|
||||
>
|
||||
<Icon iconName={iconName} type="line" />
|
||||
{children}
|
||||
</Flexbox>
|
||||
)}
|
||||
{iconName && iconPosition === 'right' && (
|
||||
<Flexbox
|
||||
flexDirection="row"
|
||||
justifyContent="center"
|
||||
alignItems="center"
|
||||
gap="xs"
|
||||
>
|
||||
{children}
|
||||
<Icon iconName={iconName} type="line" />
|
||||
</Flexbox>
|
||||
)}
|
||||
{!iconName && children}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from './button'
|
||||
@@ -0,0 +1,12 @@
|
||||
@use '../../styles/main.sass' as *
|
||||
|
||||
.aurora-card
|
||||
position: relative
|
||||
display: inline-block
|
||||
width: auto
|
||||
padding: var(--a-space-md)
|
||||
background-color: var(--a-color-background-surface-secondary)
|
||||
border-radius: var(--a-border-radius-md)
|
||||
|
||||
&--full-width
|
||||
width: 100%
|
||||
@@ -0,0 +1,25 @@
|
||||
import classNames from 'clsx'
|
||||
|
||||
import { generateKeyId } from '../../lib/utils'
|
||||
|
||||
import './card.sass'
|
||||
|
||||
export interface CardProps {
|
||||
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
|
||||
children: any
|
||||
// children: React.ReactNode
|
||||
fullWidth?: boolean
|
||||
}
|
||||
|
||||
export function Card({ children, fullWidth }: CardProps) {
|
||||
return (
|
||||
<div
|
||||
key={`aurora-card_${generateKeyId()}`}
|
||||
className={classNames('aurora-card', {
|
||||
'aurora-card--full-width': fullWidth
|
||||
})}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from './card'
|
||||
@@ -0,0 +1,39 @@
|
||||
@use '../../styles/main.sass' as *
|
||||
|
||||
.aurora-checkbox
|
||||
display: flex
|
||||
align-items: center
|
||||
gap: var(--a-space-sm)
|
||||
cursor: pointer
|
||||
&[data-disabled]
|
||||
cursor: not-allowed
|
||||
|
||||
.aurora-checkbox-placeholder
|
||||
width: var(--a-checkbox-radio-size)
|
||||
height: var(--a-checkbox-radio-size)
|
||||
|
||||
.aurora-checkbox-control
|
||||
display: flex
|
||||
justify-content: center
|
||||
align-items: center
|
||||
width: var(--a-checkbox-radio-size)
|
||||
height: var(--a-checkbox-radio-size)
|
||||
border-radius: var(--a-border-radius-xs)
|
||||
border: 1px solid var(--a-color-input-border)
|
||||
background-color: var(--a-color-input-background)
|
||||
transition: background-color var(--a-transition-duration-main) var(--a-transition-timing-main), border-color var(--a-transition-duration-main) var(--a-transition-timing-main)
|
||||
|
||||
&[data-hover]:not([data-state="checked"])
|
||||
border-color: var(--a-color-input-border-hover)
|
||||
background-color: var(--a-color-input-background-hover)
|
||||
&[data-state="checked"]
|
||||
border-color: transparent
|
||||
background-color: var(--a-color-input-border-focus)
|
||||
&[data-disabled]
|
||||
opacity: var(--a-opacity-disabled)
|
||||
|
||||
.aurora-checkbox-label
|
||||
color: var(--a-color-text)
|
||||
font-size: var(--a-font-size-md)
|
||||
&[data-disabled]
|
||||
opacity: var(--a-opacity-disabled)
|
||||
@@ -0,0 +1,74 @@
|
||||
import { useState } from 'react'
|
||||
import {
|
||||
Checkbox as ArkCheckbox,
|
||||
type CheckboxCheckedChangeDetails,
|
||||
type CheckboxRootProps as ArkCheckboxProps
|
||||
} from '@ark-ui/react/checkbox'
|
||||
|
||||
import { Icon } from '../icon'
|
||||
|
||||
import './checkbox.sass'
|
||||
|
||||
interface CheckboxOnChangeData {
|
||||
name: string
|
||||
value: string | undefined
|
||||
isChecked: boolean
|
||||
}
|
||||
|
||||
export interface CheckboxProps
|
||||
extends Pick<
|
||||
ArkCheckboxProps,
|
||||
'value' | 'checked' | 'disabled' | 'required'
|
||||
> {
|
||||
name: string
|
||||
label?: string
|
||||
onChange?: (data: CheckboxOnChangeData) => void
|
||||
}
|
||||
|
||||
export function Checkbox({
|
||||
name,
|
||||
label,
|
||||
checked,
|
||||
value,
|
||||
disabled,
|
||||
required,
|
||||
onChange
|
||||
}: CheckboxProps) {
|
||||
const [isChecked, setIsChecked] = useState(checked)
|
||||
|
||||
return (
|
||||
<ArkCheckbox.Root
|
||||
className="aurora-checkbox"
|
||||
name={name}
|
||||
value={value}
|
||||
checked={isChecked}
|
||||
disabled={disabled}
|
||||
required={required}
|
||||
onCheckedChange={(event: CheckboxCheckedChangeDetails) => {
|
||||
setIsChecked(event.checked as boolean)
|
||||
|
||||
const data = {
|
||||
name,
|
||||
value,
|
||||
isChecked: !!event.checked
|
||||
}
|
||||
|
||||
if (onChange) {
|
||||
onChange(data)
|
||||
}
|
||||
}}
|
||||
>
|
||||
<ArkCheckbox.HiddenInput />
|
||||
<ArkCheckbox.Control className="aurora-checkbox-control">
|
||||
{isChecked ? (
|
||||
<Icon iconName="check" size="sm" animated />
|
||||
) : (
|
||||
<div className="aurora-checkbox-placeholder" />
|
||||
)}
|
||||
</ArkCheckbox.Control>
|
||||
<ArkCheckbox.Label className="aurora-checkbox-label">
|
||||
{label}
|
||||
</ArkCheckbox.Label>
|
||||
</ArkCheckbox.Root>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from './checkbox'
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user