@pie-element/number-line 13.1.2-next.1 → 13.1.2

package/dist/delivery/number-line/graph/elements/line.js

@@ -1,188 +0,0 @@
-import { Draggable as e } from "../../../draggable/index.js";
-import t from "./point.js";
-import { basePropTypes as n } from "./base.js";
-import r from "react";
-import { styled as i } from "@mui/material/styles";
-import a from "prop-types";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { isEqual as c, isNumber as l } from "@pie-element/shared-lodash";
-import { color as u } from "@pie-lib/render-ui";
-//#region src/delivery/number-line/graph/elements/line.tsx
-var d = "150ms", f = i("g")(({ $disabled: e, $selected: t, $correct: n }) => ({
-	"& .line-handle": {
-		stroke: u.primary(),
-		cursor: "pointer",
-		strokeWidth: "5px",
-		transition: `opacity ${d} linear, 
-    stroke-width ${d} linear,
-    stroke ${d} linear`
-	},
-	"&.dnd-kit-dragging": {
-		opacity: .6,
-		"& .line-handle": {
-			opacity: 1,
-			strokeWidth: "12px"
-		}
-	},
-	...e && {
-		cursor: "not-allowed",
-		opacity: .8
-	},
-	...t && { "& .line-handle": { stroke: u.primaryDark() } },
-	...n === !0 && { "& .line-handle": {
-		cursor: "inherit",
-		stroke: u.correct()
-	} },
-	...n === !1 && { "& .line-handle": {
-		cursor: "inherit",
-		stroke: u.incorrect()
-	} }
-})), p = class extends r.Component {
-	static propTypes = {
-		...n(),
-		empty: a.shape({
-			left: a.bool.isRequired,
-			right: a.bool.isRequired
-		}).isRequired,
-		position: a.shape({
-			left: a.number.isRequired,
-			right: a.number.isRequired
-		}).isRequired,
-		y: a.number,
-		selected: a.bool,
-		disabled: a.bool,
-		correct: a.bool,
-		onMoveLine: a.func.isRequired,
-		onToggleSelect: a.func.isRequired,
-		onDragStart: a.func,
-		onDragStop: a.func
-	};
-	static defaultProps = {
-		selected: !1,
-		y: 0,
-		disabled: !1,
-		correct: void 0
-	};
-	static contextTypes = {
-		xScale: a.func.isRequired,
-		snapValue: a.func.isRequired
-	};
-	constructor(e) {
-		super(e), this.state = {
-			left: null,
-			right: null
-		};
-	}
-	UNSAFE_componentWillReceiveProps(e) {
-		if (e) {
-			let { position: t } = e;
-			this.setState({
-				left: t.left,
-				right: t.right
-			});
-		}
-	}
-	onDrag(e, t) {
-		let { domain: n } = this.props;
-		if (t >= n.min && t <= n.max) {
-			let n = {};
-			n[e] = t, this.setState(n);
-		}
-	}
-	onMove(e, t) {
-		let { position: n } = this.props, r = {
-			left: n.left,
-			right: n.right
-		};
-		r[e] = t, this.props.onMoveLine(r);
-	}
-	render() {
-		let { interval: n, empty: r, position: i, domain: a, y: u, selected: d, disabled: p, correct: m } = this.props, { xScale: h } = this.context, { onDrag: g, onMove: _ } = this, v = _.bind(this, "left"), y = _.bind(this, "right"), b = g.bind(this, "left"), x = g.bind(this, "right"), S = l(this.state.left) ? this.state.left : i.left, C = l(this.state.right) ? this.state.right : i.right, w = h(n) - h(0), T = (e) => e.nativeEvent.preventDefault(), E = () => {
-			this.props.onToggleSelect();
-		}, D = () => {
-			this.props.onToggleSelect();
-		}, O = (e) => {
-			if (Math.abs(e) < w / 10) {
-				this.props.onToggleSelect();
-				return;
-			}
-			let t = h.invert(e + h(0)), n = {
-				left: i.left + t,
-				right: i.right + t
-			};
-			c(n, this.props.position) || this.props.onMoveLine(n);
-		}, k = {
-			left: (a.min - i.left) / n * w,
-			right: (a.max - i.right) / n * w
-		}, A = {
-			interval: n,
-			selected: d,
-			disabled: p,
-			correct: m
-		};
-		return /* @__PURE__ */ o(e, {
-			id: `line-${i.left}-${i.right}-${u}`,
-			disabled: p,
-			grid: [w],
-			bounds: k,
-			onMouseDown: T,
-			onDragEnd: O,
-			children: ({ setNodeRef: e, attributes: n, listeners: c, translateX: l, isDragging: g, onMouseDown: _ }) => /* @__PURE__ */ o(f, {
-				ref: e,
-				$disabled: p,
-				$selected: d,
-				$correct: m,
-				className: g ? "dnd-kit-dragging" : void 0,
-				onMouseDown: _,
-				...n,
-				children: /* @__PURE__ */ s("g", {
-					transform: `translate(${l}, ${u})`,
-					children: [
-						/* @__PURE__ */ o("rect", {
-							x: h(S),
-							width: Math.abs(h(C) - h(S)),
-							fill: "red",
-							fillOpacity: "0.0",
-							y: "-8",
-							height: 16,
-							onClick: D
-						}),
-						/* @__PURE__ */ o("line", {
-							className: "line-handle",
-							x1: h(S),
-							x2: h(C),
-							onClick: E,
-							...c
-						}),
-						/* @__PURE__ */ o(t, {
-							...A,
-							empty: r.left,
-							bounds: {
-								left: a.min - i.left,
-								right: a.max - i.left
-							},
-							position: i.left,
-							onDrag: b,
-							onMove: v,
-							onClick: D
-						}),
-						/* @__PURE__ */ o(t, {
-							...A,
-							empty: r.right,
-							bounds: {
-								left: a.min - i.right,
-								right: a.max - i.right
-							},
-							position: i.right,
-							onDrag: x,
-							onMove: y,
-							onClick: D
-						})
-					]
-				})
-			})
-		});
-	}
-};
-//#endregion
-export { p as default };

package/dist/delivery/number-line/graph/elements/point.d.ts

@@ -1,43 +0,0 @@
-/**
- * @synced-from pie-elements/packages/number-line/src/number-line/graph/elements/point.jsx
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-export declare class Point extends React.Component {
-    static defaultProps: {
-        y: number;
-        selected: boolean;
-        empty: boolean;
-        disabled: boolean;
-        correct: undefined;
-    };
-    static propTypes: {
-        interval: PropTypes.Validator<number>;
-        position: PropTypes.Validator<number>;
-        bounds: PropTypes.Requireable<PropTypes.InferProps<{
-            left: PropTypes.Validator<number>;
-            right: PropTypes.Validator<number>;
-        }>>;
-        selected: PropTypes.Requireable<boolean>;
-        disabled: PropTypes.Requireable<boolean>;
-        correct: PropTypes.Requireable<boolean>;
-        empty: PropTypes.Requireable<boolean>;
-        y: PropTypes.Requireable<number>;
-        onMove: PropTypes.Validator<(...args: any[]) => any>;
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        onDrag: PropTypes.Requireable<(...args: any[]) => any>;
-        onDragStop: PropTypes.Requireable<(...args: any[]) => any>;
-        onDragStart: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    static contextTypes: {
-        xScale: PropTypes.Validator<(...args: any[]) => any>;
-        snapValue: PropTypes.Validator<(...args: any[]) => any>;
-    };
-    render(): React.JSX.Element;
-}
-export default Point;

package/dist/delivery/number-line/graph/elements/point.js

@@ -1,127 +0,0 @@
-import { Draggable as e } from "../../../draggable/index.js";
-import t from "react";
-import { styled as n } from "@mui/material/styles";
-import r from "prop-types";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { color as o } from "@pie-lib/render-ui";
-//#region src/delivery/number-line/graph/elements/point.tsx
-var s = "150ms", c = n("circle")(({ $selected: e, $disabled: t, $correct: n, $empty: r }) => ({
-	cursor: "pointer",
-	transition: `r ${s} linear,  
-  opacity ${s} linear, 
-  fill ${s} linear,
-  stroke ${s} linear`,
-	stroke: o.primary(),
-	fill: o.primary(),
-	"&.dnd-kit-dragging": {
-		opacity: .25,
-		r: "10px"
-	},
-	"&:hover": { stroke: o.primaryDark() },
-	...e && { stroke: o.primaryDark() },
-	...t && {
-		cursor: "not-allowed",
-		opacity: .8
-	},
-	...n === !0 && {
-		cursor: "inherit",
-		stroke: o.correct(),
-		fill: o.correct()
-	},
-	...n === !1 && {
-		cursor: "inherit",
-		stroke: o.incorrect(),
-		fill: o.incorrect()
-	},
-	...r && { fill: "white" }
-})), l = class extends t.Component {
-	static defaultProps = {
-		y: 0,
-		selected: !1,
-		empty: !1,
-		disabled: !1,
-		correct: void 0
-	};
-	static propTypes = {
-		interval: r.number.isRequired,
-		position: r.number.isRequired,
-		bounds: r.shape({
-			left: r.number.isRequired,
-			right: r.number.isRequired
-		}),
-		selected: r.bool,
-		disabled: r.bool,
-		correct: r.bool,
-		empty: r.bool,
-		y: r.number,
-		onMove: r.func.isRequired,
-		onClick: r.func,
-		onDrag: r.func,
-		onDragStop: r.func,
-		onDragStart: r.func
-	};
-	static contextTypes = {
-		xScale: r.func.isRequired,
-		snapValue: r.func.isRequired
-	};
-	render() {
-		let { onDragStop: t, onDragStart: n, onDrag: r, onClick: s, onMove: l, interval: u, y: d, bounds: f, selected: p, position: m, disabled: h, correct: g, empty: _ } = this.props, { snapValue: v, xScale: y } = this.context, b = y(u) - y(0), x = (e) => {
-			let t = e + y(0);
-			return v(m + y.invert(t));
-		}, S = f ? {
-			left: f.left / u * b,
-			right: f.right / u * b
-		} : null;
-		return /* @__PURE__ */ i(e, {
-			id: `point-${m}-${d}`,
-			disabled: h,
-			grid: [b],
-			bounds: S,
-			onMouseDown: (e) => e.nativeEvent.preventDefault(),
-			onDragStart: () => {
-				n && n();
-			},
-			onDragMove: (e) => {
-				let t = x(e);
-				r && r(t);
-			},
-			onDragEnd: (e) => {
-				if (t && t(), Math.abs(e) < b / 10) {
-					s && s();
-					return;
-				}
-				l(x(e));
-			},
-			children: ({ setNodeRef: e, attributes: t, listeners: n, translateX: r, isDragging: s, onMouseDown: l }) => /* @__PURE__ */ a("g", {
-				ref: e,
-				onMouseDown: l,
-				transform: `translate(${r}, 0)`,
-				...t,
-				...n,
-				children: [/* @__PURE__ */ i("circle", {
-					r: "20",
-					strokeWidth: "3",
-					style: {
-						fill: "transparent",
-						pointerEvents: "visibleStroke"
-					},
-					cx: y(m),
-					cy: d,
-					stroke: p ? o.primaryDark() : "none"
-				}), /* @__PURE__ */ i(c, {
-					r: "5",
-					strokeWidth: "3",
-					cx: y(m),
-					cy: d,
-					$selected: p,
-					$disabled: h,
-					$correct: g,
-					$empty: _,
-					className: s ? "dnd-kit-dragging" : void 0
-				})]
-			})
-		});
-	}
-};
-//#endregion
-export { l as default };

package/dist/delivery/number-line/graph/elements/ray.d.ts

@@ -1,43 +0,0 @@
-/**
- * @synced-from pie-elements/packages/number-line/src/number-line/graph/elements/ray.jsx
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-export declare class Ray extends React.Component {
-    static propTypes: {
-        width: PropTypes.Validator<number>;
-        selected: PropTypes.Requireable<boolean>;
-        disabled: PropTypes.Requireable<boolean>;
-        empty: PropTypes.Requireable<boolean>;
-        direction: PropTypes.Requireable<string>;
-        y: PropTypes.Requireable<number>;
-        position: PropTypes.Validator<number>;
-        onMove: PropTypes.Validator<(...args: any[]) => any>;
-        onToggleSelect: PropTypes.Validator<(...args: any[]) => any>;
-        interval: PropTypes.Validator<number>;
-        domain: PropTypes.Requireable<PropTypes.InferProps<{
-            min: PropTypes.Validator<number>;
-            max: PropTypes.Validator<number>;
-        }>>;
-    };
-    static defaultProps: {
-        selected: boolean;
-        direction: string;
-        y: number;
-        disabled: boolean;
-    };
-    static contextTypes: {
-        xScale: PropTypes.Validator<(...args: any[]) => any>;
-        snapValue: PropTypes.Validator<(...args: any[]) => any>;
-    };
-    constructor(props: any);
-    drag(p: any): void;
-    stopDrag(): void;
-    render(): React.JSX.Element;
-}
-export default Ray;

package/dist/delivery/number-line/graph/elements/ray.js

@@ -1,130 +0,0 @@
-import e from "./point.js";
-import { basePropTypes as t } from "./base.js";
-import { correct as n, incorrect as r, selected as i } from "../../colors.js";
-import a from "../arrow.js";
-import o from "react";
-import { styled as s } from "@mui/material/styles";
-import c from "prop-types";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { isNumber as d } from "@pie-element/shared-lodash";
-import { color as f } from "@pie-lib/render-ui";
-//#region src/delivery/number-line/graph/elements/ray.tsx
-var p = s("g")(({ $selected: e, $correct: t }) => ({
-	"& line": {
-		cursor: "pointer",
-		strokeWidth: "5px",
-		stroke: f.primary()
-	},
-	"& line, & .arrow": { transition: "stroke 150ms linear, fill 150ms linear" },
-	...e && {
-		"& line": { stroke: i },
-		"& .arrow": {
-			fill: i,
-			strokeWidth: "1px",
-			stroke: i
-		}
-	},
-	...t === !0 && {
-		"& line": { stroke: n },
-		"& .arrow": {
-			fill: n,
-			strokeWidth: "1px",
-			stroke: n
-		}
-	},
-	...t === !1 && {
-		"& line": { stroke: r },
-		"& .arrow": {
-			fill: r,
-			strokeWidth: "1px",
-			stroke: r
-		}
-	}
-})), m = s(a)(({ $correct: e, $selected: t }) => ({
-	fill: f.primary(),
-	...e === !0 && {
-		fill: n,
-		"--arrow-color": n
-	},
-	...e === !1 && {
-		fill: r,
-		"--arrow-color": r
-	},
-	...t && {
-		fill: i,
-		"--arrow-color": i
-	}
-})), h = class extends o.Component {
-	static propTypes = {
-		...t(),
-		width: c.number.isRequired,
-		selected: c.bool,
-		disabled: c.bool,
-		empty: c.bool,
-		direction: c.oneOf(["positive", "negative"]),
-		y: c.number,
-		position: c.number.isRequired,
-		onMove: c.func.isRequired,
-		onToggleSelect: c.func.isRequired
-	};
-	static defaultProps = {
-		selected: !1,
-		direction: "positive",
-		y: 0,
-		disabled: !1
-	};
-	static contextTypes = {
-		xScale: c.func.isRequired,
-		snapValue: c.func.isRequired
-	};
-	constructor(e) {
-		super(e), this.state = { dragPosition: null };
-	}
-	drag(e) {
-		let { domain: t } = this.props;
-		e >= t.min && e <= t.max && this.setState({ dragPosition: e });
-	}
-	stopDrag() {
-		this.setState({ dragPosition: null });
-	}
-	render() {
-		let { interval: t, empty: n, position: r, direction: i, domain: a, y: o, selected: s, disabled: c, width: f, correct: h } = this.props, { xScale: g } = this.context, _ = this.drag.bind(this), v = this.stopDrag.bind(this), y = d(this.state.dragPosition) ? this.state.dragPosition : r, b = i === "positive", x = b ? y : a.min, S = b ? a.max : y, C = b ? g(x) : 8, w = b ? f - 8 : g(S), T = b ? f : 0, E = b ? "right" : "left";
-		return /* @__PURE__ */ u(p, {
-			$selected: s,
-			$correct: h,
-			transform: `translate(0, ${o})`,
-			children: [
-				/* @__PURE__ */ l("line", {
-					onClick: c ? () => {} : this.props.onToggleSelect,
-					className: "line-handle",
-					x1: C,
-					x2: w
-				}),
-				/* @__PURE__ */ l(e, {
-					disabled: c,
-					correct: h,
-					selected: s,
-					empty: n,
-					interval: t,
-					bounds: {
-						left: a.min - r,
-						right: a.max - r
-					},
-					position: r,
-					onDrag: _,
-					onDragStop: v,
-					onMove: this.props.onMove,
-					onClick: this.props.onToggleSelect
-				}),
-				/* @__PURE__ */ l(m, {
-					x: T,
-					$correct: h,
-					$selected: s,
-					direction: E
-				})
-			]
-		});
-	}
-};
-//#endregion
-export { h as default };

package/dist/delivery/number-line/graph/index.d.ts

@@ -1,59 +0,0 @@
-/**
- * @synced-from pie-elements/packages/number-line/src/number-line/graph/index.jsx
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-export declare class NumberLineGraph extends React.Component {
-    static childContextTypes: {
-        xScale: PropTypes.Validator<(...args: any[]) => any>;
-        snapValue: PropTypes.Validator<(...args: any[]) => any>;
-    };
-    static propTypes: {
-        domain: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-            min: PropTypes.Validator<number>;
-            max: PropTypes.Validator<number>;
-        }>>>;
-        ticks: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-            minor: PropTypes.Requireable<number>;
-            major: PropTypes.Requireable<number>;
-        }>>>;
-        fraction: PropTypes.Requireable<boolean>;
-        width: PropTypes.Validator<number>;
-        height: PropTypes.Validator<number>;
-        onToggleElement: PropTypes.Validator<(...args: any[]) => any>;
-        onMoveElement: PropTypes.Validator<(...args: any[]) => any>;
-        onAddElement: PropTypes.Validator<(...args: any[]) => any>;
-        debug: PropTypes.Requireable<boolean>;
-        elements: PropTypes.Requireable<any[]>;
-        disabled: PropTypes.Requireable<boolean>;
-        onDeselectElements: PropTypes.Requireable<(...args: any[]) => any>;
-        arrows: PropTypes.Requireable<PropTypes.InferProps<{
-            left: PropTypes.Requireable<boolean>;
-            right: PropTypes.Requireable<boolean>;
-        }>>;
-    };
-    static defaultProps: {
-        debug: boolean;
-    };
-    constructor(props: any);
-    xScaleFn(): any;
-    snapValueFn(): (value: any) => number;
-    getChildContext(): {
-        xScale: any;
-        snapValue: (value: any) => number;
-    };
-    /**
-     * Note: we use d3 click + pointer to give us domain values directly.
-     * Saves us having to calculate them ourselves from a MouseEvent.
-     */
-    onRectClick(event: any): void;
-    componentDidMount(): void;
-    addElement(x: any): void;
-    render(): React.JSX.Element;
-}
-export default NumberLineGraph;