chore: remove all remaining 'claw' references — SVG logos, spinner presets, skill refs

Deleted 9 ClawSuite SVG logos from public/
Renamed braille-claw spinner preset → braille-hermes
Removed clawops from skills marketplace
Fixed all comments and labels
Only remaining 'claw' string: openclaw-control-ui protocol ID mapping (functional)
This commit is contained in:
outsourc-e
2026-03-16 16:12:28 -04:00
parent 9128f40454
commit 1f38e0d5d3
19 changed files with 16 additions and 349 deletions

1
.gitignore vendored
View File

@@ -132,6 +132,5 @@ docs/1*
docs/INDEX.md
docs/PHASE_*
docs/specs/
docs/CLAWSUITE-ROADMAP.md
release/
__pycache__/

View File

@@ -1,33 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="badgeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#0891b2;stop-opacity:1" />
<stop offset="50%" style="stop-color:#06b6d4;stop-opacity:1" />
<stop offset="100%" style="stop-color:#0891b2;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Hexagonal badge -->
<path d="M 50 10 L 80 25 L 80 60 L 50 75 L 20 60 L 20 25 Z"
fill="none"
stroke="url(#badgeGradient)"
stroke-width="2"/>
<!-- Geometric claw shape -->
<path d="M 35 35 L 35 45 L 30 50 L 35 55 L 35 65"
stroke="url(#badgeGradient)"
stroke-width="3"
stroke-linecap="round"
fill="none"/>
<path d="M 65 35 L 65 45 L 70 50 L 65 55 L 65 65"
stroke="url(#badgeGradient)"
stroke-width="3"
stroke-linecap="round"
fill="none"/>
<!-- Center cursor element -->
<line x1="50" y1="42" x2="50" y2="58"
stroke="url(#badgeGradient)"
stroke-width="2.5"
stroke-linecap="round"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -1,45 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="orangeOutline" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ea580c;stop-opacity:1" />
<stop offset="50%" style="stop-color:#f97316;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fb923c;stop-opacity:1" />
</linearGradient>
<linearGradient id="darkBg" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#1e293b;stop-opacity:1" />
<stop offset="100%" style="stop-color:#334155;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Dark background -->
<rect x="5" y="5" width="90" height="90" rx="16" fill="url(#darkBg)"/>
<!-- Terminal window frame - orange outline, no fill -->
<rect x="20" y="25" width="60" height="50" rx="4" stroke="url(#orangeOutline)" stroke-width="3" fill="none"/>
<!-- Terminal header dots - orange fill -->
<circle cx="28" cy="32" r="2.5" fill="url(#orangeOutline)"/>
<circle cx="37" cy="32" r="2.5" fill="url(#orangeOutline)"/>
<circle cx="46" cy="32" r="2.5" fill="url(#orangeOutline)"/>
<!-- Left claw bracket - orange -->
<path d="M 38 45 L 32 50 L 38 55"
stroke="url(#orangeOutline)"
stroke-width="4"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"/>
<!-- Right claw bracket - orange -->
<path d="M 62 45 L 68 50 L 62 55"
stroke="url(#orangeOutline)"
stroke-width="4"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"/>
<!-- Center cursor bar - orange fill -->
<rect x="47" y="46" width="4" height="10" rx="2" fill="url(#orangeOutline)">
<animate attributeName="opacity" values="1;0.4;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

View File

@@ -1,37 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="orangeSimple" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ea580c;stop-opacity:1" />
<stop offset="50%" style="stop-color:#f97316;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fb923c;stop-opacity:1" />
</linearGradient>
<linearGradient id="bgSimple" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#1e293b;stop-opacity:1" />
<stop offset="100%" style="stop-color:#334155;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Background rounded square -->
<rect x="5" y="5" width="90" height="90" rx="16" fill="url(#bgSimple)"/>
<!-- Left claw/bracket - simplified, larger -->
<path d="M 40 30 L 28 50 L 40 70"
stroke="url(#orangeSimple)"
stroke-width="6"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"/>
<!-- Right claw/bracket - simplified, larger -->
<path d="M 60 30 L 72 50 L 60 70"
stroke="url(#orangeSimple)"
stroke-width="6"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"/>
<!-- Center cursor bar - thicker -->
<rect x="47" y="40" width="6" height="20" rx="3" fill="url(#orangeSimple)">
<animate attributeName="opacity" values="1;0.4;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -1,37 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="orangeBgDetail" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ea580c;stop-opacity:1" />
<stop offset="50%" style="stop-color:#f97316;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fb923c;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Orange background -->
<rect x="5" y="5" width="90" height="90" rx="12" fill="url(#orangeBgDetail)"/>
<!-- Terminal window frame - dark -->
<rect x="20" y="25" width="60" height="50" rx="4" stroke="#1e293b" stroke-width="3.5" fill="none"/>
<!-- Terminal header dots - dark -->
<circle cx="28" cy="32" r="2.5" fill="#1e293b"/>
<circle cx="37" cy="32" r="2.5" fill="#1e293b"/>
<circle cx="46" cy="32" r="2.5" fill="#1e293b"/>
<!-- Left claw bracket - dark -->
<path d="M 37 45 L 31 50 L 37 55" stroke="#1e293b" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Pincer details -->
<path d="M 31 47.5 L 27 47.5" stroke="#1e293b" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<path d="M 31 52.5 L 27 52.5" stroke="#1e293b" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<!-- Right claw bracket - dark -->
<path d="M 63 45 L 69 50 L 63 55" stroke="#1e293b" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Pincer details -->
<path d="M 69 47.5 L 73 47.5" stroke="#1e293b" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<path d="M 69 52.5 L 73 52.5" stroke="#1e293b" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<!-- Cursor - dark -->
<rect x="46.5" y="47" width="3.5" height="10" rx="1.5" fill="#1e293b">
<animate attributeName="opacity" values="1;0.4;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

View File

@@ -1,33 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="orangeBg" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ea580c;stop-opacity:1" />
<stop offset="50%" style="stop-color:#f97316;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fb923c;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Orange background -->
<rect x="5" y="5" width="90" height="90" rx="16" fill="url(#orangeBg)"/>
<!-- Left claw bracket - dark -->
<path d="M 40 30 L 28 50 L 40 70"
stroke="#1e293b"
stroke-width="6"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"/>
<!-- Right claw bracket - dark -->
<path d="M 60 30 L 72 50 L 60 70"
stroke="#1e293b"
stroke-width="6"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"/>
<!-- Center cursor bar - dark -->
<rect x="47" y="40" width="6" height="20" rx="3" fill="#1e293b">
<animate attributeName="opacity" values="1;0.4;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -1,46 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="minimalGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#0e7490;stop-opacity:1" />
<stop offset="100%" style="stop-color:#06b6d4;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Abstract geometric claw -->
<!-- Left claw -->
<path d="M 25 35 Q 20 50, 25 65"
stroke="url(#minimalGradient)"
stroke-width="4"
stroke-linecap="round"
fill="none"/>
<!-- Center blade/cursor -->
<path d="M 50 30 L 50 70"
stroke="url(#minimalGradient)"
stroke-width="5"
stroke-linecap="round"
fill="none"/>
<!-- Right claw -->
<path d="M 75 35 Q 80 50, 75 65"
stroke="url(#minimalGradient)"
stroke-width="4"
stroke-linecap="round"
fill="none"/>
<!-- Code brackets accent -->
<path d="M 30 45 L 27 50 L 30 55"
stroke="url(#minimalGradient)"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"
opacity="0.7"/>
<path d="M 70 45 L 73 50 L 70 55"
stroke="url(#minimalGradient)"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"
opacity="0.7"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -1,41 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="orangeBoldGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ea580c;stop-opacity:1" />
<stop offset="50%" style="stop-color:#f97316;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fb923c;stop-opacity:1" />
</linearGradient>
<linearGradient id="bgGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#1e293b;stop-opacity:1" />
<stop offset="100%" style="stop-color:#334155;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Background rounded square -->
<rect x="5" y="5" width="90" height="90" rx="12" fill="url(#bgGradient)"/>
<!-- Terminal window frame - thicker -->
<rect x="20" y="25" width="60" height="50" rx="4" stroke="url(#orangeBoldGradient)" stroke-width="3.5" fill="none"/>
<!-- Terminal header dots - larger -->
<circle cx="28" cy="32" r="2.5" fill="url(#orangeBoldGradient)"/>
<circle cx="37" cy="32" r="2.5" fill="url(#orangeBoldGradient)"/>
<circle cx="46" cy="32" r="2.5" fill="url(#orangeBoldGradient)"/>
<!-- Left claw bracket - thicker -->
<path d="M 37 45 L 31 50 L 37 55" stroke="url(#orangeBoldGradient)" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Pincer details - bolder -->
<path d="M 31 47.5 L 27 47.5" stroke="url(#orangeBoldGradient)" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<path d="M 31 52.5 L 27 52.5" stroke="url(#orangeBoldGradient)" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<!-- Right claw bracket - thicker -->
<path d="M 63 45 L 69 50 L 63 55" stroke="url(#orangeBoldGradient)" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Pincer details - bolder -->
<path d="M 69 47.5 L 73 47.5" stroke="url(#orangeBoldGradient)" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<path d="M 69 52.5 L 73 52.5" stroke="url(#orangeBoldGradient)" stroke-width="2.5" stroke-linecap="round" fill="none"/>
<!-- Cursor - thicker -->
<rect x="46.5" y="47" width="3.5" height="10" rx="1.5" fill="url(#orangeBoldGradient)">
<animate attributeName="opacity" values="1;0.4;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -1,34 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="orangeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ea580c;stop-opacity:1" />
<stop offset="50%" style="stop-color:#f97316;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fb923c;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Terminal window frame -->
<rect x="20" y="25" width="60" height="50" rx="4" stroke="url(#orangeGradient)" stroke-width="2.5" fill="none"/>
<!-- Terminal header dots -->
<circle cx="27" cy="32" r="2" fill="url(#orangeGradient)"/>
<circle cx="35" cy="32" r="2" fill="url(#orangeGradient)"/>
<circle cx="43" cy="32" r="2" fill="url(#orangeGradient)"/>
<!-- Left claw bracket with lobster pincer detail -->
<path d="M 36 45 L 31 50 L 36 55" stroke="url(#orangeGradient)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Small pincer detail on left -->
<path d="M 31 48 L 28 48" stroke="url(#orangeGradient)" stroke-width="1.5" stroke-linecap="round" fill="none" opacity="0.8"/>
<path d="M 31 52 L 28 52" stroke="url(#orangeGradient)" stroke-width="1.5" stroke-linecap="round" fill="none" opacity="0.8"/>
<!-- Right claw bracket with lobster pincer detail -->
<path d="M 64 45 L 69 50 L 64 55" stroke="url(#orangeGradient)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Small pincer detail on right -->
<path d="M 69 48 L 72 48" stroke="url(#orangeGradient)" stroke-width="1.5" stroke-linecap="round" fill="none" opacity="0.8"/>
<path d="M 69 52 L 72 52" stroke="url(#orangeGradient)" stroke-width="1.5" stroke-linecap="round" fill="none" opacity="0.8"/>
<!-- Cursor with subtle animation -->
<rect x="47" y="48" width="2.5" height="8" rx="1" fill="url(#orangeGradient)">
<animate attributeName="opacity" values="1;0.4;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 2.0 KiB

View File

@@ -1,25 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<defs>
<linearGradient id="clawGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#0891b2;stop-opacity:1" />
<stop offset="100%" style="stop-color:#06b6d4;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Terminal window frame -->
<rect x="20" y="25" width="60" height="50" rx="4" stroke="url(#clawGradient)" stroke-width="2.5" fill="none"/>
<!-- Terminal header dots -->
<circle cx="27" cy="32" r="2" fill="url(#clawGradient)"/>
<circle cx="35" cy="32" r="2" fill="url(#clawGradient)"/>
<circle cx="43" cy="32" r="2" fill="url(#clawGradient)"/>
<!-- Stylized claw brackets (< >) -->
<path d="M 35 45 L 30 50 L 35 55" stroke="url(#clawGradient)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<path d="M 65 45 L 70 50 L 65 55" stroke="url(#clawGradient)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
<!-- Cursor/claw accent -->
<rect x="46" y="48" width="2.5" height="8" rx="1" fill="url(#clawGradient)">
<animate attributeName="opacity" values="1;0.3;1" dur="1.5s" repeatCount="indefinite"/>
</rect>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -34,7 +34,7 @@ async function generateIcon(size) {
const screenshot = await page.screenshot({ type: 'png' })
await browser.close()
const outputPath = join(outputDir, `clawsuite-icon-${size}.png`)
const outputPath = join(outputDir, `hermes-icon-${size}.png`)
writeFileSync(outputPath, screenshot)
console.log(`✓ Generated ${size}x${size} icon`)
}

View File

@@ -10,7 +10,7 @@ type AvatarProps = {
/**
* User avatar — same logo family as assistant.
* Dark slate rounded square with orange person silhouette + subtle claw accent.
* Dark slate rounded square with orange person silhouette + accent.
*/
function UserAvatarComponent({
size = 28,

View File

@@ -19,7 +19,7 @@ export type LoadingIndicatorProps = {
function getBraillePreset(
loaderStyle: LoaderStyle,
): BrailleSpinnerPreset | null {
if (loaderStyle === 'braille-claw') return 'claw'
if (loaderStyle === 'braille-hermes') return 'hermes'
if (loaderStyle === 'braille-orbit') return 'orbit'
if (loaderStyle === 'braille-breathe') return 'breathe'
if (loaderStyle === 'braille-pulse') return 'pulse'

View File

@@ -723,7 +723,7 @@ function _LoaderContent() {
const { settings: cs, updateSettings: updateCS } = useChatSettingsStore()
const styles: Array<{ value: LoaderStyle; label: string }> = [
{ value: 'dots', label: 'Dots' },
{ value: 'braille-claw', label: 'Hermes' },
{ value: 'braille-hermes', label: 'Hermes' },
{ value: 'braille-orbit', label: 'Orbit' },
{ value: 'braille-breathe', label: 'Breathe' },
{ value: 'braille-pulse', label: 'Pulse' },
@@ -733,7 +733,7 @@ function _LoaderContent() {
]
function getPreset(s: LoaderStyle): BrailleSpinnerPreset | null {
const m: Record<string, BrailleSpinnerPreset> = {
'braille-claw': 'claw',
'braille-hermes': 'hermes',
'braille-orbit': 'orbit',
'braille-breathe': 'breathe',
'braille-pulse': 'pulse',

View File

@@ -60,7 +60,7 @@ export function DebugPanel({
{isLoading ? (
<div className="flex items-center gap-2 rounded-lg border border-primary-700/50 bg-primary-900/40 px-3 py-2 text-sm text-primary-300">
<BrailleSpinner
preset="claw"
preset="hermes"
size={18}
speed={100}
className="text-primary-400"

View File

@@ -58,14 +58,14 @@ const PRESETS: Record<string, string[]> = {
braille(D2, D5),
],
// Claw grabbing motion 🦀
// Hermes caduceus motion 🦀
// Open pincer → closing → gripped → releasing
claw: [
hermes: [
// Open wide - two "arms" spread
braille(D1, D4), // tips open
braille(D1, D2, D4, D5), // arms extending down
braille(D1, D2, D3, D4, D5, D6), // full arms open
braille(D1, D2, D3, D7, D4, D5, D6, D8), // arms + base (fully open claw)
braille(D1, D2, D3, D7, D4, D5, D6, D8), // arms + base (animation frame)
// Closing inward
braille(D2, D3, D7, D5, D6, D8), // tips retract, mid closes
braille(D3, D7, D6, D8), // closing more
@@ -122,7 +122,7 @@ type BrailleSpinnerProps = {
}
function BrailleSpinnerComponent({
preset = 'claw',
preset = 'hermes',
size,
color,
speed = 100,
@@ -132,7 +132,7 @@ function BrailleSpinnerComponent({
const [frame, setFrame] = useState(0)
const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null)
const frames = PRESETS[preset] ?? PRESETS.claw!
const frames = PRESETS[preset] ?? PRESETS.hermes!
useEffect(() => {
intervalRef.current = setInterval(() => {
@@ -168,7 +168,7 @@ export { BrailleSpinner, PRESETS as BRAILLE_PRESETS }
export type { BrailleSpinnerPreset, BrailleSpinnerProps }
// Usage:
// <BrailleSpinner /> — default claw animation
// <BrailleSpinner /> — default hermes animation
// <BrailleSpinner preset="braille" /> — classic rotating
// <BrailleSpinner preset="orbit" size={24} /> — orbiting dot, 24px
// <BrailleSpinner preset="claw" color="var(--color-primary-500)" speed={120} />
// <BrailleSpinner preset="hermes" color="var(--color-primary-500)" speed={120} />

View File

@@ -5,7 +5,7 @@ import { persist } from 'zustand/middleware'
export type ThemeMode = 'system' | 'light' | 'dark'
export type LoaderStyle =
| 'dots'
| 'braille-claw'
| 'braille-hermes'
| 'braille-orbit'
| 'braille-breathe'
| 'braille-pulse'

View File

@@ -58,7 +58,6 @@ const FEATURED_SKILLS: Array<{ id: string; group: string }> = [
{ id: 'atomtanstudio/craft-do', group: 'Most Popular' },
{ id: 'bro3886/gtasks-cli', group: 'New This Week' },
{ id: 'vvardhan14/pokerpal', group: 'New This Week' },
{ id: 'okoddcat/clawops', group: 'Developer Tools' },
{
id: 'veeramanikandanr48/docker-containerization',
group: 'Developer Tools',

View File

@@ -780,7 +780,7 @@ type LoaderStyleOption = { value: LoaderStyle; label: string }
const LOADER_STYLES: LoaderStyleOption[] = [
{ value: 'dots', label: 'Dots' },
{ value: 'braille-claw', label: 'Claw' },
{ value: 'braille-hermes', label: 'Hermes' },
{ value: 'braille-orbit', label: 'Orbit' },
{ value: 'braille-breathe', label: 'Breathe' },
{ value: 'braille-pulse', label: 'Pulse' },
@@ -791,7 +791,7 @@ const LOADER_STYLES: LoaderStyleOption[] = [
function getPreset(style: LoaderStyle): BrailleSpinnerPreset | null {
const map: Record<string, BrailleSpinnerPreset> = {
'braille-claw': 'claw',
'braille-hermes': 'hermes',
'braille-orbit': 'orbit',
'braille-breathe': 'breathe',
'braille-pulse': 'pulse',