eddev 0.2.67-beta1 → 0.3.0-beta1

package/config/get-config.js

@@ -1,20 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getEDConfigFile = exports.getEDConfigUnwrapped = exports.getEDConfig = void 0;
-const fs_1 = require("fs");
-const path_1 = require("path");
-const parse_config_1 = require("./parse-config");
-function getEDConfig(dir = process.cwd()) {
-    const configFile = getEDConfigFile(dir);
+var fs_1 = require("fs");
+var path_1 = require("path");
+var parse_config_1 = require("./parse-config");
+function getEDConfig(dir) {
+    if (dir === void 0) { dir = process.cwd(); }
+    var configFile = getEDConfigFile(dir);
     if (!(0, fs_1.existsSync)(configFile)) {
-        throw new Error(`No config file found at ${configFile}`);
+        throw new Error("No config file found at ".concat(configFile));
     }
-    const config = JSON.parse((0, fs_1.readFileSync)(configFile).toString());
+    var config = JSON.parse((0, fs_1.readFileSync)(configFile).toString());
     return (0, parse_config_1.parseConfig)(config);
 }
 exports.getEDConfig = getEDConfig;
-function getEDConfigUnwrapped(dir = process.cwd()) {
-    const result = getEDConfig(dir);
+function getEDConfigUnwrapped(dir) {
+    if (dir === void 0) { dir = process.cwd(); }
+    var result = getEDConfig(dir);
     if (result.success) {
         return result.data;
     }
@@ -23,7 +25,8 @@ function getEDConfigUnwrapped(dir = process.cwd()) {
     }
 }
 exports.getEDConfigUnwrapped = getEDConfigUnwrapped;
-function getEDConfigFile(dir = process.cwd()) {
+function getEDConfigFile(dir) {
+    if (dir === void 0) { dir = process.cwd(); }
     return (0, path_1.join)(dir, "ed.config.json");
 }
 exports.getEDConfigFile = getEDConfigFile;

package/config/index.js

@@ -1,11 +1,7 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];

package/config/parse-config.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.parseConfig = void 0;
-const config_schema_1 = require("./config-schema");
+var config_schema_1 = require("./config-schema");
 function parseConfig(config) {
     return config_schema_1.EDConfigSchema.safeParse(config);
 }

package/config/print-zod-errors.js

@@ -4,11 +4,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.printZodErrors = void 0;
-const chalk_1 = __importDefault(require("chalk"));
+var chalk_1 = __importDefault(require("chalk"));
 function printZodErrors(err) {
     console.log(chalk_1.default.red("Error parsing ed.config.json:"));
-    err.issues.forEach((issue) => {
-        console.log(`- ${issue.path.join(".")}: ${issue.message}`);
+    err.issues.forEach(function (issue) {
+        console.log("- ".concat(issue.path.join("."), ": ").concat(issue.message));
     });
 }
 exports.printZodErrors = printZodErrors;

package/dev-ui/components/BreakpointColumnHeader.d.ts

@@ -1,4 +1,4 @@
-type Props = {
+declare type Props = {
     lerpStart?: boolean;
     lerps?: boolean;
     name: string;
@@ -6,5 +6,5 @@ type Props = {
     onLerpChange?(lerpStart: boolean): void;
     onDefinedChange?(defined: boolean): void;
 };
-export declare function BreakpointColumnHeader(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare function BreakpointColumnHeader(props: Props): JSX.Element;
 export {};

package/dev-ui/components/BreakpointColumnHeader.js

@@ -1,20 +1,31 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BreakpointColumnHeader = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("../icons");
-const theme_1 = require("../theme");
-const Text_1 = require("./atoms/Text");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var icons_1 = require("../icons");
+var theme_1 = require("../theme");
+var Text_1 = require("./atoms/Text");
 function BreakpointColumnHeader(props) {
-    return ((0, jsx_runtime_1.jsxs)(Wrapper, { children: [(0, jsx_runtime_1.jsx)(Text_1.Text, { align: "center", variant: "monoBold", children: props.name }), (0, jsx_runtime_1.jsx)(ToggleButton, { onClick: () => props.onDefinedChange?.(!props.defined), children: props.defined ? icons_1.checkFilled : icons_1.checkEmpty })] }));
+    return ((0, jsx_runtime_1.jsxs)(Wrapper, { children: [(0, jsx_runtime_1.jsx)(Text_1.Text, __assign({ align: "center", variant: "monoBold" }, { children: props.name }), void 0), (0, jsx_runtime_1.jsx)(ToggleButton, __assign({ onClick: function () { var _a; return (_a = props.onDefinedChange) === null || _a === void 0 ? void 0 : _a.call(props, !props.defined); } }, { children: props.defined ? icons_1.checkFilled : icons_1.checkEmpty }), void 0)] }, void 0));
 }
 exports.BreakpointColumnHeader = BreakpointColumnHeader;
-const Wrapper = (0, theme_1.styled)("div", {
+var Wrapper = (0, theme_1.styled)("div", {
     display: "flex",
     width: "100%",
     flexDirection: "column",
 });
-const ToggleButton = (0, theme_1.styled)("button", {
+var ToggleButton = (0, theme_1.styled)("button", {
     appearance: "none",
     background: "transparent",
     border: "0px",

package/dev-ui/components/BreakpointIndicator.d.ts

@@ -1 +1 @@
-export declare function BreakpointIndicator(): import("react/jsx-runtime").JSX.Element;
+export declare function BreakpointIndicator(): JSX.Element;

package/dev-ui/components/BreakpointIndicator.js

@@ -1,16 +1,27 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BreakpointIndicator = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const useBreakpoint_1 = require("../hooks/useBreakpoint");
-const usePersistState_1 = require("../hooks/usePersistState");
-const theme_1 = require("../theme");
-const Launcher_1 = require("./Launcher");
-const Text_1 = require("./atoms/Text");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var useBreakpoint_1 = require("../hooks/useBreakpoint");
+var usePersistState_1 = require("../hooks/usePersistState");
+var theme_1 = require("../theme");
+var Launcher_1 = require("./Launcher");
+var Text_1 = require("./atoms/Text");
 // @ts-ignore
-const _theme_1 = require("@theme");
-const Tooltip_1 = require("./atoms/Tooltip");
-const colors = [
+var _theme_1 = require("@theme");
+var Tooltip_1 = require("./atoms/Tooltip");
+var colors = [
     { $$bg: "#ff5555", $$fg: "#ffffff" },
     { $$bg: "#55ff55", $$fg: "#000000" },
     { $$bg: "#5555ff", $$fg: "#ffffff" },
@@ -19,22 +30,18 @@ const colors = [
     { $$bg: "#55ffff", $$fg: "#000000" },
 ];
 function BreakpointIndicator() {
-    const bpState = (0, useBreakpoint_1.useBreakpoint)();
-    const maxSize = parseFloat(_theme_1.breakpoints[_theme_1.breakpoints.length - 1].min);
-    const [expanded, setExpanded] = (0, usePersistState_1.usePersistState)("breakpoint_indicator", false);
+    var bpState = (0, useBreakpoint_1.useBreakpoint)();
+    var maxSize = parseFloat(_theme_1.breakpoints[_theme_1.breakpoints.length - 1].min);
+    var _a = (0, usePersistState_1.usePersistState)("breakpoint_indicator", false), expanded = _a[0], setExpanded = _a[1];
     if (!expanded) {
-        return ((0, jsx_runtime_1.jsx)(Simple, { onClick: () => setExpanded(true), css: colors[bpState.index % colors.length], children: (0, jsx_runtime_1.jsx)(Text_1.Text, { variant: "monoBold", children: bpState.name }) }));
+        return ((0, jsx_runtime_1.jsx)(Simple, __assign({ onClick: function () { return setExpanded(true); }, css: colors[bpState.index % colors.length] }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, __assign({ variant: "monoBold" }, { children: bpState.name }), void 0) }), void 0));
     }
-    return ((0, jsx_runtime_1.jsx)(Expanded, { onClick: () => setExpanded(false), children: (0, jsx_runtime_1.jsxs)(Items, { children: [_theme_1.breakpoints.map((bp, index) => {
-                    return ((0, jsx_runtime_1.jsx)(Item, { css: {
-                            ...colors[index % colors.length],
-                            $$offset: parseFloat(bp.min) / maxSize,
-                            $$size: bp.max ? (parseFloat(bp.max) - parseFloat(bp.min)) / maxSize : 0,
-                        }, last: index === _theme_1.breakpoints.length - 1, active: bpState.name === bp.key, children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { label: `${bp.min} - ${bp.max || "∞"}`, nowrap: true, offset: 3, children: (0, jsx_runtime_1.jsx)(Text_1.Text, { variant: "monoTiny", align: "left", children: bp.key }) }) }, index));
-                }), (0, jsx_runtime_1.jsx)(Indicator, { style: { "--eddev--position": Math.min(1, bpState.width / maxSize) }, flipped: bpState.width > maxSize * 0.9, children: (0, jsx_runtime_1.jsxs)(Text_1.Text, { variant: "monoTiny", children: [bpState.width, "px"] }) })] }) }));
+    return ((0, jsx_runtime_1.jsx)(Expanded, __assign({ onClick: function () { return setExpanded(false); } }, { children: (0, jsx_runtime_1.jsxs)(Items, { children: [_theme_1.breakpoints.map(function (bp, index) {
+                    return ((0, jsx_runtime_1.jsx)(Item, __assign({ css: __assign(__assign({}, colors[index % colors.length]), { $$offset: parseFloat(bp.min) / maxSize, $$size: bp.max ? (parseFloat(bp.max) - parseFloat(bp.min)) / maxSize : 0 }), last: index === _theme_1.breakpoints.length - 1, active: bpState.name === bp.key }, { children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, __assign({ label: "".concat(bp.min, " - ").concat(bp.max || "∞"), nowrap: true, offset: 3 }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, __assign({ variant: "monoTiny", align: "left" }, { children: bp.key }), void 0) }), void 0) }), index));
+                }), (0, jsx_runtime_1.jsx)(Indicator, __assign({ style: { "--eddev--position": Math.min(1, bpState.width / maxSize) }, flipped: bpState.width > maxSize * 0.9 }, { children: (0, jsx_runtime_1.jsxs)(Text_1.Text, __assign({ variant: "monoTiny" }, { children: [bpState.width, "px"] }), void 0) }), void 0)] }, void 0) }), void 0));
 }
 exports.BreakpointIndicator = BreakpointIndicator;
-const Expanded = (0, theme_1.styled)(Launcher_1.MenuItem, {
+var Expanded = (0, theme_1.styled)(Launcher_1.MenuItem, {
     position: "relative",
     width: "400px",
     // height: "100%",
@@ -42,16 +49,16 @@ const Expanded = (0, theme_1.styled)(Launcher_1.MenuItem, {
     $$bg: "black !important",
     $$bgHover: "black !important",
 });
-const Simple = (0, theme_1.styled)(Launcher_1.MenuItem, {
+var Simple = (0, theme_1.styled)(Launcher_1.MenuItem, {
     $$bgHover: "$$bg !important",
 });
-const Items = (0, theme_1.styled)("div", {
+var Items = (0, theme_1.styled)("div", {
     position: "absolute",
     inset: "2px 8px",
     paddingBottom: "10px",
     borderRadius: "100px",
 });
-const Item = (0, theme_1.styled)("div", {
+var Item = (0, theme_1.styled)("div", {
     position: "absolute",
     top: 0,
     left: "calc($$offset * 100%)",
@@ -96,7 +103,7 @@ const Item = (0, theme_1.styled)("div", {
         },
     },
 });
-const Indicator = (0, theme_1.styled)("div", {
+var Indicator = (0, theme_1.styled)("div", {
     position: "absolute",
     bottom: 0,
     left: "calc($$position * 100%)",

package/dev-ui/components/DevUI.d.ts

@@ -1 +1 @@
-export default function DevUI(): import("react/jsx-runtime").JSX.Element;
+export default function DevUI(): JSX.Element;

package/dev-ui/components/DevUI.js

@@ -1,23 +1,23 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const usePersistState_1 = require("../hooks/usePersistState");
-const panels_1 = require("../panels");
-const theme_1 = require("../theme");
-const BreakpointIndicator_1 = require("./BreakpointIndicator");
-const Launcher_1 = require("./Launcher");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var usePersistState_1 = require("../hooks/usePersistState");
+var panels_1 = require("../panels");
+var theme_1 = require("../theme");
+var BreakpointIndicator_1 = require("./BreakpointIndicator");
+var Launcher_1 = require("./Launcher");
 function DevUI() {
-    const [open, setOpen] = (0, usePersistState_1.usePersistState)("launcher-is-open", false);
-    const [panel, setPanel] = (0, usePersistState_1.usePersistState)("panel", undefined);
-    const PanelComponent = panel && panel in panels_1.DEV_UI_PANELS ? panels_1.DEV_UI_PANELS[panel].component : undefined;
-    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Launcher_1.Launcher, { panel: panel, open: open, onChange: (open, panel) => {
+    var _a = (0, usePersistState_1.usePersistState)("launcher-is-open", false), open = _a[0], setOpen = _a[1];
+    var _b = (0, usePersistState_1.usePersistState)("panel", undefined), panel = _b[0], setPanel = _b[1];
+    var PanelComponent = panel && panel in panels_1.DEV_UI_PANELS ? panels_1.DEV_UI_PANELS[panel].component : undefined;
+    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Launcher_1.Launcher, { panel: panel, open: open, onChange: function (open, panel) {
                     setOpen(open);
                     setPanel(panel);
-                }, extras: (0, jsx_runtime_1.jsx)(BreakpointIndicator_1.BreakpointIndicator, {}) }), open && PanelComponent && ((0, jsx_runtime_1.jsx)(PanelPosition, { children: (0, jsx_runtime_1.jsx)(PanelComponent, {}) }))] }));
+                }, extras: (0, jsx_runtime_1.jsx)(BreakpointIndicator_1.BreakpointIndicator, {}, void 0) }, void 0), open && PanelComponent && ((0, jsx_runtime_1.jsx)(PanelPosition, { children: (0, jsx_runtime_1.jsx)(PanelComponent, {}, void 0) }, void 0))] }, void 0));
 }
 exports.default = DevUI;
-const PanelPosition = (0, theme_1.styled)("div", {
+var PanelPosition = (0, theme_1.styled)("div", {
     position: "fixed",
     left: "0px",
     bottom: "calc($space$buttonHeight + 5px)",

package/dev-ui/components/Launcher.d.ts

@@ -1,12 +1,12 @@
 import { ReactNode } from "react";
 import { PanelID } from "../panels";
-type Props = {
+declare type Props = {
     open: boolean;
     panel: PanelID | undefined;
     extras?: ReactNode;
     onChange: (open: boolean, panel: PanelID | undefined) => void;
 };
-export declare function Launcher(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Launcher(props: Props): JSX.Element;
 export declare const MenuItem: import("@stitches/react/types/styled-component").StyledComponent<import("@stitches/react/types/styled-component").StyledComponent<"button", {
     state?: "active" | "inactive" | undefined;
     color?: "default" | "black" | undefined;

package/dev-ui/components/Launcher.js

@@ -1,21 +1,33 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MenuItem = exports.Launcher = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("../icons");
-const panels_1 = require("../panels");
-const theme_1 = require("../theme");
-const Button_1 = require("./atoms/Button");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var icons_1 = require("../icons");
+var panels_1 = require("../panels");
+var theme_1 = require("../theme");
+var Button_1 = require("./atoms/Button");
 function Launcher(props) {
-    return ((0, jsx_runtime_1.jsxs)(LauncherWrapper, { children: [(0, jsx_runtime_1.jsx)(LauncherButton, { onClick: (e) => {
+    return ((0, jsx_runtime_1.jsxs)(LauncherWrapper, { children: [(0, jsx_runtime_1.jsx)(LauncherButton, __assign({ onClick: function (e) {
                     props.onChange(!props.open, props.panel);
-                }, children: props.open ? icons_1.close : icons_1.bolt }), (0, jsx_runtime_1.jsxs)(Menu, { children: [props.open &&
-                        Object.entries(panels_1.DEV_UI_PANELS).map(([key, panel]) => {
-                            return ((0, jsx_runtime_1.jsxs)(exports.MenuItem, { state: key === props.panel ? "active" : props.panel ? "inactive" : undefined, onClick: () => props.onChange(true, props.panel === key ? undefined : key), children: [panel.icon, panel.label] }, key));
-                        }), props.extras] })] }));
+                } }, { children: props.open ? icons_1.close : icons_1.bolt }), void 0), (0, jsx_runtime_1.jsxs)(Menu, { children: [props.open &&
+                        Object.entries(panels_1.DEV_UI_PANELS).map(function (_a) {
+                            var key = _a[0], panel = _a[1];
+                            return ((0, jsx_runtime_1.jsxs)(exports.MenuItem, __assign({ state: key === props.panel ? "active" : props.panel ? "inactive" : undefined, onClick: function () { return props.onChange(true, props.panel === key ? undefined : key); } }, { children: [panel.icon, panel.label] }), key));
+                        }), props.extras] }, void 0)] }, void 0));
 }
 exports.Launcher = Launcher;
-const LauncherWrapper = (0, theme_1.styled)("div", {
+var LauncherWrapper = (0, theme_1.styled)("div", {
     position: "fixed",
     bottom: "5px",
     left: "5px",
@@ -26,7 +38,7 @@ const LauncherWrapper = (0, theme_1.styled)("div", {
     $$height: "$space$buttonHeight",
     userSelect: "none",
 });
-const LauncherButton = (0, theme_1.styled)("div", {
+var LauncherButton = (0, theme_1.styled)("div", {
     borderRadius: "100px",
     width: "$$height",
     height: "$$height",
@@ -48,7 +60,7 @@ const LauncherButton = (0, theme_1.styled)("div", {
     },
     cursor: "pointer",
 });
-const Menu = (0, theme_1.styled)("div", {
+var Menu = (0, theme_1.styled)("div", {
     position: "absolute",
     left: "calc($$height + 4px)",
     bottom: 0,

package/dev-ui/components/PanelWrapper.d.ts

@@ -1,8 +1,8 @@
 import { PropsWithChildren, ReactNode } from "react";
-type Props = PropsWithChildren<{
+declare type Props = PropsWithChildren<{
     padded?: boolean;
     title?: string;
     buttons?: ReactNode;
 }>;
-export declare function PanelWrapper(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare function PanelWrapper(props: Props): JSX.Element;
 export {};

package/dev-ui/components/PanelWrapper.js

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PanelWrapper = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const theme_1 = require("../theme");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var theme_1 = require("../theme");
 function PanelWrapper(props) {
-    return ((0, jsx_runtime_1.jsxs)(Wrapper, { children: [(0, jsx_runtime_1.jsxs)(Header, { children: [props.title && (0, jsx_runtime_1.jsx)(Title, { children: props.title }), " ", (0, jsx_runtime_1.jsx)(Buttons, { children: props.buttons })] }), (0, jsx_runtime_1.jsx)(Contents, { children: props.children })] }));
+    return ((0, jsx_runtime_1.jsxs)(Wrapper, { children: [(0, jsx_runtime_1.jsxs)(Header, { children: [props.title && (0, jsx_runtime_1.jsx)(Title, { children: props.title }, void 0), " ", (0, jsx_runtime_1.jsx)(Buttons, { children: props.buttons }, void 0)] }, void 0), (0, jsx_runtime_1.jsx)(Contents, { children: props.children }, void 0)] }, void 0));
 }
 exports.PanelWrapper = PanelWrapper;
-const Wrapper = (0, theme_1.styled)("div", {
+var Wrapper = (0, theme_1.styled)("div", {
     backgroundColor: "$bg",
     color: "$fg",
     borderRadius: "$md",
@@ -16,19 +16,19 @@ const Wrapper = (0, theme_1.styled)("div", {
     fontSize: "$md",
     margin: "5px",
 });
-const Header = (0, theme_1.styled)("div", {
+var Header = (0, theme_1.styled)("div", {
     borderBottom: "1px solid $colors$bgHover",
     padding: "$2",
     display: "flex",
 });
-const Title = (0, theme_1.styled)("div", {
+var Title = (0, theme_1.styled)("div", {
     fontSize: "$lg",
     flex: "1 1 auto",
 });
-const Contents = (0, theme_1.styled)("div", {
+var Contents = (0, theme_1.styled)("div", {
     padding: "$2",
 });
-const Buttons = (0, theme_1.styled)("div", {
+var Buttons = (0, theme_1.styled)("div", {
     display: "flex",
     alignItems: "center",
     "> *": {

package/dev-ui/components/ResponsiveLerpControl.d.ts

@@ -1,7 +1,7 @@
 import { ResponsiveAtomCalc } from "../../style";
-type Props = {
+declare type Props = {
     data: ResponsiveAtomCalc[];
     onToggleLerping?(breakpoint: string, enabled: boolean): void;
 };
-export declare function ResponsiveLerpControl(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare function ResponsiveLerpControl(props: Props): JSX.Element;
 export {};

package/dev-ui/components/ResponsiveLerpControl.js

@@ -1,19 +1,30 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ResponsiveLerpControl = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const icons_1 = require("../icons");
-const theme_1 = require("../theme");
-const Tooltip_1 = require("./atoms/Tooltip");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var icons_1 = require("../icons");
+var theme_1 = require("../theme");
+var Tooltip_1 = require("./atoms/Tooltip");
 function ResponsiveLerpControl(props) {
-    const breakpoints = (0, react_1.useMemo)(() => {
-        return props.data.map((item) => item.breakpoint);
+    var breakpoints = (0, react_1.useMemo)(function () {
+        return props.data.map(function (item) { return item.breakpoint; });
     }, [props.data]);
-    const ranges = (0, react_1.useMemo)(() => {
-        const ranges = [];
-        let currentRange = undefined;
-        props.data.forEach((item, i) => {
+    var ranges = (0, react_1.useMemo)(function () {
+        var ranges = [];
+        var currentRange = undefined;
+        props.data.forEach(function (item, i) {
             if (!currentRange) {
                 currentRange = {
                     fromBP: item.breakpoint,
@@ -44,10 +55,10 @@ function ResponsiveLerpControl(props) {
         });
         return ranges;
     }, [props.data]);
-    const lerpablePoints = (0, react_1.useMemo)(() => {
-        let points = [];
-        let length = 0;
-        ranges.forEach((range) => {
+    var lerpablePoints = (0, react_1.useMemo)(function () {
+        var points = [];
+        var length = 0;
+        ranges.forEach(function (range) {
             if (!range.isEnd && !range.isStart) {
                 points.push({ index: length + range.length / 2, bp: range.fromBP, lerping: range.lerped });
             }
@@ -56,19 +67,19 @@ function ResponsiveLerpControl(props) {
         return points;
     }, [props.data, ranges]);
     console.log("Ranges", ranges, lerpablePoints);
-    return ((0, jsx_runtime_1.jsxs)(Outer, { children: [ranges.map((item, i) => {
-                return ((0, jsx_runtime_1.jsx)(RangeItem, { css: { $$length: item.length }, children: (0, jsx_runtime_1.jsx)(RangeLine, { lerping: item.lerped, hasStart: !item.isStart, hasEnd: !item.isEnd }) }, i));
+    return ((0, jsx_runtime_1.jsxs)(Outer, { children: [ranges.map(function (item, i) {
+                return ((0, jsx_runtime_1.jsx)(RangeItem, __assign({ css: { $$length: item.length } }, { children: (0, jsx_runtime_1.jsx)(RangeLine, { lerping: item.lerped, hasStart: !item.isStart, hasEnd: !item.isEnd }, void 0) }), i));
             }), props.onToggleLerping &&
-                lerpablePoints.map((item, i) => {
-                    return ((0, jsx_runtime_1.jsx)(LerpButton, { onClick: () => {
+                lerpablePoints.map(function (item, i) {
+                    return ((0, jsx_runtime_1.jsx)(LerpButton, __assign({ onClick: function () {
                             if (props.onToggleLerping) {
                                 props.onToggleLerping(item.bp, !item.lerping);
                             }
-                        }, lerping: item.lerping, css: { $$pos: item.index / breakpoints.length }, children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { label: item.lerping ? "Disable Lerping" : "Enable Lerping", nowrap: true, offset: 10, children: (0, jsx_runtime_1.jsx)(LerpButtonInner, { children: item.lerping ? icons_1.close : icons_1.line }) }) }, i));
-                })] }));
+                        }, lerping: item.lerping, css: { $$pos: item.index / breakpoints.length } }, { children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, __assign({ label: item.lerping ? "Disable Lerping" : "Enable Lerping", nowrap: true, offset: 10 }, { children: (0, jsx_runtime_1.jsx)(LerpButtonInner, { children: item.lerping ? icons_1.close : icons_1.line }, void 0) }), void 0) }), i));
+                })] }, void 0));
 }
 exports.ResponsiveLerpControl = ResponsiveLerpControl;
-const Outer = (0, theme_1.styled)("div", {
+var Outer = (0, theme_1.styled)("div", {
     width: "100%",
     $$height: "16px",
     height: "$$height",
@@ -76,18 +87,18 @@ const Outer = (0, theme_1.styled)("div", {
     alignItems: "stretch",
     position: "relative",
 });
-const RangeItem = (0, theme_1.styled)("div", {
+var RangeItem = (0, theme_1.styled)("div", {
     flexGrow: "$$length",
     position: "relative",
 });
-const RangeLine = (0, theme_1.styled)("div", {
+var RangeLine = (0, theme_1.styled)("div", {
     position: "absolute",
     left: "5px",
     right: "5px",
     top: "50%",
     height: "3px",
     transform: "translateY(-50%)",
-    background: `linear-gradient(to right, $$color1, $$color2)`,
+    background: "linear-gradient(to right, $$color1, $$color2)",
     $$segHeight: "8px",
     $$color1: "#888888",
     $$color2: "#888888",
@@ -124,7 +135,7 @@ const RangeLine = (0, theme_1.styled)("div", {
         },
     },
 });
-const LerpButton = (0, theme_1.styled)("div", {
+var LerpButton = (0, theme_1.styled)("div", {
     position: "absolute",
     left: "calc(100% * $$pos)",
     top: "50%",
@@ -153,7 +164,7 @@ const LerpButton = (0, theme_1.styled)("div", {
         },
     },
 });
-const LerpButtonInner = (0, theme_1.styled)("div", {
+var LerpButtonInner = (0, theme_1.styled)("div", {
     "&:before": {
         content: " ",
         display: "block",

package/dev-ui/components/ResponsiveScaleEditor.d.ts

@@ -1,13 +1,13 @@
 import { BreakpointArray } from "../../style";
 export declare const RESPONSIVE_COLUMN_WIDTH = "110px";
 export declare const RESPONSIVE_ROW_HEIGHT = "20px";
-type ModeType = "px" | "multiplier" | "%" | "number";
-type TokenData = {
+declare type ModeType = "px" | "multiplier" | "%" | "number";
+declare type TokenData = {
     [token: string]: {
         [breakpoint: string]: string | [string];
     };
 };
-type Props = {
+declare type Props = {
     editableRange?: boolean;
     editableValues?: boolean;
     showBreakpointName?: boolean;
@@ -21,5 +21,5 @@ type Props = {
     modes: ModeType[];
     onChange(data: TokenData): void;
 };
-export declare function ResponsiveScaleEditor(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare function ResponsiveScaleEditor(props: Props): JSX.Element;
 export {};