@pie-lib/math-input 8.1.0 → 8.1.1-next.2

package/src/keys/navigation.js

@@ -1,8 +0,0 @@
-import { LEFT_ARROW, RIGHT_ARROW } from './chars';
-import { mkSet } from './utils';
-
-const set = mkSet('navigation');
-
-export const left = set({ label: LEFT_ARROW, keystroke: 'Left', ariaLabel: 'Move cursor left' });
-
-export const right = set({ label: RIGHT_ARROW, keystroke: 'Right', ariaLabel: 'Move cursor right' });

package/src/keys/operators.js

@@ -1,10 +0,0 @@
-import { mkSet } from './utils';
-
-const set = mkSet('operators');
-
-export const circleDot = set({
-  name: 'CircleDot',
-  label: '⋅',
-  write: '\\cdot',
-  ariaLabel: 'Dot multiplier',
-});

package/src/keys/statistics.js

@@ -1,38 +0,0 @@
-import { mkSet } from './utils';
-
-const set = mkSet('statistics');
-export const xBar = set({
-  name: 'X Bar',
-  label: 'x̄',
-  latex: '\\overline{x}',
-  write: '\\overline{x}',
-});
-
-export const yBar = set({
-  name: 'Y Bar',
-  latex: '\\overline{y}',
-  write: '\\overline{y}',
-});
-
-export const mu = set({
-  name: 'mu',
-  label: 'mu',
-  latex: '\\mu',
-  write: '\\mu',
-});
-
-export const sigma = set({
-  name: 'Sigma',
-  ariaLabel: 'Uppercase Sigma',
-  label: '\\Sigma',
-  latex: '\\Sigma',
-  write: '\\Sigma',
-});
-
-export const smallSigma = set({
-  name: 'sigma',
-  ariaLabel: 'Lowercase Sigma',
-  label: '\\sigma',
-  latex: '\\sigma',
-  write: '\\sigma',
-});

package/src/keys/sub-sup.js

@@ -1,15 +0,0 @@
-import { mkSet } from './utils';
-
-const set = mkSet('sub-sup');
-
-export const superscript = set({
-  name: 'Superscript',
-  latex: 'x^{}',
-  command: '^',
-});
-
-export const subscript = set({
-  name: 'Subscript',
-  latex: 'x_{}',
-  command: '_',
-});

package/src/keys/trigonometry.js

@@ -1,15 +0,0 @@
-import { mkSet } from './utils';
-
-const set = mkSet('trigonometry');
-
-export const sin = set({ name: 'sine', label: 'sin', command: '\\sin', latex: '\\sin' });
-
-export const cos = set({ name: 'cosine', label: 'cos', command: '\\cos', latex: '\\cos' });
-
-export const tan = set({ name: 'tanget', label: 'tan', command: '\\tan', latex: '\\tan' });
-
-export const sec = set({ name: 'secant', label: 'sec', command: '\\sec', latex: '\\sec' });
-
-export const csc = set({ name: 'cosecant', label: 'csc', command: '\\csc', latex: '\\csc' });
-
-export const cot = set({ name: 'cotangent', label: 'cot', command: '\\cot', latex: '\\cot' });

package/src/keys/utils.js

@@ -1,66 +0,0 @@
-import { flatten, times } from 'lodash-es';
-
-export const mkSet = (category) => (o) => ({ ...o, category });
-
-export const toArray = (o) => Object.keys(o).map((k) => o[k]);
-
-export const toKey = (category) => (v) => {
-  if (typeof v === 'string') {
-    return {
-      name: v,
-      label: v,
-      category,
-      write: v,
-    };
-  } else {
-    return {
-      ...v,
-      category,
-    };
-  }
-};
-
-export const transformToKeySetStructure = (data = []) => {
-  const structure = [];
-
-  times(5, () => structure.push([]));
-
-  let ln = data.length;
-  let i = 0;
-  let j = 0;
-
-  while (j < ln) {
-    structure[i++].push(data[j++]);
-
-    if (i === 5) {
-      i = 0;
-    }
-  }
-
-  return structure;
-};
-
-const latexAndNameDontExist = (base) => (k) => {
-  const flattened = flatten(base);
-  const latexExists = flattened.some((b) => b.latex === k.latex);
-  const nameExists = flattened.some((b) => b.name === k.name);
-
-  return !latexExists && !nameExists;
-};
-
-export const extendKeySet = (base = [], keySetData = []) => {
-  keySetData = keySetData.filter(latexAndNameDontExist(base));
-
-  const final = [];
-
-  times(5 - base.length, () => base.push([]));
-  times(5, () => final.push([]));
-
-  const extra = transformToKeySetStructure(keySetData);
-
-  for (let i = 0; i < 5; i++) {
-    final[i] = [...base[i], ...extra[i]];
-  }
-
-  return final;
-};

package/src/keys/vars.js

@@ -1,19 +0,0 @@
-import { mkSet } from './utils';
-
-const set = mkSet('vars');
-
-export const x = set({
-  name: 'X',
-  latex: 'x',
-  write: 'x',
-});
-export const y = set({
-  name: 'Y',
-  latex: 'y',
-  write: 'y',
-});
-export const theta = set({
-  name: 'Theta',
-  latex: '\\theta',
-  write: '\\theta',
-});

package/src/math-input.jsx

@@ -1,119 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { styled } from '@mui/material/styles';
-import * as mq from './mq';
-import { baseSet } from './keys';
-import KeyPad from './keypad';
-import debug from 'debug';
-
-const log = debug('pie-lib:math-input');
-
-const grey = 'rgba(0, 0, 0, 0.23)';
-
-const MathInputContainer = styled('div')(({ theme, focused }) => ({
-  borderRadius: '4px',
-  border: `solid 1px ${focused ? theme.palette.primary.main : grey}`,
-  marginTop: theme.spacing(1),
-  marginBottom: theme.spacing(1),
-  transition: 'border 200ms linear',
-}));
-
-const PadContainer = styled('div')({
-  width: '100%',
-  display: 'flex',
-});
-
-const StyledMqInput = styled(mq.Input)(({ theme }) => ({
-  width: '100%',
-  border: `solid 0px ${theme.palette.primary.light}`,
-  transition: 'border 200ms linear',
-  padding: theme.spacing(1),
-  '&.mq-focused': {
-    outline: 'none',
-    boxShadow: 'none',
-    border: `solid 0px ${theme.palette.primary.dark}`,
-  },
-}));
-
-export class MathInput extends React.Component {
-  static propTypes = {
-    className: PropTypes.string,
-    keyset: PropTypes.array,
-    displayMode: PropTypes.oneOf(['block', 'block-on-focus']),
-    latex: PropTypes.string,
-    onChange: PropTypes.func,
-  };
-
-  static defaultProps = {
-    keyset: [],
-    displayMode: 'block',
-  };
-
-  constructor(props) {
-    super(props);
-    this.state = {
-      focused: false,
-    };
-  }
-
-  keypadPress = (key) => {
-    log('[keypadPress] key:', key);
-
-    if (!this.input) {
-      return;
-    }
-
-    if (key.latex && !key.command) {
-      this.input.write(key.latex);
-    } else if (key.write) {
-      this.input.write(key.write);
-    } else if (key.command) {
-      this.input.command(key.command);
-    } else if (key.keystroke) {
-      this.input.keystroke(key.keystroke);
-    }
-  };
-
-  inputFocus = () => {
-    this.setState({ focused: true });
-  };
-
-  inputBlur = () => {
-    this.setState({ focused: false });
-  };
-
-  changeLatex = (l) => {
-    const { onChange } = this.props;
-
-    if (onChange && l !== this.props.latex) {
-      log('[changeLatex]', l, this.props.latex);
-      onChange(l);
-    }
-  };
-
-  render() {
-    const { className, keyset, latex } = this.props;
-    const { focused } = this.state;
-
-    const showKeypad = true; // TODO: add support for different displayModes - displayMode === 'block' || focused;
-
-    return (
-      <MathInputContainer className={className} focused={focused}>
-        <StyledMqInput
-          innerRef={(r) => (this.input = r)}
-          onFocus={this.inputFocus}
-          onBlur={this.inputBlur}
-          latex={latex}
-          onChange={this.changeLatex}
-        />
-        {showKeypad && (
-          <PadContainer>
-            <KeyPad baseSet={baseSet} additionalKeys={keyset} onPress={this.keypadPress} />
-          </PadContainer>
-        )}
-      </MathInputContainer>
-    );
-  }
-}
-
-export default MathInput;

package/src/mq/__tests__/custom-elements.test.js

@@ -1,342 +0,0 @@
-import { registerLineBreak } from '../custom-elements';
-
-describe('custom-elements', () => {
-  describe('registerLineBreak', () => {
-    let mockMQ;
-    let mockRegisterEmbed;
-    let embedCallback;
-
-    beforeEach(() => {
-      mockRegisterEmbed = jest.fn((name, callback) => {
-        embedCallback = callback;
-      });
-
-      mockMQ = {
-        registerEmbed: mockRegisterEmbed,
-      };
-    });
-
-    afterEach(() => {
-      jest.clearAllMocks();
-      embedCallback = null;
-    });
-
-    it('should call MQ.registerEmbed with "newLine" as the embed name', () => {
-      registerLineBreak(mockMQ);
-
-      expect(mockRegisterEmbed).toHaveBeenCalledTimes(1);
-      expect(mockRegisterEmbed).toHaveBeenCalledWith('newLine', expect.any(Function));
-    });
-
-    it('should register an embed callback function', () => {
-      registerLineBreak(mockMQ);
-
-      expect(embedCallback).toBeDefined();
-      expect(typeof embedCallback).toBe('function');
-    });
-
-    describe('newLine embed configuration', () => {
-      let embedConfig;
-
-      beforeEach(() => {
-        registerLineBreak(mockMQ);
-        embedConfig = embedCallback();
-      });
-
-      it('should return a configuration object with all required properties', () => {
-        expect(embedConfig).toHaveProperty('htmlString');
-        expect(embedConfig).toHaveProperty('text');
-        expect(embedConfig).toHaveProperty('latex');
-      });
-
-      it('should return htmlString with newLine div', () => {
-        expect(embedConfig.htmlString).toBe('<div class="newLine"></div>');
-      });
-
-      it('should return text function that returns "testText"', () => {
-        expect(embedConfig.text).toBeDefined();
-        expect(typeof embedConfig.text).toBe('function');
-        expect(embedConfig.text()).toBe('testText');
-      });
-
-      it('should return latex function that returns embed syntax', () => {
-        expect(embedConfig.latex).toBeDefined();
-        expect(typeof embedConfig.latex).toBe('function');
-        expect(embedConfig.latex()).toBe('\\embed{newLine}[]');
-      });
-
-      it('should return consistent values on multiple calls', () => {
-        const firstCall = embedCallback();
-        const secondCall = embedCallback();
-
-        expect(firstCall.htmlString).toBe(secondCall.htmlString);
-        expect(firstCall.text()).toBe(secondCall.text());
-        expect(firstCall.latex()).toBe(secondCall.latex());
-      });
-
-      it('should have text function that returns the same value on multiple invocations', () => {
-        expect(embedConfig.text()).toBe('testText');
-        expect(embedConfig.text()).toBe('testText');
-        expect(embedConfig.text()).toBe('testText');
-      });
-
-      it('should have latex function that returns the same value on multiple invocations', () => {
-        expect(embedConfig.latex()).toBe('\\embed{newLine}[]');
-        expect(embedConfig.latex()).toBe('\\embed{newLine}[]');
-        expect(embedConfig.latex()).toBe('\\embed{newLine}[]');
-      });
-    });
-
-    describe('integration scenarios', () => {
-      it('should handle multiple registrations without errors', () => {
-        registerLineBreak(mockMQ);
-        expect(() => registerLineBreak(mockMQ)).not.toThrow();
-
-        expect(mockRegisterEmbed).toHaveBeenCalledTimes(2);
-      });
-
-      it('should work with different MQ instances', () => {
-        const mockMQ1 = { registerEmbed: jest.fn() };
-        const mockMQ2 = { registerEmbed: jest.fn() };
-
-        registerLineBreak(mockMQ1);
-        registerLineBreak(mockMQ2);
-
-        expect(mockMQ1.registerEmbed).toHaveBeenCalledTimes(1);
-        expect(mockMQ2.registerEmbed).toHaveBeenCalledTimes(1);
-      });
-
-      it('should register embed with correct callback signature', () => {
-        registerLineBreak(mockMQ);
-
-        const callArgs = mockRegisterEmbed.mock.calls[0];
-        expect(callArgs[0]).toBe('newLine');
-        expect(callArgs[1]).toBeInstanceOf(Function);
-      });
-    });
-
-    describe('embed configuration structure', () => {
-      it('should return an object with exactly 3 properties', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        const keys = Object.keys(config);
-        expect(keys).toHaveLength(3);
-        expect(keys).toContain('htmlString');
-        expect(keys).toContain('text');
-        expect(keys).toContain('latex');
-      });
-
-      it('should have htmlString as a string type', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(typeof config.htmlString).toBe('string');
-      });
-
-      it('should have text as a function type', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(typeof config.text).toBe('function');
-      });
-
-      it('should have latex as a function type', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(typeof config.latex).toBe('function');
-      });
-    });
-
-    describe('HTML structure validation', () => {
-      it('should return htmlString with valid HTML div element', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.htmlString).toMatch(/<div[^>]*>.*<\/div>/);
-      });
-
-      it('should return htmlString with newLine class', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.htmlString).toContain('class="newLine"');
-      });
-
-      it('should return htmlString with empty div content', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.htmlString).toBe('<div class="newLine"></div>');
-      });
-    });
-
-    describe('LaTeX syntax validation', () => {
-      it('should return latex with correct embed syntax', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex()).toMatch(/\\embed\{[^}]+\}\[\]/);
-      });
-
-      it('should return latex with newLine identifier', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex()).toContain('newLine');
-      });
-
-      it('should return latex with empty bracket notation', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex()).toContain('[]');
-      });
-
-      it('should return latex that matches exact expected format', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex()).toBe('\\embed{newLine}[]');
-      });
-    });
-
-    describe('error handling', () => {
-      it('should not throw if MQ object is valid', () => {
-        expect(() => registerLineBreak(mockMQ)).not.toThrow();
-      });
-
-      it('should handle MQ with additional properties', () => {
-        const extendedMQ = {
-          registerEmbed: mockRegisterEmbed,
-          otherProperty: 'value',
-          otherMethod: jest.fn(),
-        };
-
-        expect(() => registerLineBreak(extendedMQ)).not.toThrow();
-        expect(mockRegisterEmbed).toHaveBeenCalledTimes(1);
-      });
-    });
-
-    describe('function export', () => {
-      it('should export registerLineBreak as a function', () => {
-        expect(typeof registerLineBreak).toBe('function');
-      });
-
-      it('should be callable', () => {
-        expect(() => registerLineBreak(mockMQ)).not.toThrow();
-      });
-
-      it('should accept one parameter', () => {
-        expect(registerLineBreak.length).toBe(1);
-      });
-    });
-
-    describe('embed callback behavior', () => {
-      it('should return functions that are new instances on each call', () => {
-        registerLineBreak(mockMQ);
-
-        const config1 = embedCallback();
-        const config2 = embedCallback();
-
-        expect(config1.text).not.toBe(config2.text);
-        expect(config1.latex).not.toBe(config2.latex);
-      });
-
-      it('should not require any parameters for embed callback', () => {
-        registerLineBreak(mockMQ);
-
-        expect(() => embedCallback()).not.toThrow();
-        expect(() => embedCallback(null)).not.toThrow();
-        expect(() => embedCallback('arg')).not.toThrow();
-      });
-    });
-
-    describe('text function behavior', () => {
-      it('should return a string', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(typeof config.text()).toBe('string');
-      });
-
-      it('should return a non-empty string', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.text().length).toBeGreaterThan(0);
-      });
-
-      it('should return the exact string "testText"', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.text()).toBe('testText');
-      });
-
-      it('should not accept parameters', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.text('ignored')).toBe('testText');
-        expect(config.text(123)).toBe('testText');
-      });
-    });
-
-    describe('latex function behavior', () => {
-      it('should return a string', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(typeof config.latex()).toBe('string');
-      });
-
-      it('should return a non-empty string', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex().length).toBeGreaterThan(0);
-      });
-
-      it('should start with backslash', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex()).toMatch(/^\\/);
-      });
-
-      it('should not accept parameters', () => {
-        registerLineBreak(mockMQ);
-        const config = embedCallback();
-
-        expect(config.latex('ignored')).toBe('\\embed{newLine}[]');
-        expect(config.latex(123)).toBe('\\embed{newLine}[]');
-      });
-    });
-
-    describe('registration validation', () => {
-      it('should register only one embed type', () => {
-        registerLineBreak(mockMQ);
-
-        expect(mockRegisterEmbed).toHaveBeenCalledTimes(1);
-      });
-
-      it('should use consistent embed name', () => {
-        registerLineBreak(mockMQ);
-
-        const firstArg = mockRegisterEmbed.mock.calls[0][0];
-        expect(firstArg).toBe('newLine');
-      });
-
-      it('should not modify the MQ object', () => {
-        const originalMQ = { registerEmbed: mockRegisterEmbed };
-        const mqKeysBeforeCount = Object.keys(originalMQ).length;
-
-        registerLineBreak(originalMQ);
-
-        expect(Object.keys(originalMQ)).toHaveLength(mqKeysBeforeCount);
-      });
-    });
-  });
-});

package/src/mq/__tests__/input.test.jsx

@@ -1,40 +0,0 @@
-import * as React from 'react';
-import { render } from '@testing-library/react';
-import { Input } from '../input';
-
-describe('Input', () => {
-  const onChange = jest.fn();
-  const defaultProps = {
-    classes: {},
-    className: 'className',
-    onChange,
-  };
-
-  beforeEach(() => {
-    onChange.mockClear();
-  });
-
-  describe('rendering', () => {
-    it('renders with default props', () => {
-      const { container } = render(<Input {...defaultProps} />);
-      expect(container.firstChild).toBeInTheDocument();
-      expect(container.firstChild).toHaveClass('className');
-    });
-
-    it('renders with latex prop', () => {
-      const { container } = render(<Input {...defaultProps} latex="x^2" />);
-      expect(container.firstChild).toBeInTheDocument();
-    });
-
-    it('renders with disabled prop', () => {
-      const { container } = render(<Input {...defaultProps} disabled={true} />);
-      expect(container.firstChild).toBeInTheDocument();
-    });
-  });
-
-  // Note: Tests for internal methods (clear, blur, focus, command, keystroke, write)
-  // are implementation details and cannot be directly tested with RTL.
-  // These components are wrappers around MathQuill library and the original tests
-  // focused on testing internal implementation via instance methods rather than user-facing behavior.
-  // The actual MathQuill integration and user interactions are tested through integration/e2e tests.
-});