- When enabled, clicking the close button will minimize the app to the system tray instead of quitting. + When enabled, clicking the close button will minimize the app to the system tray instead + of quitting.
- item?.label || ''}
- selectedItem={BARCODE_STANDARDS.find((s) => s.value === standard)}
- onChange={handleStandardChange}
- size="sm"
- />
-
-
-
- item?.label || ''}
- selectedItem={BARCODE_SIZES.find((s) => s.value === size)}
- onChange={({ selectedItem }) => {
- setSize(selectedItem?.value || 256);
- setQrImage('');
- }}
- size="sm"
- />
-
+
+ item?.label || ''}
+ selectedItem={BARCODE_STANDARDS.find((s) => s.value === standard)}
+ onChange={handleStandardChange}
+ size="sm"
+ />
+
- {isQR && (
-
-
+ item?.label || ''}
+ selectedItem={QR_ERROR_LEVELS.find((l) => l.value === level)}
+ onChange={({ selectedItem }) => {
+ setLevel(selectedItem?.value || 'M');
+ setQrImage('');
+ }}
+ size="sm"
+ />
+
+ )}
+
+
+
+
+
+ {/* Output Pane */}
-
-
-
- {qrImage && (
-
- )}
-
-
-
- {loading ? (
- 
- ) : (
-
+
+
-
- )}
+ {isQR ? 'QR Code' : `${standard} Barcode`}
+
+ {qrImage && (
+
+ )}
+ {isQR ? 'QR code' : `${standard} barcode`} will appear here
-- Enter content and click Generate -
-
+ {loading ? (
+
+
+ )}
+ {isQR ? 'QR code' : `${standard} barcode`} will appear here
++ Enter content and click Generate +
+\n
\n\n',
+ sample:
+ '\n\n\n Hello World
\nThis is a paragraph.
\n\n
\n\n',
},
{
id: 'sql',
name: 'SQL',
supportsFilter: false,
- sample: 'SELECT u.id, u.name, o.order_date FROM users u JOIN orders o ON u.id = o.user_id WHERE u.active = 1 ORDER BY o.order_date DESC;',
+ sample:
+ 'SELECT u.id, u.name, o.order_date FROM users u JOIN orders o ON u.id = o.user_id WHERE u.active = 1 ORDER BY o.order_date DESC;',
},
{
id: 'css',
name: 'CSS',
supportsFilter: false,
- sample: '.container { display: flex; flex-direction: column; padding: 1rem; } .container h1 { color: blue; font-size: 2rem; }',
+ sample:
+ '.container { display: flex; flex-direction: column; padding: 1rem; } .container h1 { color: blue; font-size: 2rem; }',
},
{
id: 'javascript',
name: 'JavaScript',
supportsFilter: false,
- sample: 'function greet(name) { const message = `Hello, ${name}!`; console.log(message); return message; } greet("World");',
+ sample:
+ 'function greet(name) { const message = `Hello, ${name}!`; console.log(message); return message; } greet("World");',
},
];
@@ -78,10 +83,10 @@ export default function CodeFormatter() {
// Check for format preset in URL params
const urlFormat = searchParams.get('format');
- const validFormats = FORMATTERS.map(f => f.id);
+ const validFormats = FORMATTERS.map((f) => f.id);
const initialFormatType = validFormats.includes(urlFormat)
? urlFormat
- : (persisted?.formatType || 'json');
+ : persisted?.formatType || 'json';
const [formatType, setFormatType] = useState(initialFormatType);
const [input, setInput] = useState(persisted?.input || '');
@@ -133,23 +138,23 @@ export default function CodeFormatter() {
// Handle format type changes - cache current input/filter and restore cached for new type
useEffect(() => {
const prevType = prevFormatTypeRef.current;
-
+
if (formatType !== prevType) {
// Save current input and filter to cache for previous type
inputCacheRef.current[prevType] = input;
filterCacheRef.current[prevType] = filter;
-
+
// Load cached input and filter for new type, or empty string if not cached
const cachedInput = inputCacheRef.current[formatType];
const cachedFilter = filterCacheRef.current[formatType];
setInput(cachedInput !== undefined ? cachedInput : '');
setFilter(cachedFilter !== undefined ? cachedFilter : '');
-
+
// Clear output when switching languages
setOutput('');
setFormattedOutput('');
setError(null);
-
+
// Update ref
prevFormatTypeRef.current = formatType;
}
@@ -300,51 +305,47 @@ export default function CodeFormatter() {
Hello World
\nThis is a paragraph.
\n
-
-
-
-
-
-
);
}
diff --git a/frontend/src/pages/CronJobParser.jsx b/frontend/src/pages/CronJobParser.jsx
index 995f3b9..d162b03 100644
--- a/frontend/src/pages/CronJobParser.jsx
+++ b/frontend/src/pages/CronJobParser.jsx
@@ -57,177 +57,181 @@ export default function CronJobParser() {
-
-
-
- setCron(e.target.value)}
- invalid={!!error}
- invalidText={error}
- placeholder="* * * * *"
+
+
+
+ setCron(e.target.value)}
+ invalid={!!error}
+ invalidText={error}
+ placeholder="* * * * *"
+ style={{
+ fontFamily: "'IBM Plex Mono', monospace",
+ fontSize: '1.25rem',
+ }}
+ />
+
+
+
-
- {desc ? (
- <>
-
-
- - {desc} -
-- {cron} + > + {desc ? ( + <> +
+ {desc} +
++ {cron} +
+ + ) : ( ++ Enter a cron expression to see the translation
- - ) : ( -- Enter a cron expression to see the translation -
- )} + )} +
-
-
-
- {examples.map((example, idx) => (
- setCron(example.cron)}
- onMouseEnter={(e) => {
- e.currentTarget.style.backgroundColor = 'var(--cds-layer-hover)';
- }}
- onMouseLeave={(e) => {
- e.currentTarget.style.backgroundColor =
- idx % 2 === 0 ? 'var(--cds-layer-01)' : 'var(--cds-layer-02)';
+ fontSize: '0.75rem',
+ fontWeight: 400,
+ lineHeight: 1.5,
+ letterSpacing: '0.32px',
+ color: 'var(--cds-text-secondary)',
+ textTransform: 'uppercase',
}}
>
-
- ))}
+
+ {example.cron}
+
+
+ {example.text}
+
+
+
+ ))}
+
+
+
+ {examples.map((example, idx) => (
+ setCron(example.cron)}
+ onMouseEnter={(e) => {
+ e.currentTarget.style.backgroundColor = 'var(--cds-layer-hover)';
+ }}
+ onMouseLeave={(e) => {
+ e.currentTarget.style.backgroundColor =
+ idx % 2 === 0 ? 'var(--cds-layer-01)' : 'var(--cds-layer-02)';
+ }}
>
-
- {example.cron}
-
-
- {example.text}
-
-
-
-
-
+
+
@@ -19,7 +29,7 @@ export function InputSection({ availableTimezones, input, setInput, timezone, se
(item ? item.label : '')}
selectedItem={availableTimezones.find((tz) => tz.id === timezone)}
@@ -31,7 +41,7 @@ export function InputSection({ availableTimezones, input, setInput, timezone, se
(item ? item.label : '')}
selectedItem={selectedNewTimezone}
diff --git a/frontend/src/pages/DateTimeConverter/components/ResultsGrid.jsx b/frontend/src/pages/DateTimeConverter/components/ResultsGrid.jsx
index 1fcdb5a..cd6ed4b 100644
--- a/frontend/src/pages/DateTimeConverter/components/ResultsGrid.jsx
+++ b/frontend/src/pages/DateTimeConverter/components/ResultsGrid.jsx
@@ -8,22 +8,40 @@ import {
getRelativeTime,
getDayOfYear,
getWeekOfYear,
- isLeapYear
+ isLeapYear,
} from '../datetimeHelpers';
-export function ResultsGrid({ parsedDate, timezone, customTimezones, getTimezoneLabel, onRemoveTimezone }) {
+export function ResultsGrid({
+ parsedDate,
+ timezone,
+ customTimezones,
+ getTimezoneLabel,
+ onRemoveTimezone,
+}) {
return (
-
{/* Column 1: Custom Timezones */}
-
+
Other timezones
{customTimezones.length === 0 && (
-
+
-
Select a timezone above to add
)}
@@ -56,23 +74,24 @@ export function ResultsGrid({ parsedDate, timezone, customTimezones, getTimezone
{/* Column 2: Primary Outputs */}
+
Format
{/* Three fields in a row */}
-
{/* Other formats section - 2 per row */}
-
- {renderPane()}
-
+ {renderPane()}
);
}
diff --git a/frontend/src/pages/TextConverter/index.jsx b/frontend/src/pages/TextConverter/index.jsx
index b9e0293..cbdfba8 100644
--- a/frontend/src/pages/TextConverter/index.jsx
+++ b/frontend/src/pages/TextConverter/index.jsx
@@ -32,12 +32,12 @@ export default function TextBasedConverter() {
const validCategories = Object.keys(CONVERTER_MAP);
const initialCategory = validCategories.includes(urlCategory)
? urlCategory
- : (localStorage.getItem(STORAGE_KEYS.CATEGORY) || DEFAULTS.CATEGORY);
+ : localStorage.getItem(STORAGE_KEYS.CATEGORY) || DEFAULTS.CATEGORY;
const validMethods = CONVERTER_MAP[initialCategory] || [];
const initialMethod = validMethods.includes(urlMethod)
? urlMethod
- : (localStorage.getItem(STORAGE_KEYS.METHOD) || DEFAULTS.METHOD);
+ : localStorage.getItem(STORAGE_KEYS.METHOD) || DEFAULTS.METHOD;
// Persistent state initialization
const [category, setCategory] = useState(initialCategory);
@@ -235,80 +235,80 @@ export default function TextBasedConverter() {
- setInput(e.target.value)}
- placeholder={PLACEHOLDERS.INPUT}
- />
+ setInput(e.target.value)}
+ placeholder={PLACEHOLDERS.INPUT}
+ />
- {isAllHashes ? (
-
- ) : isImageOutput ? (
-
+
-
- {/* Left Pane: Live Highlighted Input */}
- 0 ? ` (${matches.length} match${matches.length !== 1 ? 'es' : ''})` : ''}`}
- >
-
-
- {/* Right Pane: Match Information */}
-
-
-
+
+
+
);
diff --git a/frontend/src/pages/StringUtilities/index.jsx b/frontend/src/pages/StringUtilities/index.jsx
index 81b289d..2531785 100644
--- a/frontend/src/pages/StringUtilities/index.jsx
+++ b/frontend/src/pages/StringUtilities/index.jsx
@@ -77,9 +77,7 @@ export default function StringUtilities() {
-
Other formats
@@ -97,7 +123,15 @@ export function ResultsGrid({ parsedDate, timezone, customTimezones, getTimezone
/>
))}
-
+
-
{/* Error Display */}
@@ -1012,36 +1012,36 @@ export default function RegExpTester() {
)}
Additional
diff --git a/frontend/src/pages/DateTimeConverter/hooks/useDateTime.js b/frontend/src/pages/DateTimeConverter/hooks/useDateTime.js
index ef67e9a..ca7e94c 100644
--- a/frontend/src/pages/DateTimeConverter/hooks/useDateTime.js
+++ b/frontend/src/pages/DateTimeConverter/hooks/useDateTime.js
@@ -35,10 +35,10 @@ export function useDateTime() {
id: tz.timezone,
label: tz.label || tz.timezone,
}));
-
+
// Add 'local' as the first option
const allTimezonesList = [{ id: 'local', label: 'Local Time' }, ...tzList];
-
+
console.log(`Loaded ${allTimezonesList.length} timezones from backend`);
setAllTimezones(allTimezonesList);
} else {
@@ -85,9 +85,7 @@ export function useDateTime() {
};
// Get available timezones for dropdown (exclude already added only)
- const availableTimezones = allTimezones.filter(
- (tz) => !customTimezones.includes(tz.id)
- );
+ const availableTimezones = allTimezones.filter((tz) => !customTimezones.includes(tz.id));
// Get timezone label by ID
const getTimezoneLabel = (tzId) => {
diff --git a/frontend/src/pages/NumberConverter/components/BitCell.jsx b/frontend/src/pages/NumberConverter/components/BitCell.jsx
index 613bb29..46910b3 100644
--- a/frontend/src/pages/NumberConverter/components/BitCell.jsx
+++ b/frontend/src/pages/NumberConverter/components/BitCell.jsx
@@ -4,7 +4,7 @@ import { BIT_CELL_CONFIG } from '../constants';
/**
* Individual bit cell component
* Displays a single bit (0 or 1) as a clickable toggle
- *
+ *
* @param {Object} props
* @param {number} props.bitValue - Current bit value (0 or 1)
* @param {number} props.position - Bit position (0-31)
@@ -35,12 +35,8 @@ const BitCell = ({ bitValue, position, onToggle, isActive = false }) => {
style={{
width: `${BIT_CELL_CONFIG.SIZE}px`,
height: `${BIT_CELL_CONFIG.SIZE}px`,
- border: isSet
- ? 'none'
- : `2px solid ${BIT_CELL_CONFIG.INACTIVE_BORDER}`,
- backgroundColor: isSet
- ? BIT_CELL_CONFIG.ACTIVE_COLOR
- : 'transparent',
+ border: isSet ? 'none' : `2px solid ${BIT_CELL_CONFIG.INACTIVE_BORDER}`,
+ backgroundColor: isSet ? BIT_CELL_CONFIG.ACTIVE_COLOR : 'transparent',
borderRadius: '4px',
cursor: 'pointer',
display: 'flex',
@@ -49,14 +45,10 @@ const BitCell = ({ bitValue, position, onToggle, isActive = false }) => {
fontFamily: "'IBM Plex Mono', monospace",
fontSize: '14px',
fontWeight: 600,
- color: isSet
- ? 'var(--cds-text-inverse)'
- : 'var(--cds-text-primary)',
+ color: isSet ? 'var(--cds-text-inverse)' : 'var(--cds-text-primary)',
transition: 'all 0.15s ease',
transform: isActive ? `scale(${BIT_CELL_CONFIG.HOVER_SCALE})` : 'scale(1)',
- boxShadow: isActive
- ? '0 2px 8px rgba(0, 0, 0, 0.3)'
- : 'none',
+ boxShadow: isActive ? '0 2px 8px rgba(0, 0, 0, 0.3)' : 'none',
outline: 'none',
}}
onMouseEnter={(e) => {
diff --git a/frontend/src/pages/NumberConverter/components/BitGrid.jsx b/frontend/src/pages/NumberConverter/components/BitGrid.jsx
index 30749bf..f2096b4 100644
--- a/frontend/src/pages/NumberConverter/components/BitGrid.jsx
+++ b/frontend/src/pages/NumberConverter/components/BitGrid.jsx
@@ -6,7 +6,7 @@ import { getBit, getByte, formatByte } from '../utils';
/**
* BitGrid component
* Displays a 32-bit value as a 4×8 grid of bit cells
- *
+ *
* @param {Object} props
* @param {number} props.value - Current 32-bit value
* @param {function} props.onToggleBit - Callback when a bit is toggled
@@ -88,9 +88,10 @@ const BitGrid = ({ value, onToggleBit, layout = 'horizontal' }) => {
BASES[k].base === base)]?.placeholder || `Enter ${label.toLowerCase()}...`)}
+ placeholder={
+ placeholder ||
+ (isCustom
+ ? `Base ${customBase}`
+ : BASES[Object.keys(BASES).find((k) => BASES[k].base === base)]?.placeholder ||
+ `Enter ${label.toLowerCase()}...`)
+ }
invalid={!!error}
invalidText={error}
style={{
diff --git a/frontend/src/pages/NumberConverter/constants.js b/frontend/src/pages/NumberConverter/constants.js
index 03851e1..610afe7 100644
--- a/frontend/src/pages/NumberConverter/constants.js
+++ b/frontend/src/pages/NumberConverter/constants.js
@@ -64,13 +64,13 @@ export const BITWISE_OPERATIONS = {
id: 'not',
label: 'NOT',
description: 'Flip all bits',
- apply: (value) => (~value) >>> 0,
+ apply: (value) => ~value >>> 0,
},
MASK_BYTE: {
id: 'maskByte',
label: '& 0xFF',
description: 'Keep only lowest byte',
- apply: (value) => value & 0xFF,
+ apply: (value) => value & 0xff,
},
SET_LSB: {
id: 'setLSB',
@@ -120,7 +120,7 @@ export const ERROR_MESSAGES = {
* Numeric limits
*/
export const LIMITS = {
- MAX_32BIT: 0xFFFFFFFF, // 4,294,967,295
+ MAX_32BIT: 0xffffffff, // 4,294,967,295
MIN_32BIT: 0,
MAX_32BIT_DECIMAL: 4294967295,
};
diff --git a/frontend/src/pages/NumberConverter/index.jsx b/frontend/src/pages/NumberConverter/index.jsx
index a901582..e23af79 100644
--- a/frontend/src/pages/NumberConverter/index.jsx
+++ b/frontend/src/pages/NumberConverter/index.jsx
@@ -51,7 +51,7 @@ const NumberConverter = () => {
const handleBaseChange = (baseId) => {
setInputBase(baseId);
// Convert current value to new base format
- const base = bases.find(b => b.id === baseId)?.base || 10;
+ const base = bases.find((b) => b.id === baseId)?.base || 10;
const newValue = formatNumber(currentValue, base);
setInputValue(newValue);
setError('');
@@ -67,12 +67,13 @@ const NumberConverter = () => {
navigator.clipboard.writeText(text);
};
- const currentBase = bases.find(b => b.id === inputBase);
+ const currentBase = bases.find((b) => b.id === inputBase);
return (
+ style={{ display: 'flex', flexDirection: 'column', gap: '0.75rem', height: '100%' }}
+ >
{
{/* Main Input Section */}
-
+ )}
{/* Results Grid */}
-
+ handleInputChange(e.target.value)}
+ placeholder={`Enter ${currentBase?.label.toLowerCase()} number...`}
+ invalid={!!error}
+ invalidText={error}
+ size="lg"
+ style={{
+ fontFamily: "'IBM Plex Mono', monospace",
+ }}
+ />
+
- {inputValue && (
-
+
- handleInputChange(e.target.value)}
- placeholder={`Enter ${currentBase?.label.toLowerCase()} number...`}
- invalid={!!error}
- invalidText={error}
- size="lg"
- style={{
- fontFamily: "'IBM Plex Mono', monospace",
- }}
- />
-
+
- {bases.map((base) => (
-
- ))}
-
+
+ {bases.map((base) => (
+
+ ))}
+
-
-
- Decimal value: {currentValue.toLocaleString()}
-
-
-
- )}
+
+ Decimal value: {currentValue.toLocaleString()}
+
+
+
- {bases.map((base) => {
- if (base.id === inputBase) return null; // Skip current input base
+
+
+ {bases.map((base) => {
+ if (base.id === inputBase) return null; // Skip current input base
- const value = formatNumber(currentValue, base.base);
- const displayValue = value || '-';
+ const value = formatNumber(currentValue, base.base);
+ const displayValue = value || '-';
- return (
-
-
-
+
);
diff --git a/frontend/src/pages/NumberConverter/numberConverterReducer.js b/frontend/src/pages/NumberConverter/numberConverterReducer.js
index 242d799..dc92dd4 100644
--- a/frontend/src/pages/NumberConverter/numberConverterReducer.js
+++ b/frontend/src/pages/NumberConverter/numberConverterReducer.js
@@ -77,16 +77,16 @@ export function numberConverterReducer(state = INITIAL_STATE, action) {
switch (operation) {
case 'shiftLeft':
- newValue = ((state.value << 1) >>> 0);
+ newValue = (state.value << 1) >>> 0;
break;
case 'shiftRight':
- newValue = (state.value >>> 1);
+ newValue = state.value >>> 1;
break;
case 'not':
- newValue = (~state.value >>> 0);
+ newValue = ~state.value >>> 0;
break;
case 'maskByte':
- newValue = (state.value & 0xFF) >>> 0;
+ newValue = (state.value & 0xff) >>> 0;
break;
case 'setLSB':
newValue = (state.value | 1) >>> 0;
@@ -217,7 +217,7 @@ export function clearAll() {
*/
export function handleConversionInput(dispatch, input, base, field, parseFn) {
const result = parseFn(input);
-
+
if (result.error) {
// Set error but keep current value
dispatch(setError(field, result.error));
diff --git a/frontend/src/pages/NumberConverter/utils.js b/frontend/src/pages/NumberConverter/utils.js
index 016fde0..6f1c89f 100644
--- a/frontend/src/pages/NumberConverter/utils.js
+++ b/frontend/src/pages/NumberConverter/utils.js
@@ -22,13 +22,13 @@ export function sanitizeInput(input) {
*/
export function validateInputChars(input, base) {
const validChars = getValidCharsForBase(base);
-
+
for (const char of input) {
if (!validChars.includes(char)) {
return { valid: false, invalidChar: char };
}
}
-
+
return { valid: true, invalidChar: null };
}
@@ -40,50 +40,50 @@ export function validateInputChars(input, base) {
*/
export function parseInput(input, base) {
const sanitized = sanitizeInput(input);
-
+
if (sanitized === '') {
return { value: null, error: null }; // Empty is valid (no change)
}
-
+
// Check for negative sign
if (sanitized.startsWith('-')) {
return { value: null, error: ERROR_MESSAGES.NEGATIVE };
}
-
+
// Check for scientific notation
if (/[eE]/.test(sanitized)) {
return { value: null, error: ERROR_MESSAGES.PARSE_ERROR(base) };
}
-
+
// Validate characters
const { valid, invalidChar } = validateInputChars(sanitized, base);
if (!valid) {
return { value: null, error: ERROR_MESSAGES.INVALID_CHAR(invalidChar, base) };
}
-
+
// Parse the number
const parsed = parseInt(sanitized, base);
-
+
if (isNaN(parsed)) {
return { value: null, error: ERROR_MESSAGES.PARSE_ERROR(base) };
}
-
+
// Check for overflow and clamp
let value = parsed;
let error = null;
-
+
if (value < 0) {
return { value: null, error: ERROR_MESSAGES.NEGATIVE };
}
-
+
if (value > LIMITS.MAX_32BIT_DECIMAL) {
value = LIMITS.MAX_32BIT;
error = ERROR_MESSAGES.OVERFLOW;
}
-
+
// Ensure unsigned 32-bit
value = value >>> 0;
-
+
return { value, error };
}
@@ -103,12 +103,12 @@ export function parseDecimal(input) {
*/
export function parseHex(input) {
let sanitized = sanitizeInput(input);
-
+
// Remove 0x or 0X prefix if present
if (sanitized.toLowerCase().startsWith('0x')) {
sanitized = sanitized.slice(2);
}
-
+
return parseInput(sanitized, 16);
}
@@ -119,12 +119,12 @@ export function parseHex(input) {
*/
export function parseBinary(input) {
let sanitized = sanitizeInput(input);
-
+
// Remove 0b or 0B prefix if present
if (sanitized.toLowerCase().startsWith('0b')) {
sanitized = sanitized.slice(2);
}
-
+
return parseInput(sanitized, 2);
}
@@ -135,12 +135,12 @@ export function parseBinary(input) {
*/
export function parseOctal(input) {
let sanitized = sanitizeInput(input);
-
+
// Remove 0o or 0O prefix if present
if (sanitized.toLowerCase().startsWith('0o')) {
sanitized = sanitized.slice(2);
}
-
+
return parseInput(sanitized, 8);
}
@@ -260,7 +260,7 @@ export function getBit(value, position) {
if (position < 0 || position > 31) {
return 0;
}
- return ((value >>> position) & 1);
+ return (value >>> position) & 1;
}
/**
@@ -273,7 +273,7 @@ export function toggleBit(value, position) {
if (position < 0 || position > 31) {
return value >>> 0;
}
- return ((value ^ (1 << position)) >>> 0);
+ return (value ^ (1 << position)) >>> 0;
}
/**
@@ -286,7 +286,7 @@ export function setBit(value, position) {
if (position < 0 || position > 31) {
return value >>> 0;
}
- return ((value | (1 << position)) >>> 0);
+ return (value | (1 << position)) >>> 0;
}
/**
@@ -299,7 +299,7 @@ export function clearBit(value, position) {
if (position < 0 || position > 31) {
return value >>> 0;
}
- return ((value & ~(1 << position)) >>> 0);
+ return (value & ~(1 << position)) >>> 0;
}
/**
@@ -313,7 +313,7 @@ export function shiftLeft(value, n = 1) {
if (shiftAmount >= 32) {
return 0;
}
- return ((value << shiftAmount) >>> 0);
+ return (value << shiftAmount) >>> 0;
}
/**
@@ -327,7 +327,7 @@ export function shiftRight(value, n = 1) {
if (shiftAmount >= 32) {
return 0;
}
- return (value >>> shiftAmount);
+ return value >>> shiftAmount;
}
/**
@@ -336,7 +336,7 @@ export function shiftRight(value, n = 1) {
* @returns {number} Inverted value (32-bit)
*/
export function bitwiseNot(value) {
- return (~value >>> 0);
+ return ~value >>> 0;
}
/**
@@ -346,7 +346,7 @@ export function bitwiseNot(value) {
* @returns {number} Result (32-bit)
*/
export function bitwiseAnd(value, mask) {
- return ((value & mask) >>> 0);
+ return (value & mask) >>> 0;
}
/**
@@ -356,7 +356,7 @@ export function bitwiseAnd(value, mask) {
* @returns {number} Result (32-bit)
*/
export function bitwiseOr(value, mask) {
- return ((value | mask) >>> 0);
+ return (value | mask) >>> 0;
}
/**
@@ -369,7 +369,7 @@ export function getByte(value, bytePos) {
if (bytePos < 0 || bytePos > 3) {
return 0;
}
- return ((value >>> (bytePos * 8)) & 0xFF);
+ return (value >>> (bytePos * 8)) & 0xff;
}
/**
diff --git a/frontend/src/pages/RegExpTester.jsx b/frontend/src/pages/RegExpTester.jsx
index 46bb312..f78c92e 100644
--- a/frontend/src/pages/RegExpTester.jsx
+++ b/frontend/src/pages/RegExpTester.jsx
@@ -870,109 +870,109 @@ export default function RegExpTester() {
{/* Regex Input Row - Unified Input Group */}
-
- {/* Flags Input */}
-
-
{/* Quick Tips */}
-
- {!inputValue && (
-
- {base.label}
-
-
- Base {base.base}
+ return (
+
+
-
-
+
-
+
-
+ {base.label}
+
+
+ Base {base.base}
+
- {base.prefix}{displayValue}
-
+
- e.g., {base.prefix}{base.example}
+
+
+ {!inputValue && (
+
+ {base.prefix}
+ {displayValue}
- )}
-
- );
- })}
-
+ e.g., {base.prefix}
+ {base.example}
+
+ )}
+
+ );
+ })}
+
- Common Values
-
+
+ Common Values
+
-
- {[
- { dec: '255', hex: 'FF', bin: '11111111' },
- { dec: '256', hex: '100', bin: '100000000' },
- { dec: '1024', hex: '400', bin: '10000000000' },
- { dec: '4096', hex: '1000', bin: '1000000000000' },
- ].map((row, idx) => (
-
- ))}
-
-
+ {[
+ { dec: '255', hex: 'FF', bin: '11111111' },
+ { dec: '256', hex: '100', bin: '100000000' },
+ { dec: '1024', hex: '400', bin: '10000000000' },
+ { dec: '4096', hex: '1000', bin: '1000000000000' },
+ ].map((row, idx) => (
+
+ ))}
+
+
- {/* Prefix / */}
-
-
- /
-
-
+
+ /
+
+
-
+
+
- {/* Suffix / */}
-
-
- /
-
-
+
+ /
+
+
-
+ {/* Copy Button */}
+
+
-
-
+ {/* Left Pane: Live Highlighted Input */}
+ 0 ? ` (${matches.length} match${matches.length !== 1 ? 'es' : ''})` : ''}`}
>
- {output.length > 0 ? (
- output
- ) : (
-
-
- Matching results will appear here...
-
- )}
-
+ {output.length > 0 ? (
+ output
+ ) : (
+
+
+ Matching results will appear here...
+
+ )}
+
+ {isAllHashes ? (
+ ) : isImageOutput ? (
-
+
- {LABELS.OUTPUT}
-
+
-
-
-
- ) : (
-