mirror of
https://github.com/iib0011/omni-tools.git
synced 2025-12-29 16:16:02 +00:00
feat: add internationalization support
This commit is contained in:
@@ -9,6 +9,7 @@ import { GetGroupsType } from '@components/options/ToolOptions';
|
||||
import { Box } from '@mui/material';
|
||||
import SimpleRadio from '@components/options/SimpleRadio';
|
||||
import { InitialValuesType } from './types';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues: InitialValuesType = {
|
||||
mode: 'encode'
|
||||
@@ -33,6 +34,7 @@ const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
];
|
||||
|
||||
export default function Base64({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -45,18 +47,18 @@ export default function Base64({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Base64 Options',
|
||||
title: t('string.base64.optionsTitle'),
|
||||
component: (
|
||||
<Box>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('mode', 'encode')}
|
||||
checked={values.mode === 'encode'}
|
||||
title={'Base64 Encode'}
|
||||
title={t('string.base64.encode')}
|
||||
/>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('mode', 'decode')}
|
||||
checked={values.mode === 'decode'}
|
||||
title={'Base64 Decode'}
|
||||
title={t('string.base64.decode')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
@@ -67,15 +69,20 @@ export default function Base64({ title }: ToolComponentProps) {
|
||||
<ToolContent
|
||||
title={title}
|
||||
inputComponent={
|
||||
<ToolTextInput title="Input Data" value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.base64.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('string.base64.resultTitle')} value={result} />
|
||||
}
|
||||
resultComponent={<ToolTextResult title="Result" value={result} />}
|
||||
initialValues={initialValues}
|
||||
getGroups={getGroups}
|
||||
toolInfo={{
|
||||
title: 'What is Base64?',
|
||||
description:
|
||||
'Base64 is an encoding scheme that represents data in an ASCII string format by translating it into a radix-64 representation. Although it can be used to encode strings, it is commonly used to encode binary data for transmission over media that are designed to deal with textual data.'
|
||||
title: t('string.base64.toolInfo.title'),
|
||||
description: t('string.base64.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
input={input}
|
||||
|
||||
@@ -9,5 +9,10 @@ export const tool = defineTool('string', {
|
||||
'A simple tool to encode or decode data using Base64, which is commonly used in web applications.',
|
||||
shortDescription: 'Encode or decode data using Base64.',
|
||||
keywords: ['base64'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.base64.name',
|
||||
description: 'string.base64.description',
|
||||
shortDescription: 'string.base64.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -12,5 +12,11 @@ export const tool = defineTool('string', {
|
||||
longDescription:
|
||||
'With this online tool, you can censor certain words in any text. You can specify a list of unwanted words (such as swear words or secret words) and the program will replace them with alternative words and create a safe-to-read text. The words can be specified in a multi-line text field in the options by entering one word per line.',
|
||||
keywords: ['text', 'censor', 'words', 'characters'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.censor.name',
|
||||
description: 'string.censor.description',
|
||||
shortDescription: 'string.censor.shortDescription',
|
||||
longDescription: 'string.censor.longDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -12,5 +12,10 @@ export const tool = defineTool('string', {
|
||||
longDescription:
|
||||
'This tool creates a palindrome from the given string. It does it by generating a copy of the string, reversing it, and appending it at the end of the original string. This method creates a palindrome with the last character duplicated twice. There is also another way to do it, which deletes the first letter of the reversed copy. In this case, when the string and the copy are joined together, you also get a palindrome but without the repeating last character. You can compare the two types of palindromes by switching between them in the options. You can also enable the multi-line mode that will create palindromes of every string on every line. Stringabulous!',
|
||||
keywords: ['create', 'palindrome'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.createPalindrome.name',
|
||||
description: 'string.createPalindrome.description',
|
||||
shortDescription: 'string.createPalindrome.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -7,8 +7,13 @@ export const tool = defineTool('string', {
|
||||
path: 'extract-substring',
|
||||
icon: 'material-symbols-light:content-cut',
|
||||
description:
|
||||
"World's simplest browser-based utility for extracting substrings from text. Easily extract specific portions of text by specifying start position and length. Perfect for parsing data, isolating specific parts of text, or data extraction tasks. Supports multi-line text processing and character-level precision.",
|
||||
shortDescription: 'Extract specific portions of text by position and length',
|
||||
"World's simplest browser-based utility for extracting substrings from text. Input your text and specify start and end positions to extract the desired portion. Perfect for data processing, text analysis, or extracting specific content from larger text blocks.",
|
||||
shortDescription: 'Extract a portion of text between specified positions',
|
||||
keywords: ['extract', 'substring'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.extractSubstring.name',
|
||||
description: 'string.extractSubstring.description',
|
||||
shortDescription: 'string.extractSubstring.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
196
src/pages/tools/string/i18n/en.json
Normal file
196
src/pages/tools/string/i18n/en.json
Normal file
@@ -0,0 +1,196 @@
|
||||
{
|
||||
"uppercase": {
|
||||
"title": "Convert to Uppercase",
|
||||
"description": "Convert text to uppercase letters.",
|
||||
"inputTitle": "Input text",
|
||||
"resultTitle": "Uppercase text"
|
||||
},
|
||||
"reverse": {
|
||||
"title": "Reverse Text",
|
||||
"description": "Reverse the order of characters in text.",
|
||||
"inputTitle": "Input text",
|
||||
"resultTitle": "Reversed text",
|
||||
"processMultiLine": "Process as multi-line text (reverse each line separately)",
|
||||
"skipEmptyLines": "Skip empty lines",
|
||||
"trimWhitespace": "Trim whitespace from lines"
|
||||
},
|
||||
"base64": {
|
||||
"title": "Base64 Encoder/Decoder",
|
||||
"description": "Encode or decode text using Base64 encoding.",
|
||||
"inputTitle": "Input Data",
|
||||
"resultTitle": "Result",
|
||||
"optionsTitle": "Base64 Options",
|
||||
"encode": "Base64 Encode",
|
||||
"decode": "Base64 Decode",
|
||||
"toolInfo": {
|
||||
"title": "What is Base64?",
|
||||
"description": "Base64 is an encoding scheme that represents data in an ASCII string format by translating it into a radix-64 representation. Although it can be used to encode strings, it is commonly used to encode binary data for transmission over media that are designed to deal with textual data."
|
||||
}
|
||||
},
|
||||
"truncate": {
|
||||
"title": "Truncate Text",
|
||||
"description": "Shorten text to a specified length.",
|
||||
"inputTitle": "Input text",
|
||||
"resultTitle": "Truncated text",
|
||||
"truncationSide": "Truncation Side",
|
||||
"rightSideTruncation": "Right-side Truncation",
|
||||
"rightSideDescription": "Remove characters from the end of the text.",
|
||||
"leftSideTruncation": "Left-side Truncation",
|
||||
"leftSideDescription": "Remove characters from the start of the text.",
|
||||
"lengthAndLines": "Length and Lines",
|
||||
"maxLengthDescription": "Number of characters to leave in the text.",
|
||||
"numberPlaceholder": "Number",
|
||||
"lineByLineTruncating": "Line-by-line Truncating",
|
||||
"lineByLineDescription": "Truncate each line separately.",
|
||||
"suffixAndAffix": "Suffix and Affix",
|
||||
"addTruncationIndicator": "Add Truncation Indicator",
|
||||
"indicatorDescription": "Characters to add at the end (or start) of the text. Note: They count towards the length.",
|
||||
"charactersPlaceholder": "Characters",
|
||||
"toolInfo": {
|
||||
"title": "Truncate text",
|
||||
"description": "Load your text in the input form on the left and you will automatically get truncated text on the right."
|
||||
}
|
||||
},
|
||||
"quote": {
|
||||
"title": "Text Quoter",
|
||||
"description": "Add quotes around text with customizable options.",
|
||||
"inputTitle": "Input Text",
|
||||
"resultTitle": "Quoted Text",
|
||||
"quoteOptions": "Quote Options",
|
||||
"leftQuoteDescription": "Left quote character(s)",
|
||||
"rightQuoteDescription": "Right quote character(s)",
|
||||
"allowDoubleQuotation": "Allow double quotation",
|
||||
"quoteEmptyLines": "Quote empty lines",
|
||||
"processAsMultiLine": "Process as multi-line text",
|
||||
"toolInfo": {
|
||||
"title": "Text Quoter",
|
||||
"description": "This tool allows you to add quotes around text. You can choose different quote characters, handle multi-line text, and control how empty lines are processed. It's useful for preparing text for programming, formatting data, or creating stylized text."
|
||||
}
|
||||
},
|
||||
"split": {
|
||||
"title": "Split Text",
|
||||
"description": "Split text into parts based on various criteria.",
|
||||
"resultTitle": "Text pieces",
|
||||
"splitSeparatorOptions": "Split separator options",
|
||||
"symbolTitle": "Use a Symbol for Splitting",
|
||||
"symbolDescription": "Character that will be used to break text into parts. (Space by default.)",
|
||||
"regexTitle": "Use a Regex for Splitting",
|
||||
"regexDescription": "Regular expression that will be used to break text into parts. (Multiple spaces by default.)",
|
||||
"lengthTitle": "Use Length for Splitting",
|
||||
"lengthDescription": "Number of symbols that will be put in each output chunk.",
|
||||
"chunksTitle": "Use a Number of Chunks",
|
||||
"chunksDescription": "Number of chunks of equal length in the output.",
|
||||
"outputSeparatorOptions": "Output separator options",
|
||||
"outputSeparatorDescription": "Character that will be put between the split chunks. (It's newline \"\\n\" by default.)",
|
||||
"charBeforeChunkDescription": "Character before each chunk",
|
||||
"charAfterChunkDescription": "Character after each chunk"
|
||||
},
|
||||
"join": {
|
||||
"title": "Join Text",
|
||||
"description": "Join text pieces together with customizable separators.",
|
||||
"inputTitle": "Text Pieces",
|
||||
"resultTitle": "Joined Text",
|
||||
"textMergedOptions": "Text Merged Options",
|
||||
"joinCharacterPlaceholder": "Join Character",
|
||||
"joinCharacterDescription": "Symbol that connects broken pieces of text. (Space by default.)",
|
||||
"blankLinesAndTrailingSpaces": "Blank Lines and Trailing Spaces",
|
||||
"deleteBlankTitle": "Delete Blank Lines",
|
||||
"deleteBlankDescription": "Delete lines that don't have text symbols.",
|
||||
"deleteTrailingTitle": "Delete Trailing Spaces",
|
||||
"deleteTrailingDescription": "Remove spaces and tabs at the end of the lines.",
|
||||
"toolInfo": {
|
||||
"title": "What Is a Text Joiner?",
|
||||
"description": "With this tool you can join parts of the text together. It takes a list of text values, separated by newlines, and merges them together. You can set the character that will be placed between the parts of the combined text. Also, you can ignore all empty lines and remove spaces and tabs at the end of all lines. Textabulous!"
|
||||
}
|
||||
},
|
||||
"rotate": {
|
||||
"title": "Rotate Text",
|
||||
"description": "Rotate characters in text by specified positions.",
|
||||
"inputTitle": "Input Text",
|
||||
"resultTitle": "Rotated Text",
|
||||
"rotationOptions": "Rotation Options",
|
||||
"stepDescription": "Number of positions to rotate",
|
||||
"rotateRight": "Rotate Right",
|
||||
"rotateLeft": "Rotate Left",
|
||||
"processAsMultiLine": "Process as multi-line text (rotate each line separately)",
|
||||
"toolInfo": {
|
||||
"title": "String Rotation",
|
||||
"description": "This tool allows you to rotate characters in a string by a specified number of positions. You can rotate to the left or right, and process multi-line text by rotating each line separately. String rotation is useful for simple text transformations, creating patterns, or implementing basic encryption techniques."
|
||||
}
|
||||
},
|
||||
"repeat": {
|
||||
"title": "Repeat Text",
|
||||
"description": "Repeat text multiple times with customizable separators.",
|
||||
"inputTitle": "Input text",
|
||||
"resultTitle": "Repeated text",
|
||||
"textRepetitions": "Text Repetitions",
|
||||
"repeatAmountDescription": "Number of repetitions.",
|
||||
"numberPlaceholder": "Number",
|
||||
"repetitionsDelimiter": "Repetitions Delimiter",
|
||||
"delimiterDescription": "Delimiter for output copies.",
|
||||
"delimiterPlaceholder": "Delimiter",
|
||||
"toolInfo": {
|
||||
"title": "Repeat text",
|
||||
"description": "This tool allows you to repeat a given text multiple times with an optional separator."
|
||||
}
|
||||
},
|
||||
"rot13": {
|
||||
"title": "ROT13 Encoder/Decoder",
|
||||
"description": "Encode or decode text using ROT13 cipher.",
|
||||
"inputTitle": "Input Text",
|
||||
"resultTitle": "ROT13 Result",
|
||||
"toolInfo": {
|
||||
"title": "What Is ROT13?",
|
||||
"description": "ROT13 (rotate by 13 places) is a simple letter substitution cipher that replaces a letter with the 13th letter after it in the alphabet. ROT13 is a special case of the Caesar cipher which was developed in ancient Rome. Because there are 26 letters in the English alphabet, ROT13 is its own inverse; that is, to undo ROT13, the same algorithm is applied, so the same action can be used for encoding and decoding."
|
||||
}
|
||||
},
|
||||
"toMorse": {
|
||||
"title": "To Morse",
|
||||
"description": "Convert text to Morse code.",
|
||||
"resultTitle": "Morse code",
|
||||
"shortSignal": "Short Signal",
|
||||
"dotSymbolDescription": "Symbol that will correspond to the dot in Morse code.",
|
||||
"longSignal": "Long Signal",
|
||||
"dashSymbolDescription": "Symbol that will correspond to the dash in Morse code."
|
||||
},
|
||||
"statistic": {
|
||||
"title": "Text Statistics",
|
||||
"description": "Analyze text and generate comprehensive statistics.",
|
||||
"inputTitle": "Input text",
|
||||
"resultTitle": "Text Statistics",
|
||||
"delimitersOptions": "Delimiters Options",
|
||||
"sentenceDelimitersPlaceholder": "e.g. ., !, ?, ...",
|
||||
"sentenceDelimitersDescription": "Enter custom characters used to delimit sentences in your language (separated by comma) or leave it blank for default.",
|
||||
"wordDelimitersPlaceholder": "eg. \\s.,;:!?\"«»()…",
|
||||
"wordDelimitersDescription": "Enter custom Regex to count Words or leave it blank for default.",
|
||||
"statisticsOptions": "Statistics Options",
|
||||
"wordFrequencyAnalysis": "Word Frequency Analysis",
|
||||
"wordFrequencyAnalysisDescription": "Count how often each word appears in the text",
|
||||
"characterFrequencyAnalysis": "Character Frequency Analysis",
|
||||
"characterFrequencyAnalysisDescription": "Count how often each character appears in the text",
|
||||
"includeEmptyLines": "Include Empty Lines",
|
||||
"includeEmptyLinesDescription": "Include blank lines when counting lines",
|
||||
"toolInfo": {
|
||||
"title": "What is a {{title}}?",
|
||||
"description": "This tool allows you to analyze text and generate comprehensive statistics including character count, word count, line count, and frequency analysis of characters and words."
|
||||
}
|
||||
},
|
||||
"textReplacer": {
|
||||
"title": "Text Replacer",
|
||||
"description": "Replace text patterns with new content.",
|
||||
"inputTitle": "Text to replace",
|
||||
"resultTitle": "Text with replacements",
|
||||
"searchText": "Search text",
|
||||
"findPatternInText": "Find This Pattern in Text",
|
||||
"searchPatternDescription": "Enter the text pattern that you want to replace.",
|
||||
"findPatternUsingRegexp": "Find a Pattern Using a RegExp",
|
||||
"regexpDescription": "Enter the regular expression that you want to replace.",
|
||||
"replaceText": "Replace Text",
|
||||
"replacePatternDescription": "Enter the pattern to use for replacement.",
|
||||
"newTextPlaceholder": "New text",
|
||||
"toolInfo": {
|
||||
"title": "Text Replacer",
|
||||
"description": "Easily replace specific text in your content with this simple, browser-based tool. Just input your text, set the text you want to replace and the replacement value, and instantly get the updated version."
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -9,6 +9,7 @@ import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {
|
||||
joinCharacter: '',
|
||||
@@ -107,6 +108,7 @@ s
|
||||
];
|
||||
|
||||
export default function JoinText({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
const compute = (optionsValues: InitialValuesType, input: any) => {
|
||||
@@ -119,25 +121,25 @@ export default function JoinText({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Text Merged Options',
|
||||
title: t('string.join.textMergedOptions'),
|
||||
component: (
|
||||
<TextFieldWithDesc
|
||||
placeholder={mergeOptions.placeholder}
|
||||
placeholder={t('string.join.joinCharacterPlaceholder')}
|
||||
value={values['joinCharacter']}
|
||||
onOwnChange={(value) => updateField(mergeOptions.accessor, value)}
|
||||
description={mergeOptions.description}
|
||||
description={t('string.join.joinCharacterDescription')}
|
||||
/>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Blank Lines and Trailing Spaces',
|
||||
title: t('string.join.blankLinesAndTrailingSpaces'),
|
||||
component: blankTrailingOptions.map((option) => (
|
||||
<CheckboxWithDesc
|
||||
key={option.accessor}
|
||||
title={option.title}
|
||||
title={t(`string.join.${option.accessor}Title`)}
|
||||
checked={!!values[option.accessor]}
|
||||
onChange={(value) => updateField(option.accessor, value)}
|
||||
description={option.description}
|
||||
description={t(`string.join.${option.accessor}Description`)}
|
||||
/>
|
||||
))
|
||||
}
|
||||
@@ -151,17 +153,18 @@ export default function JoinText({ title }: ToolComponentProps) {
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput
|
||||
title={'Text Pieces'}
|
||||
title={t('string.join.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={<ToolTextResult title={'Joined Text'} value={result} />}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('string.join.resultTitle')} value={result} />
|
||||
}
|
||||
getGroups={getGroups}
|
||||
toolInfo={{
|
||||
title: 'What Is a Text Joiner?',
|
||||
description:
|
||||
'With this tool you can join parts of the text together. It takes a list of text values, separated by newlines, and merges them together. You can set the character that will be placed between the parts of the combined text. Also, you can ignore all empty lines and remove spaces and tabs at the end of all lines. Textabulous!'
|
||||
title: t('string.join.toolInfo.title'),
|
||||
description: t('string.join.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
|
||||
@@ -2,12 +2,17 @@ import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('string', {
|
||||
name: 'Join',
|
||||
path: 'join',
|
||||
name: 'Text Joiner',
|
||||
icon: 'tabler:arrows-join',
|
||||
icon: 'material-symbols-light:join',
|
||||
description:
|
||||
"World's Simplest Text Tool World's simplest browser-based utility for joining text. Load your text in the input form on the left and you'll automatically get merged text on the right. Powerful, free, and fast. Load text – get joined lines",
|
||||
shortDescription: 'Quickly merge texts',
|
||||
keywords: ['text', 'join'],
|
||||
component: lazy(() => import('./index'))
|
||||
"World's simplest browser-based utility for joining text elements. Input your text elements and specify a separator to combine them into a single string. Perfect for data processing, text manipulation, or creating formatted output from lists.",
|
||||
shortDescription: 'Join text elements with a specified separator',
|
||||
keywords: ['join'],
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.join.name',
|
||||
description: 'string.join.description',
|
||||
shortDescription: 'string.join.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -10,5 +10,10 @@ export const tool = defineTool('string', {
|
||||
"World's simplest browser-based utility for checking if text is a palindrome. Instantly verify if your text reads the same forward and backward. Perfect for word puzzles, linguistic analysis, or validating symmetrical text patterns. Supports various delimiters and multi-word palindrome detection.",
|
||||
shortDescription: 'Check if text reads the same forward and backward',
|
||||
keywords: ['palindrome'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.palindrome.name',
|
||||
description: 'string.palindrome.description',
|
||||
shortDescription: 'string.palindrome.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,6 +9,7 @@ import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { GetGroupsType } from '@components/options/ToolOptions';
|
||||
import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
interface InitialValuesType {
|
||||
leftQuote: string;
|
||||
@@ -70,6 +71,7 @@ const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
];
|
||||
|
||||
export default function Quote({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -93,33 +95,33 @@ export default function Quote({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Quote Options',
|
||||
title: t('string.quote.quoteOptions'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
value={values.leftQuote}
|
||||
onOwnChange={(val) => updateField('leftQuote', val)}
|
||||
description={'Left quote character(s)'}
|
||||
description={t('string.quote.leftQuoteDescription')}
|
||||
/>
|
||||
<TextFieldWithDesc
|
||||
value={values.rightQuote}
|
||||
onOwnChange={(val) => updateField('rightQuote', val)}
|
||||
description={'Right quote character(s)'}
|
||||
description={t('string.quote.rightQuoteDescription')}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
checked={values.doubleQuotation}
|
||||
onChange={(checked) => updateField('doubleQuotation', checked)}
|
||||
title={'Allow double quotation'}
|
||||
title={t('string.quote.allowDoubleQuotation')}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
checked={values.emptyQuoting}
|
||||
onChange={(checked) => updateField('emptyQuoting', checked)}
|
||||
title={'Quote empty lines'}
|
||||
title={t('string.quote.quoteEmptyLines')}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
checked={values.multiLine}
|
||||
onChange={(checked) => updateField('multiLine', checked)}
|
||||
title={'Process as multi-line text'}
|
||||
title={t('string.quote.processAsMultiLine')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
@@ -130,15 +132,20 @@ export default function Quote({ title }: ToolComponentProps) {
|
||||
<ToolContent
|
||||
title={title}
|
||||
inputComponent={
|
||||
<ToolTextInput title="Input Text" value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.quote.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('string.quote.resultTitle')} value={result} />
|
||||
}
|
||||
resultComponent={<ToolTextResult title="Quoted Text" value={result} />}
|
||||
initialValues={initialValues}
|
||||
getGroups={getGroups}
|
||||
toolInfo={{
|
||||
title: 'Text Quoter',
|
||||
description:
|
||||
"This tool allows you to add quotes around text. You can choose different quote characters, handle multi-line text, and control how empty lines are processed. It's useful for preparing text for programming, formatting data, or creating stylized text."
|
||||
title: t('string.quote.toolInfo.title'),
|
||||
description: t('string.quote.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
input={input}
|
||||
|
||||
@@ -5,10 +5,15 @@ import { lazy } from 'react';
|
||||
export const tool = defineTool('string', {
|
||||
name: 'Quote',
|
||||
path: 'quote',
|
||||
icon: 'proicons:quote',
|
||||
icon: 'material-symbols-light:format-quote',
|
||||
description:
|
||||
'A tool to add quotation marks or custom characters around text. Perfect for formatting strings for code, citations, or stylistic purposes.',
|
||||
shortDescription: 'Add quotes around text easily.',
|
||||
"World's simplest browser-based utility for adding quotes to text. Input your text and instantly add various quote styles around it. Perfect for formatting text, creating citations, or adding emphasis to specific content.",
|
||||
shortDescription: 'Add quotes around text with various styles',
|
||||
keywords: ['quote'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.quote.name',
|
||||
description: 'string.quote.description',
|
||||
shortDescription: 'string.quote.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -5,10 +5,15 @@ import { lazy } from 'react';
|
||||
export const tool = defineTool('string', {
|
||||
name: 'Randomize case',
|
||||
path: 'randomize-case',
|
||||
icon: 'material-symbols-light:format-textdirection-l-to-r',
|
||||
icon: 'material-symbols-light:shuffle',
|
||||
description:
|
||||
"World's simplest browser-based utility for randomizing the case of text. Just paste your text and get it instantly transformed with random uppercase and lowercase letters. Perfect for creating playful text styles, meme text, or simulating chaotic writing.",
|
||||
shortDescription: 'Convert text to random uppercase and lowercase letters',
|
||||
"World's simplest browser-based utility for randomizing text case. Input your text and instantly transform it with random upper and lower case letters. Perfect for creating unique text effects, testing case sensitivity, or generating varied text patterns.",
|
||||
shortDescription: 'Randomize the case of letters in text',
|
||||
keywords: ['randomize', 'case'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.randomizeCase.name',
|
||||
description: 'string.randomizeCase.description',
|
||||
shortDescription: 'string.randomizeCase.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,5 +9,10 @@ export const tool = defineTool('string', {
|
||||
"Load your text in the input form on the left and you'll instantly get text with no duplicate lines in the output area. Powerful, free, and fast. Load text lines – get unique text lines",
|
||||
shortDescription: 'Quickly delete all repeated lines from text',
|
||||
keywords: ['remove', 'duplicate', 'lines'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.removeDuplicateLines.name',
|
||||
description: 'string.removeDuplicateLines.description',
|
||||
shortDescription: 'string.removeDuplicateLines.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,6 +9,7 @@ import { initialValues, InitialValuesType } from './initialValues';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
{
|
||||
@@ -48,6 +49,7 @@ const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
];
|
||||
|
||||
export default function Replacer({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -60,12 +62,12 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Text Repetitions',
|
||||
title: t('string.repeat.textRepetitions'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
description={'Number of repetitions.'}
|
||||
placeholder="Number"
|
||||
description={t('string.repeat.repeatAmountDescription')}
|
||||
placeholder={t('string.repeat.numberPlaceholder')}
|
||||
value={values.repeatAmount}
|
||||
onOwnChange={(val) => updateField('repeatAmount', val)}
|
||||
type={'number'}
|
||||
@@ -74,12 +76,12 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Repetitions Delimiter',
|
||||
title: t('string.repeat.repetitionsDelimiter'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
description={'Delimiter for output copies.'}
|
||||
placeholder="Delimiter"
|
||||
description={t('string.repeat.delimiterDescription')}
|
||||
placeholder={t('string.repeat.delimiterPlaceholder')}
|
||||
value={values.delimiter}
|
||||
onOwnChange={(val) => updateField('delimiter', val)}
|
||||
type={'text'}
|
||||
@@ -98,15 +100,18 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput title={'Input text'} value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.repeat.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={'Repeated text'} value={result} />
|
||||
<ToolTextResult title={t('string.repeat.resultTitle')} value={result} />
|
||||
}
|
||||
toolInfo={{
|
||||
title: 'Repeat text',
|
||||
description:
|
||||
'This tool allows you to repeat a given text multiple times with an optional separator.'
|
||||
title: t('string.repeat.toolInfo.title'),
|
||||
description: t('string.repeat.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
|
||||
@@ -9,5 +9,10 @@ export const tool = defineTool('string', {
|
||||
description:
|
||||
'This tool allows you to repeat a given text multiple times with an optional separator.',
|
||||
keywords: ['text', 'repeat'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.repeat.name',
|
||||
description: 'string.repeat.description',
|
||||
shortDescription: 'string.repeat.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -12,6 +12,7 @@ import ToolExamples, {
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { FormikProps } from 'formik';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {
|
||||
multiLine: true,
|
||||
@@ -58,6 +59,7 @@ const exampleCards: CardExampleType<typeof initialValues>[] = [
|
||||
];
|
||||
|
||||
export default function Reverse({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -74,27 +76,27 @@ export default function Reverse({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Reversal options',
|
||||
title: t('string.reverse.reversalOptions'),
|
||||
component: [
|
||||
<CheckboxWithDesc
|
||||
key="multiLine"
|
||||
checked={values.multiLine}
|
||||
title="Process multi-line text"
|
||||
description="Each line will be reversed independently"
|
||||
title={t('string.reverse.processMultiLine')}
|
||||
description={t('string.reverse.processMultiLineDescription')}
|
||||
onChange={(val) => updateField('multiLine', val)}
|
||||
/>,
|
||||
<CheckboxWithDesc
|
||||
key="emptyItems"
|
||||
checked={values.emptyItems}
|
||||
title="Skip empty lines"
|
||||
description="Empty lines will be removed from the output"
|
||||
title={t('string.reverse.skipEmptyLines')}
|
||||
description={t('string.reverse.skipEmptyLinesDescription')}
|
||||
onChange={(val) => updateField('emptyItems', val)}
|
||||
/>,
|
||||
<CheckboxWithDesc
|
||||
key="trim"
|
||||
checked={values.trim}
|
||||
title="Trim whitespace"
|
||||
description="Remove leading and trailing whitespace from each line"
|
||||
title={t('string.reverse.trimWhitespace')}
|
||||
description={t('string.reverse.trimWhitespaceDescription')}
|
||||
onChange={(val) => updateField('trim', val)}
|
||||
/>
|
||||
]
|
||||
@@ -109,9 +111,18 @@ export default function Reverse({ title }: ToolComponentProps) {
|
||||
compute={computeExternal}
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
|
||||
inputComponent={
|
||||
<ToolTextInput
|
||||
title={t('string.reverse.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={'Reversed text'} value={result} />
|
||||
<ToolTextResult
|
||||
title={t('string.reverse.resultTitle')}
|
||||
value={result}
|
||||
/>
|
||||
}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
|
||||
@@ -9,5 +9,10 @@ export const tool = defineTool('string', {
|
||||
"World's simplest browser-based utility for reversing text. Input any text and get it instantly reversed, character by character. Perfect for creating mirror text, analyzing palindromes, or playing with text patterns. Preserves spaces and special characters while reversing.",
|
||||
shortDescription: 'Reverse any text character by character',
|
||||
keywords: ['reverse'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.reverse.name',
|
||||
description: 'string.reverse.description',
|
||||
shortDescription: 'string.reverse.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -5,6 +5,7 @@ import ToolTextResult from '@components/result/ToolTextResult';
|
||||
import { rot13 } from './service';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
type InitialValuesType = Record<string, never>;
|
||||
|
||||
@@ -30,6 +31,7 @@ const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
];
|
||||
|
||||
export default function Rot13({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -41,15 +43,20 @@ export default function Rot13({ title }: ToolComponentProps) {
|
||||
<ToolContent
|
||||
title={title}
|
||||
inputComponent={
|
||||
<ToolTextInput title="Input Text" value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.rot13.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('string.rot13.resultTitle')} value={result} />
|
||||
}
|
||||
resultComponent={<ToolTextResult title="ROT13 Result" value={result} />}
|
||||
initialValues={initialValues}
|
||||
getGroups={null}
|
||||
toolInfo={{
|
||||
title: 'What Is ROT13?',
|
||||
description:
|
||||
'ROT13 (rotate by 13 places) is a simple letter substitution cipher that replaces a letter with the 13th letter after it in the alphabet. ROT13 is a special case of the Caesar cipher which was developed in ancient Rome. Because there are 26 letters in the English alphabet, ROT13 is its own inverse; that is, to undo ROT13, the same algorithm is applied, so the same action can be used for encoding and decoding.'
|
||||
title: t('string.rot13.toolInfo.title'),
|
||||
description: t('string.rot13.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
input={input}
|
||||
|
||||
@@ -10,6 +10,7 @@ import { GetGroupsType } from '@components/options/ToolOptions';
|
||||
import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
|
||||
import SimpleRadio from '@components/options/SimpleRadio';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
interface InitialValuesType {
|
||||
step: string;
|
||||
@@ -63,6 +64,7 @@ const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
];
|
||||
|
||||
export default function Rotate({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -79,29 +81,29 @@ export default function Rotate({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Rotation Options',
|
||||
title: t('string.rotate.rotationOptions'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
value={values.step}
|
||||
onOwnChange={(val) => updateField('step', val)}
|
||||
description={'Number of positions to rotate'}
|
||||
description={t('string.rotate.stepDescription')}
|
||||
type="number"
|
||||
/>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('direction', 'right')}
|
||||
checked={values.direction === 'right'}
|
||||
title={'Rotate Right'}
|
||||
title={t('string.rotate.rotateRight')}
|
||||
/>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('direction', 'left')}
|
||||
checked={values.direction === 'left'}
|
||||
title={'Rotate Left'}
|
||||
title={t('string.rotate.rotateLeft')}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
checked={values.multiLine}
|
||||
onChange={(checked) => updateField('multiLine', checked)}
|
||||
title={'Process as multi-line text (rotate each line separately)'}
|
||||
title={t('string.rotate.processAsMultiLine')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
@@ -112,15 +114,20 @@ export default function Rotate({ title }: ToolComponentProps) {
|
||||
<ToolContent
|
||||
title={title}
|
||||
inputComponent={
|
||||
<ToolTextInput title="Input Text" value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.rotate.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('string.rotate.resultTitle')} value={result} />
|
||||
}
|
||||
resultComponent={<ToolTextResult title="Rotated Text" value={result} />}
|
||||
initialValues={initialValues}
|
||||
getGroups={getGroups}
|
||||
toolInfo={{
|
||||
title: 'String Rotation',
|
||||
description:
|
||||
'This tool allows you to rotate characters in a string by a specified number of positions. You can rotate to the left or right, and process multi-line text by rotating each line separately. String rotation is useful for simple text transformations, creating patterns, or implementing basic encryption techniques.'
|
||||
title: t('string.rotate.toolInfo.title'),
|
||||
description: t('string.rotate.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
input={input}
|
||||
|
||||
@@ -11,6 +11,7 @@ import ToolExamples, {
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { FormikProps } from 'formik';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {
|
||||
splitSeparatorType: 'symbol' as SplitOperatorType,
|
||||
@@ -132,6 +133,7 @@ easy`,
|
||||
];
|
||||
|
||||
export default function SplitText({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -170,18 +172,20 @@ export default function SplitText({ title }: ToolComponentProps) {
|
||||
title={title}
|
||||
input={input}
|
||||
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
|
||||
resultComponent={<ToolTextResult title={'Text pieces'} value={result} />}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('string.split.resultTitle')} value={result} />
|
||||
}
|
||||
initialValues={initialValues}
|
||||
getGroups={({ values, updateField }) => [
|
||||
{
|
||||
title: 'Split separator options',
|
||||
title: t('string.split.splitSeparatorOptions'),
|
||||
component: splitOperators.map(({ title, description, type }) => (
|
||||
<RadioWithTextField
|
||||
key={type}
|
||||
checked={type === values.splitSeparatorType}
|
||||
title={title}
|
||||
title={t(`string.split.${type}Title`)}
|
||||
fieldName={'splitSeparatorType'}
|
||||
description={description}
|
||||
description={t(`string.split.${type}Description`)}
|
||||
value={values[`${type}Value`]}
|
||||
onRadioClick={() => updateField('splitSeparatorType', type)}
|
||||
onTextChange={(val) => updateField(`${type}Value`, val)}
|
||||
@@ -189,13 +193,13 @@ export default function SplitText({ title }: ToolComponentProps) {
|
||||
))
|
||||
},
|
||||
{
|
||||
title: 'Output separator options',
|
||||
title: t('string.split.outputSeparatorOptions'),
|
||||
component: outputOptions.map((option) => (
|
||||
<TextFieldWithDesc
|
||||
key={option.accessor}
|
||||
value={values[option.accessor]}
|
||||
onOwnChange={(value) => updateField(option.accessor, value)}
|
||||
description={option.description}
|
||||
description={t(`string.split.${option.accessor}Description`)}
|
||||
/>
|
||||
))
|
||||
}
|
||||
|
||||
@@ -2,13 +2,17 @@ import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('string', {
|
||||
name: 'Split',
|
||||
path: 'split',
|
||||
name: 'Text splitter',
|
||||
icon: 'material-symbols-light:arrow-split',
|
||||
icon: 'material-symbols-light:call-split',
|
||||
description:
|
||||
"World's simplest browser-based utility for splitting text. Load your text in the input form on the left and you'll automatically get pieces of this text on the right. Powerful, free, and fast. Load text – get chunks.",
|
||||
shortDescription: 'Quickly split a text',
|
||||
longDescription: 'Quickly split a text',
|
||||
keywords: ['text', 'split'],
|
||||
component: lazy(() => import('./index'))
|
||||
"World's simplest browser-based utility for splitting text. Input your text and specify a separator to split it into multiple parts. Perfect for data processing, text manipulation, or extracting specific content from larger text blocks.",
|
||||
shortDescription: 'Split text into multiple parts using a separator',
|
||||
keywords: ['split'],
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.split.name',
|
||||
description: 'string.split.description',
|
||||
shortDescription: 'string.split.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -10,6 +10,7 @@ import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues: InitialValuesType = {
|
||||
emptyLines: false,
|
||||
@@ -216,6 +217,7 @@ export default function Truncate({
|
||||
title,
|
||||
longDescription
|
||||
}: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -228,49 +230,47 @@ export default function Truncate({
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Delimiters Options',
|
||||
title: t('string.statistic.delimitersOptions'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
value={values.sentenceDelimiters}
|
||||
onOwnChange={(val) => updateField('sentenceDelimiters', val)}
|
||||
placeholder="e.g. ., !, ?, ..."
|
||||
description={
|
||||
'Enter custom characters used to delimit sentences in your language (separated by comma) or leave it blank for default.'
|
||||
}
|
||||
placeholder={t('string.statistic.sentenceDelimitersPlaceholder')}
|
||||
description={t('string.statistic.sentenceDelimitersDescription')}
|
||||
/>
|
||||
<TextFieldWithDesc
|
||||
value={values.wordDelimiters}
|
||||
onOwnChange={(val) => updateField('wordDelimiters', val)}
|
||||
placeholder="eg. \\s.,;:!?\”«»()…"
|
||||
description={
|
||||
'Enter custom Regex to count Words or leave it blank for default.'
|
||||
}
|
||||
placeholder={t('string.statistic.wordDelimitersPlaceholder')}
|
||||
description={t('string.statistic.wordDelimitersDescription')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Statistics Options',
|
||||
title: t('string.statistic.statisticsOptions'),
|
||||
component: (
|
||||
<Box>
|
||||
<CheckboxWithDesc
|
||||
checked={values.wordCount}
|
||||
onChange={(value) => updateField('wordCount', value)}
|
||||
title="Word Frequency Analysis"
|
||||
description="Count how often each word appears in the text"
|
||||
title={t('string.statistic.wordFrequencyAnalysis')}
|
||||
description={t('string.statistic.wordFrequencyAnalysisDescription')}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
checked={values.characterCount}
|
||||
onChange={(value) => updateField('characterCount', value)}
|
||||
title="Character Frequency Analysis"
|
||||
description="Count how often each character appears in the text"
|
||||
title={t('string.statistic.characterFrequencyAnalysis')}
|
||||
description={t(
|
||||
'string.statistic.characterFrequencyAnalysisDescription'
|
||||
)}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
checked={values.emptyLines}
|
||||
onChange={(value) => updateField('emptyLines', value)}
|
||||
title="Include Empty Lines"
|
||||
description="Include blank lines when counting lines"
|
||||
title={t('string.statistic.includeEmptyLines')}
|
||||
description={t('string.statistic.includeEmptyLinesDescription')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
@@ -286,12 +286,22 @@ export default function Truncate({
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput title={'Input text'} value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.statistic.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={'Text Statistics'} value={result} />
|
||||
<ToolTextResult
|
||||
title={t('string.statistic.resultTitle')}
|
||||
value={result}
|
||||
/>
|
||||
}
|
||||
toolInfo={{ title: `What is a ${title}?`, description: longDescription }}
|
||||
toolInfo={{
|
||||
title: t('string.statistic.toolInfo.title', { title }),
|
||||
description: longDescription
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -11,5 +11,11 @@ export const tool = defineTool('string', {
|
||||
longDescription:
|
||||
'This tool provides various statistics about the text you input, including the number of lines, words, and characters. You can also choose to include empty lines in the count. it can count words and characters based on custom delimiters, allowing for flexible text analysis. Additionally, it can provide frequency statistics for words and characters, helping you understand the distribution of terms in your text.',
|
||||
keywords: ['text', 'statistics', 'count', 'lines', 'words', 'characters'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.statistic.name',
|
||||
description: 'string.statistic.description',
|
||||
shortDescription: 'string.statistic.shortDescription',
|
||||
longDescription: 'string.statistic.longDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -10,6 +10,7 @@ import { initialValues, InitialValuesType } from './initialValues';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
{
|
||||
@@ -60,6 +61,7 @@ const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
];
|
||||
|
||||
export default function Replacer({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -72,16 +74,16 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Search text',
|
||||
title: t('string.textReplacer.searchText'),
|
||||
component: (
|
||||
<Box>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('mode', 'text')}
|
||||
checked={values.mode === 'text'}
|
||||
title={'Find This Pattern in Text'}
|
||||
title={t('string.textReplacer.findPatternInText')}
|
||||
/>
|
||||
<TextFieldWithDesc
|
||||
description={'Enter the text pattern that you want to replace.'}
|
||||
description={t('string.textReplacer.searchPatternDescription')}
|
||||
value={values.searchValue}
|
||||
onOwnChange={(val) => updateField('searchValue', val)}
|
||||
type={'text'}
|
||||
@@ -89,12 +91,10 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('mode', 'regexp')}
|
||||
checked={values.mode === 'regexp'}
|
||||
title={'Find a Pattern Using a RegExp'}
|
||||
title={t('string.textReplacer.findPatternUsingRegexp')}
|
||||
/>
|
||||
<TextFieldWithDesc
|
||||
description={
|
||||
'Enter the regular expression that you want to replace.'
|
||||
}
|
||||
description={t('string.textReplacer.regexpDescription')}
|
||||
value={values.searchRegexp}
|
||||
onOwnChange={(val) => updateField('searchRegexp', val)}
|
||||
type={'text'}
|
||||
@@ -103,12 +103,12 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Replace Text',
|
||||
title: t('string.textReplacer.replaceText'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
description={'Enter the pattern to use for replacement.'}
|
||||
placeholder={'New text'}
|
||||
description={t('string.textReplacer.replacePatternDescription')}
|
||||
placeholder={t('string.textReplacer.newTextPlaceholder')}
|
||||
value={values.replaceValue}
|
||||
onOwnChange={(val) => updateField('replaceValue', val)}
|
||||
type={'text'}
|
||||
@@ -128,18 +128,20 @@ export default function Replacer({ title }: ToolComponentProps) {
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput
|
||||
title="Text to replace"
|
||||
title={t('string.textReplacer.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={'Text with replacements'} value={result} />
|
||||
<ToolTextResult
|
||||
title={t('string.textReplacer.resultTitle')}
|
||||
value={result}
|
||||
/>
|
||||
}
|
||||
toolInfo={{
|
||||
title: 'Text Replacer',
|
||||
description:
|
||||
'Easily replace specific text in your content with this simple, browser-based tool. Just input your text, set the text you want to replace and the replacement value, and instantly get the updated version.'
|
||||
title: t('string.textReplacer.toolInfo.title'),
|
||||
description: t('string.textReplacer.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
|
||||
@@ -4,6 +4,7 @@ import ToolTextInput from '@components/input/ToolTextInput';
|
||||
import ToolTextResult from '@components/result/ToolTextResult';
|
||||
import { compute } from './service';
|
||||
import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {
|
||||
dotSymbol: '.',
|
||||
@@ -11,6 +12,7 @@ const initialValues = {
|
||||
};
|
||||
|
||||
export default function ToMorse() {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
const computeOptions = (optionsValues: typeof initialValues, input: any) => {
|
||||
@@ -20,33 +22,34 @@ export default function ToMorse() {
|
||||
|
||||
return (
|
||||
<ToolContent
|
||||
title="To Morse"
|
||||
title={t('string.toMorse.title')}
|
||||
initialValues={initialValues}
|
||||
compute={computeOptions}
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
|
||||
resultComponent={<ToolTextResult title={'Morse code'} value={result} />}
|
||||
resultComponent={
|
||||
<ToolTextResult
|
||||
title={t('string.toMorse.resultTitle')}
|
||||
value={result}
|
||||
/>
|
||||
}
|
||||
getGroups={({ values, updateField }) => [
|
||||
{
|
||||
title: 'Short Signal',
|
||||
title: t('string.toMorse.shortSignal'),
|
||||
component: (
|
||||
<TextFieldWithDesc
|
||||
description={
|
||||
'Symbol that will correspond to the dot in Morse code.'
|
||||
}
|
||||
description={t('string.toMorse.dotSymbolDescription')}
|
||||
value={values.dotSymbol}
|
||||
onOwnChange={(val) => updateField('dotSymbol', val)}
|
||||
/>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Long Signal',
|
||||
title: t('string.toMorse.longSignal'),
|
||||
component: (
|
||||
<TextFieldWithDesc
|
||||
description={
|
||||
'Symbol that will correspond to the dash in Morse code.'
|
||||
}
|
||||
description={t('string.toMorse.dashSymbolDescription')}
|
||||
value={values.dashSymbol}
|
||||
onOwnChange={(val) => updateField('dashSymbol', val)}
|
||||
/>
|
||||
|
||||
@@ -10,5 +10,10 @@ export const tool = defineTool('string', {
|
||||
"World's simplest browser-based utility for converting text to Morse code. Load your text in the input form on the left and you'll instantly get Morse code in the output area. Powerful, free, and fast. Load text – get Morse code.",
|
||||
shortDescription: 'Quickly encode text to morse',
|
||||
keywords: ['to', 'morse'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.toMorse.name',
|
||||
description: 'string.toMorse.description',
|
||||
shortDescription: 'string.toMorse.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -11,6 +11,7 @@ import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import SimpleRadio from '@components/options/SimpleRadio';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
{
|
||||
@@ -67,6 +68,7 @@ Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
|
||||
];
|
||||
|
||||
export default function Truncate({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -79,31 +81,31 @@ export default function Truncate({ title }: ToolComponentProps) {
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: 'Truncation Side',
|
||||
title: t('string.truncate.truncationSide'),
|
||||
component: (
|
||||
<Box>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('truncationSide', 'right')}
|
||||
checked={values.truncationSide === 'right'}
|
||||
title={'Right-side Truncation'}
|
||||
description={'Remove characters from the end of the text.'}
|
||||
title={t('string.truncate.rightSideTruncation')}
|
||||
description={t('string.truncate.rightSideDescription')}
|
||||
/>
|
||||
<SimpleRadio
|
||||
onClick={() => updateField('truncationSide', 'left')}
|
||||
checked={values.truncationSide === 'left'}
|
||||
title={'Left-side Truncation'}
|
||||
description={'Remove characters from the start of the text.'}
|
||||
title={t('string.truncate.leftSideTruncation')}
|
||||
description={t('string.truncate.leftSideDescription')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Length and Lines',
|
||||
title: t('string.truncate.lengthAndLines'),
|
||||
component: (
|
||||
<Box>
|
||||
<TextFieldWithDesc
|
||||
description={'Number of characters to leave in the text.'}
|
||||
placeholder="Number"
|
||||
description={t('string.truncate.maxLengthDescription')}
|
||||
placeholder={t('string.truncate.numberPlaceholder')}
|
||||
value={values.maxLength}
|
||||
onOwnChange={(val) => updateField('maxLength', val)}
|
||||
type={'number'}
|
||||
@@ -111,27 +113,25 @@ export default function Truncate({ title }: ToolComponentProps) {
|
||||
<CheckboxWithDesc
|
||||
onChange={(val) => updateField('lineByLine', val)}
|
||||
checked={values.lineByLine}
|
||||
title={'Line-by-line Truncating'}
|
||||
description={'Truncate each line separately.'}
|
||||
title={t('string.truncate.lineByLineTruncating')}
|
||||
description={t('string.truncate.lineByLineDescription')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: 'Suffix and Affix',
|
||||
title: t('string.truncate.suffixAndAffix'),
|
||||
component: (
|
||||
<Box>
|
||||
<CheckboxWithDesc
|
||||
onChange={(val) => updateField('addIndicator', val)}
|
||||
checked={values.addIndicator}
|
||||
title={'Add Truncation Indicator'}
|
||||
title={t('string.truncate.addTruncationIndicator')}
|
||||
description={''}
|
||||
/>
|
||||
<TextFieldWithDesc
|
||||
description={
|
||||
'Characters to add at the end (or start) of the text. Note: They count towards the length.'
|
||||
}
|
||||
placeholder="Characters"
|
||||
description={t('string.truncate.indicatorDescription')}
|
||||
placeholder={t('string.truncate.charactersPlaceholder')}
|
||||
value={values.indicator}
|
||||
onOwnChange={(val) => updateField('indicator', val)}
|
||||
type={'text'}
|
||||
@@ -150,15 +150,21 @@ export default function Truncate({ title }: ToolComponentProps) {
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput title={'Input text'} value={input} onChange={setInput} />
|
||||
<ToolTextInput
|
||||
title={t('string.truncate.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={'Truncated text'} value={result} />
|
||||
<ToolTextResult
|
||||
title={t('string.truncate.resultTitle')}
|
||||
value={result}
|
||||
/>
|
||||
}
|
||||
toolInfo={{
|
||||
title: 'Truncate text',
|
||||
description:
|
||||
'Load your text in the input form on the left and you will automatically get truncated text on the right.'
|
||||
title: t('string.truncate.toolInfo.title'),
|
||||
description: t('string.truncate.toolInfo.description')
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
|
||||
@@ -2,12 +2,17 @@ import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('string', {
|
||||
name: 'Truncate text',
|
||||
name: 'Truncate',
|
||||
path: 'truncate',
|
||||
shortDescription: 'Truncate your text easily',
|
||||
icon: 'material-symbols-light:short-text',
|
||||
icon: 'material-symbols-light:content-cut',
|
||||
description:
|
||||
'Load your text in the input form on the left and you will automatically get truncated text on the right.',
|
||||
keywords: ['text', 'truncate'],
|
||||
component: lazy(() => import('./index'))
|
||||
"World's simplest browser-based utility for truncating text. Input your text and specify the maximum length to cut it down. Perfect for data processing, text formatting, or limiting content length.",
|
||||
shortDescription: 'Truncate text to a specified length',
|
||||
keywords: ['truncate'],
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.truncate.name',
|
||||
description: 'string.truncate.description',
|
||||
shortDescription: 'string.truncate.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
@@ -5,6 +5,7 @@ import { UppercaseInput } from './service';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {};
|
||||
|
||||
@@ -35,6 +36,7 @@ const exampleCards: CardExampleType<typeof initialValues>[] = [
|
||||
];
|
||||
|
||||
export default function Uppercase({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation();
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
@@ -53,9 +55,18 @@ export default function Uppercase({ title }: ToolComponentProps) {
|
||||
compute={computeExternal}
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
|
||||
inputComponent={
|
||||
<ToolTextInput
|
||||
title={t('string.uppercase.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={'Uppercase text'} value={result} />
|
||||
<ToolTextResult
|
||||
title={t('string.uppercase.resultTitle')}
|
||||
value={result}
|
||||
/>
|
||||
}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
|
||||
@@ -4,10 +4,15 @@ import { lazy } from 'react';
|
||||
export const tool = defineTool('string', {
|
||||
name: 'Uppercase',
|
||||
path: 'uppercase',
|
||||
icon: 'material-symbols-light:text-fields',
|
||||
icon: 'material-symbols-light:format-textdirection-l-to-r',
|
||||
description:
|
||||
"World's simplest browser-based utility for converting text to uppercase. Just input your text and it will be automatically converted to all capital letters. Perfect for creating headlines, emphasizing text, or standardizing text format. Supports various text formats and preserves special characters.",
|
||||
shortDescription: 'Convert text to uppercase letters',
|
||||
"World's simplest browser-based utility for converting text to uppercase. Input your text and instantly get all characters in uppercase. Perfect for formatting, shouting, or emphasizing text.",
|
||||
shortDescription: 'Convert text to uppercase',
|
||||
keywords: ['uppercase'],
|
||||
component: lazy(() => import('./index'))
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string.uppercase.name',
|
||||
description: 'string.uppercase.description',
|
||||
shortDescription: 'string.uppercase.shortDescription'
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user