@khanacademy/perseus 7.2.1 → 8.0.0

package/dist/components/highlighting/ui/highlight-renderer.js.flow

@@ -1,43 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { DOMHighlight, Position, Rect, ZIndexes } from "./types";
-declare type Props = {|
-  highlight: DOMHighlight,
-  highlightKey: string,
-  offsetParent: Element,
-  zIndexes: ZIndexes,
-|};
-declare type State = {|
-  cachedHighlightRects: $ReadOnlyArray<Rect>,
-|};
-declare class HighlightRenderer extends React.PureComponent<Props, State> {
-  state: State;
-  UNSAFE_componentWillReceiveProps(nextProps: Props): void;
-
-  /**
-   * Compute the set of rectangles that cover the highlighted content, with
-   * coordinates relative to the offset parent. That way, we can use them
-   * for CSS positioning.
-   */
-  _computeRects(props: Props): $ReadOnlyArray<Rect>;
-
-  /**
-   * Return whether the given mouse position (coordinates relative to this
-   * component's offset parent) is hovering over the given rectangle
-   * (coordinates also relative to this component's offset parent).
-   */
-  _rectIsHovered(rect: Rect, mouseOffsetPosition: Position): boolean;
-
-  /**
-   * Return whether the given mouse position (coordinates relative to the
-   * viewport) is hovering over this highlight.
-   */
-  isHovered(mouseClientPosition?: Position | null): boolean;
-  render(): React.Node;
-}
-declare export default typeof HighlightRenderer;

package/dist/components/highlighting/ui/highlight-set-renderer.js.flow

@@ -1,41 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import HighlightRenderer from "./highlight-renderer";
-import type { DOMHighlightSet, Position, ZIndexes } from "./types";
-declare type Props = {|
-  editable: boolean,
-  highlights: DOMHighlightSet,
-  offsetParent: Element,
-  onRemoveHighlight: (highlightKey: string) => mixed,
-  zIndexes: ZIndexes,
-|};
-declare type State = {|
-  hoveredHighlightKey: string | null | void,
-  hoveringTooltipFor: string | null | void,
-|};
-declare class HighlightSetRenderer extends React.PureComponent<Props, State> {
-  state: State;
-  _highlightRenderers: {
-    [highlightKey: string]: HighlightRenderer,
-  };
-  componentDidMount(): void;
-  UNSAFE_componentWillReceiveProps(nextProps: Props): void;
-  componentWillUnmount(): void;
-
-  /**
-   * Given whether we were previously listening to mousemove events, and
-   * whether we will now listen to mousemove events, add or remove the
-   * listener accordingly.
-   */
-  _updateEditListeners(wasListening: boolean, willListen: boolean): void;
-  _handleMouseMove: (e: MouseEvent) => void;
-  _getHoveredHighlightKey(mouseClientPosition: Position): string | null | void;
-  _renderTooltip(): null | React.Node;
-  render(): React.Node;
-}
-declare export default typeof HighlightSetRenderer;

package/dist/components/highlighting/ui/highlight-tooltip.js.flow

@@ -1,22 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { Rect } from "./types";
-declare type Props = {|
-  label: string,
-  onClick: () => mixed,
-  onMouseEnter?: () => mixed,
-  onMouseLeave?: () => mixed,
-  focusNode: Node,
-  focusOffset: number,
-  offsetParent: Element,
-|};
-declare class HighlightTooltip extends React.PureComponent<Props> {
-  _getFocusRect(): Rect | null | void;
-  render(): null | React.Node;
-}
-declare export default typeof HighlightTooltip;

package/dist/components/highlighting/ui/highlighting-ui.js.flow

@@ -1,30 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { TrackedSelection } from "./selection-tracker";
-import type {
-  DOMHighlight,
-  DOMHighlightSet,
-  DOMRange,
-  ZIndexes,
-} from "./types";
-declare type Props = {|
-  buildHighlight: (range: DOMRange) => DOMHighlight | null | void,
-  contentNode: Node,
-  editable: boolean,
-  highlights: DOMHighlightSet,
-  offsetParent: Element,
-  onAddHighlight: (range: DOMHighlight) => mixed,
-  onRemoveHighlight: (highlightKey: string) => mixed,
-  zIndexes: ZIndexes,
-|};
-declare class HighlightingUI extends React.PureComponent<Props> {
-  _handleAddHighlight(highlightToAdd: DOMHighlight): void;
-  _selectionIsValid(trackedSelection?: TrackedSelection | null): boolean;
-  render(): React.Node;
-}
-declare export default typeof HighlightingUI;

package/dist/components/highlighting/ui/selection-tracker.js.flow

@@ -1,54 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { DOMHighlight, DOMRange } from "./types";
-export type TrackedSelection = {|
-  focusNode: Node,
-  focusOffset: number,
-  proposedHighlight: DOMHighlight,
-|};
-declare type Props = {|
-  buildHighlight: (domRange: DOMRange) => DOMHighlight | null | void,
-  children?: (
-    trackedSelection: TrackedSelection | null | void,
-    userIsMouseSelecting: boolean
-  ) => React.Element<any>,
-  enabled: boolean,
-|};
-declare type State = {|
-  mouseState: "down" | "down-and-selecting" | "up",
-  trackedSelection: TrackedSelection | null | void,
-|};
-declare class SelectionTracker extends React.PureComponent<Props, State> {
-  state: State;
-  componentDidMount(): void;
-  componentDidUpdate(prevProps: Props): void;
-  componentWillUnmount(): void;
-  _updateListeners(wasListening: boolean, willListen: boolean): void;
-
-  /**
-   * Get the current selection focus and range, if present and non-collapsed.
-   *
-   * Otherwise, if there is no current selection or it's collapsed, return
-   * null.
-   */
-  _computeFocusAndRange(): {|
-    focusNode: Node,
-    focusOffset: number,
-    range: DOMRange,
-  |} | null | void;
-
-  /**
-   * Compute and update the TrackedSelection to reflect the document state.
-   */
-  _updateTrackedSelection(): void;
-  _handleSelectionChange: () => void;
-  _handleMouseDown: () => void;
-  _handleMouseUp: () => void;
-  render(): null | React.Element<"div">;
-}
-declare export default typeof SelectionTracker;

package/dist/components/highlighting/ui/types.js.flow

@@ -1,22 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import type { DOMHighlight, DOMHighlightSet, DOMRange } from "../types";
-export type { DOMHighlight, DOMHighlightSet, DOMRange };
-export type Position = {|
-  left: number,
-  top: number,
-|};
-export type Rect = {|
-  ...Position,
-  ...{|
-    width: number,
-    height: number,
-  |},
-|};
-export type ZIndexes = {|
-  belowContent: number,
-|};

package/dist/components/highlighting/ui/util.js.flow

@@ -1,42 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import type { DOMRange, Position, Rect } from "./types";
-
-/**
- * Given two positions relative to the same origin, return `child`'s position
- * relative to `parent`'s position.
- */
-declare export function getRelativePosition(
-  child: Position,
-  parent: Position
-): Position;
-
-/**
- * `getRelativePosition`, but for Rects.
- *
- * Given a rectangle and a position relative to the same origin, return a new
- * rectangle of the same size, whose position is relative to the given
- * position.
- */
-declare export function getRelativeRect(x: Rect, parent: Position): Rect;
-
-/**
- * Given a DOMRange, return a list of client-relative rects that cover the text
- * inside the DOMRange.
- *
- * This behaves differently than the browser's built-in `getClientRects` method
- * for DOMRanges, because this method only gets rects for the *text* nodes,
- * whereas the browser's method will also return rects for any fully-contained
- * *element* nodes.
- *
- * For example, if an entire paragraph is selected, then `getClientRects` will
- * return a rectangle that covers the entire paragraph block, whereas this
- * method will only return rectangles for the text inside the paragraph.
- */
-declare export function getClientRectsForTextInRange(
-  range: DOMRange
-): $ReadOnlyArray<Rect>;

package/dist/components/highlighting/word-indexer.js.flow

@@ -1,21 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { DOMRange } from "./types";
-declare type Props = {|
-  children?: React.Element<any>,
-  onWordsUpdate: (wordRanges: $ReadOnlyArray<DOMRange>) => mixed,
-|};
-declare class WordIndexer extends React.PureComponent<Props> {
-  _container: HTMLElement | null | void;
-  componentDidMount(): void;
-  componentDidUpdate(): void;
-  _sendWordsUpdate(): void;
-  _getWordRanges(): $ReadOnlyArray<DOMRange>;
-  render(): React.Node;
-}
-declare export default typeof WordIndexer;

package/dist/components/hud.js.flow

@@ -1,14 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-declare type Props = {|
-  message: string,
-  enabled: boolean,
-  onClick: () => void,
-  fixedPosition?: boolean,
-|};
-declare var HUD: (x: Props) => React$Node;
-declare export default typeof HUD;

package/dist/components/icon.js.flow

@@ -1,31 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { CSSProperties } from "aphrodite";
-export type IconType = {|
-  height: number,
-  path: string,
-  width: number,
-|};
-declare type Props = {|
-  className?: string,
-  style?: CSSProperties,
-  title?: string,
-  color: string,
-  focusable?: boolean,
-  icon: IconType | string,
-  pathClassName?: string,
-  size?: number,
-  alt?: string,
-|};
-declare class Icon extends React.Component<Props> {
-  static defaultProps: {|
-    color: string,
-  |};
-  render(): React.Node;
-}
-declare export default typeof Icon;

package/dist/components/image-loader.js.flow

@@ -1,49 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { Dimensions } from "../types";
-declare var Status: {|
-  +PENDING: "pending",
-  +LOADING: "loading",
-  +LOADED: "loaded",
-  +FAILED: "failed",
-|};
-export type ImageProps = {|
-  alt: string,
-  title?: string,
-  "aria-hidden": boolean | void,
-  tabIndex?: string,
-  onClick?: (e: SyntheticEvent<>) => void,
-  style?: Dimensions,
-|};
-declare type Props = {|
-  children?: React.Node,
-  imgProps: ImageProps,
-  onError?: (event: Event) => void,
-  onLoad?: (event: Event) => void,
-  onUpdate: (status: $ElementType<typeof Status, $Keys<typeof Status>>) => void,
-  preloader: () => React.Element<any> | null | void,
-  src: string,
-|};
-declare type State = {|
-  status: $ElementType<typeof Status, $Keys<typeof Status>>,
-|};
-declare class ImageLoader extends React.Component<Props, State> {
-  img: HTMLImageElement | null | void;
-  constructor(props: Props): this;
-  componentDidMount(): void;
-  UNSAFE_componentWillReceiveProps(nextProps: Props): void;
-  componentDidUpdate(prevProps: Props, prevState: State): void;
-  componentWillUnmount(): void;
-  createLoader: () => void;
-  destroyLoader: () => void;
-  handleLoad: (event: Event) => void;
-  handleError: (error: Event) => void;
-  renderImg: () => React.Element<"img">;
-  render(): React.Node;
-}
-declare export default typeof ImageLoader;

package/dist/components/info-tip/info-tip.js.flow

@@ -1,20 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-declare type Props = {|
-  children: React.Node,
-|};
-declare type State = {|
-  hover: boolean,
-|};
-declare class InfoTip extends React.Component<Props, State> {
-  state: State;
-  handleMouseEnter: () => void;
-  handleMouseLeave: () => void;
-  render(): React.Node;
-}
-declare export default typeof InfoTip;

package/dist/components/info-tip.js.flow

@@ -1,18 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import ReactComponentsInfoTip from "./info-tip/info-tip";
-declare type Props = React.ElementConfig<typeof ReactComponentsInfoTip>;
-declare type State = {|
-  didMount: boolean,
-|};
-declare class InfoTip extends React.Component<Props, State> {
-  state: State;
-  componentDidMount(): void;
-  render(): React.Node;
-}
-declare export default typeof InfoTip;

package/dist/components/inline-icon.js.flow

@@ -1,39 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-declare type InlineIconProps = {|
-  path: string,
-  height: number,
-  width: number,
-  style?: React.CSSProperties,
-  title?: string,
-|};
-/**
- * A stripped version of Icon.jsx from webapp. Takes an SVG icon and renders it
- * inline like Font Awesome did.
- *
- * If you are looking for an icon that we've used before you should look in
- * webapp's `icon-paths.js` which is a reference file for all the SVG paths
- * that we've used. You'll need to copy the object from that file into
- * whichever file you're using the icon and explicitly pass it in to the
- * <InlineIcon/> React component.
- *
- * We assume that the viewBox is cropped and aligned to (0, 0), but icons can
- * be defined differently. At some point we might want to add these attributes
- * to `icon-paths.js`, but for now this is a fairly safe assumption.
- *
- * Sample usage:
- *
- *   const editIcon = {
- *      path: "M41.209 53.753l5.39 0l0 5.39l3.136 0l6.468-6.517-8.477-8.526-6.517 6.517l0 3.136zm33.173-34.937q-.882-.882-1.862.049l-19.6 19.6q-.931.98-.049 1.862t1.862-.049l19.6-19.6q.931-.98.049-1.862zm-38.563 45.668l0-16.121l37.632-37.632 16.17 16.121-37.632 37.632l-16.17 0zm43.022-12.397l0 10.633q-.049 6.713-4.753 11.417t-11.368 4.704l-46.599 0q-6.713 0-11.417-4.753t-4.704-11.368l0-46.599q0-6.664 4.753-11.417t11.368-4.704l46.599 0q3.528 0 6.566 1.372.833.392.98 1.323t-.49 1.617l-2.744 2.744q-.784.784-1.96.441t-2.352-.343l-46.599 0q-3.675 0-6.321 2.646t-2.646 6.321l0 46.599q0 3.675 2.646 6.321t6.321 2.646l46.599 0q3.675 0 6.321-2.646t2.646-6.321l0-7.056q0-.735.49-1.225l3.577-3.577q.833-.833 1.96-.392t1.127 1.617zm7.203-51.646q2.254 0 3.773 1.568l8.526 8.526q1.568 1.568 1.568 3.822t-1.568 3.773l-5.145 5.145-16.121-16.121 5.145-5.145q1.568-1.568 3.822-1.568z",
- *      width: 100,
- *      height: 78.912,
- *   };
- *   <InlineIcon {...editIcon} />
- */
-declare var InlineIcon: (x: InlineIconProps) => React.Element<any>;
-declare export default typeof InlineIcon;

package/dist/components/input-with-examples.js.flow

@@ -1,58 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-import type { LinterContextProps } from "../types";
-import type { StyleType } from "@khanacademy/wonder-blocks-core";
-declare type Props = {|
-  type: "math" | "text" | "tex",
-  value: string,
-  onChange: any,
-  className: string,
-  examples: $ReadOnlyArray<string>,
-  shouldShowExamples: boolean,
-  convertDotToTimes?: boolean,
-  buttonSet?: string,
-  buttonsVisible?: "always" | "never" | "focused",
-  labelText?: string,
-  onFocus: () => void,
-  onBlur: () => void,
-  disabled: boolean,
-  style?: StyleType,
-  id: string,
-  linterContext: LinterContextProps,
-|};
-declare type DefaultProps = {|
-  type: $PropertyType<Props, "type">,
-  shouldShowExamples: $PropertyType<Props, "shouldShowExamples">,
-  onFocus: $PropertyType<Props, "onFocus">,
-  onBlur: $PropertyType<Props, "onBlur">,
-  disabled: $PropertyType<Props, "disabled">,
-  linterContext: $PropertyType<Props, "linterContext">,
-  className: $PropertyType<Props, "className">,
-|};
-declare type State = {|
-  focused: boolean,
-  showExamples: boolean,
-|};
-declare class InputWithExamples extends React.Component<Props, State> {
-  static defaultProps: DefaultProps;
-  state: State;
-  _getUniqueId: () => string;
-  _getInputClassName: () => string;
-  _getPropsForInputType: () => any;
-  _getComponentForInputType: () => any;
-  _renderInput: () => any;
-  render(): React.Node;
-  _handleFocus: () => void;
-  show: () => void;
-  hide: () => void;
-  _handleBlur: () => void;
-  focus: () => void;
-  blur: () => void;
-  handleChange: (arg1: any) => void;
-}
-declare export default typeof InputWithExamples;

package/dist/components/lint.js.flow

@@ -1,58 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-
-declare var Severity: {|
-  +Error: 1, // 1
-  +Warning: 2, // 2
-  +Recommendation: 3, // 3
-  +OfflineReportingOnly: 4, // 4
-|};
-declare type Props = {|
-  children: React.Node,
-  inline?: boolean,
-  message: string,
-  ruleName: string,
-  insideTable: boolean,
-  blockHighlight?: boolean,
-  severity?: $Values<typeof Severity>,
-|};
-declare type State = {|
-  tooltipAbove: boolean,
-|};
-/**
- * This component renders "lint" nodes in a markdown parse tree. Lint nodes
- * are inserted into the tree by the Perseus linter (see
- * perseus-linter/src/index).
- *
- * This component serves multiple purposes
- *
- * 1) It renders a small circle in the right margin to indicate that there
- * is lint on (or near) that line.
- *
- * 2) The area around the circle is hoverable: when the mouse moves over it
- * the linty content is highlighted and a tooltip is displayed that explains
- * what the problem is.
- *
- * 3) The hoverable area is also an HTML <a> tag. Clicking on it opens
- * a new tab and links to additional details about the specific lint rule.
- *
- * The CSS required to position the circles in the right margin is tricky
- * and it does not always work perfectly. When lint occurs on a block element
- * that has a right margin (like anything blockquoted) the circle will appear
- * to the left of where it belongs.  And if there is more
- */
-declare class Lint extends React.Component<Props, State> {
-  _positionTimeout: number | void;
-  state: State;
-  componentDidMount(): void;
-  componentWillUnmount(): void;
-  getPosition: () => void;
-  renderLink: (arg1: any) => React.Element<any>;
-  render(): React.Node;
-}
-declare export default typeof Lint;

package/dist/components/math-input.js.flow

@@ -1,49 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import { MathFieldInterface } from "@khanacademy/math-input";
-import * as React from "react";
-import type { ButtonSetsType } from "./tex-buttons";
-declare type ButtonsVisibleType = "always" | "never" | "focused";
-declare type Props = {|
-  className?: string,
-  value: string,
-  onChange: any,
-  convertDotToTimes: boolean,
-  buttonsVisible: ButtonsVisibleType,
-  buttonSets: ButtonSetsType,
-  labelText?: string,
-  onFocus?: () => void,
-  onBlur?: () => void,
-|};
-declare type DefaultProps = {|
-  value: $PropertyType<Props, "value">,
-  convertDotToTimes: $PropertyType<Props, "convertDotToTimes">,
-  buttonsVisible: $PropertyType<Props, "buttonsVisible">,
-|};
-declare type State = {|
-  focused: boolean,
-|};
-declare class MathInput extends React.Component<Props, State> {
-  mouseDown: boolean;
-  __mathFieldWrapperRef: HTMLSpanElement | null;
-  __mathField: MathFieldInterface | null;
-  static defaultProps: DefaultProps;
-  state: State;
-  componentDidMount(): void;
-  componentWillUnmount(): void;
-  handleFocus: () => void;
-  handleMouseDown: (arg1: MouseEvent) => void;
-  handleMouseUp: (arg1: MouseEvent) => void;
-  handleBlur: (arg1: SyntheticFocusEvent<>) => void;
-  _shouldShowButtons: () => boolean;
-  insert: (value: any) => void;
-  mathField: () => MathFieldInterface | null;
-  focus: () => void;
-  blur: () => void;
-  render(): React.Node;
-}
-declare export default typeof MathInput;

package/dist/components/math-output.js.flow

@@ -1,33 +0,0 @@
-/**
- * Flowtype definitions for data
- * Generated by Flowgen from a Typescript Definition
- * Flowgen v1.21.0
- * @flow
- */
-import * as React from "react";
-declare type Props = {|
-  value: string | number,
-  className?: string,
-  labelText?: string,
-  onFocus: () => void,
-  onBlur: () => void,
-|};
-declare type DefaultProps = Pick<Props, "value" | "onFocus" | "onBlur">;
-declare type State = {|
-  focused: boolean,
-  selectorNamespace: string,
-|};
-declare class MathOutput extends React.Component<Props, State> {
-  static defaultProps: DefaultProps;
-  state: State;
-  _getInputClassName: () => string;
-  _getDisplayValue: (arg1: string | number) => string;
-  render(): React.Node;
-  getValue: () => string | number;
-  focus: () => void;
-  blur: () => void;
-  _bindBlurHandler: () => void;
-  _unbindBlurHandler: () => void;
-  componentWillUnmount(): void;
-}
-declare export default typeof MathOutput;