ag-common 0.0.798 → 0.0.800

package/dist/ui/components/DropdownList/Base.js

@@ -1,178 +0,0 @@
-"use strict";
-'use client';
-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);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownList = DropdownList;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const dom_1 = require("../../helpers/dom");
-const useOnClickOutside_1 = require("../../helpers/useOnClickOutside");
-const colours_1 = require("../../styles/colours");
-const common_1 = require("../../styles/common");
-const KebabDots_1 = require("../KebabDots");
-const Base = styled_1.default.div `
-  display: flex;
-  flex-flow: row;
-  position: relative;
-  align-items: center;
-  justify-content: space-between;
-  cursor: pointer;
-  flex-grow: 0;
-  max-height: 100%;
-`;
-const DropItems = styled_1.default.div `
-  flex-flow: column;
-  z-index: 1;
-  display: none;
-  background-color: white;
-  cursor: default;
-  width: 100%;
-  position: absolute;
-
-  overflow-y: auto;
-  &[data-open='true'] {
-    display: flex;
-  }
-  ${(0, common_1.bounce)('data-bounced')}
-`;
-const ListItemStyle = styled_1.default.div `
-  font-weight: 500;
-  padding-left: 0.5rem;
-  flex-grow: 1;
-  padding: 1rem;
-  cursor: pointer;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  &[data-default='false'] {
-    &[data-selected='true'] {
-      opacity: 1 !important;
-      background-color: ${colours_1.colours.orangeRed} !important;
-      cursor: default;
-    }
-    &[data-selected='false'] {
-      &:hover {
-        opacity: 0.9 !important;
-        background-color: ${colours_1.colours.orange} !important;
-      }
-    }
-  }
-
-  &:nth-of-type(even) {
-    background-color: rgba(0, 0, 0, 0.1);
-  }
-  &:nth-of-type(odd) {
-    background-color: rgba(0, 0, 0, 0.2);
-  }
-`;
-const ListItem = ({ render, onChange, selected, defaultV = false, }) => (react_1.default.createElement(ListItemStyle, { "data-type": "ddl-item", "data-selected": selected, "data-default": defaultV, onClick: (e) => {
-        if (!selected) {
-            onChange === null || onChange === void 0 ? void 0 : onChange();
-        }
-        e.preventDefault();
-    } }, render));
-function DropdownList(p) {
-    var _a;
-    const { shadow = '#555', maxHeight = '50vh' } = p;
-    const ref = (0, react_1.useRef)(null);
-    const [state, setState] = (0, react_1.useState)(p.value);
-    const [open, setOpen] = (0, react_1.useState)(p.open);
-    const [bounced, setBounced] = (0, react_1.useState)(false);
-    (0, useOnClickOutside_1.useOnClickOutside)({ disabled: !open, ref: ref, moveMouseOutside: false }, () => {
-        var _a;
-        setOpen(false);
-        setBounced(false);
-        (_a = p.onClose) === null || _a === void 0 ? void 0 : _a.call(p);
-    });
-    (0, react_1.useEffect)(() => {
-        const newv = p.value;
-        if (JSON.stringify(newv) !== JSON.stringify(state)) {
-            setState(newv);
-        }
-    }, [p.value, state]);
-    const [style, setStyle] = (0, react_1.useState)({});
-    (0, react_1.useEffect)(() => {
-        var _a, _b, _c, _d;
-        const maxLen = 20;
-        const newStyle = {
-            minWidth: `calc(${maxLen}ch + 2rem)`,
-            filter: `drop-shadow(1px 1px 0.5rem ${shadow})`,
-            maxHeight,
-            width: 'fit-content',
-        };
-        const minPx = (0, dom_1.convertRemToPixels)(2 + maxLen / 2);
-        const offsetLeft = (_b = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.offsetLeft) !== null && _b !== void 0 ? _b : 0;
-        if (offsetLeft < minPx) {
-            newStyle.left = '0';
-        }
-        else {
-            newStyle.right = '0';
-        }
-        const b = (_d = (_c = ref.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect()) !== null && _d !== void 0 ? _d : { bottom: 0 };
-        const ih = typeof window !== 'undefined' ? window.innerHeight : 0;
-        //below screen
-        if (b.bottom + 50 > ih) {
-            newStyle.bottom = '1rem';
-        }
-        else {
-            newStyle.top = '0';
-        }
-        if (JSON.stringify(style) !== JSON.stringify(newStyle)) {
-            setStyle(newStyle);
-        }
-    }, [maxHeight, open, p.options, p.renderF, shadow, style]);
-    const defaultRender = !p.value ? react_1.default.createElement(KebabDots_1.KebabDots, null) : react_1.default.createElement(react_1.default.Fragment, null, p.renderF(p.value, 0));
-    const openDisplay = (_a = p.children) !== null && _a !== void 0 ? _a : (react_1.default.createElement(ListItem, { selected: true, render: defaultRender, key: defaultRender.key, defaultV: !p.value }));
-    (0, react_1.useEffect)(() => {
-        if (!bounced && open) {
-            setBounced(true);
-        }
-    }, [bounced, open]);
-    return (react_1.default.createElement(Base, { className: p.className, ref: ref, title: p.placeholder, onClick: (e) => {
-            var _a;
-            e.stopPropagation();
-            e.preventDefault();
-            setOpen(!open);
-            if (open) {
-                (_a = p.onClose) === null || _a === void 0 ? void 0 : _a.call(p);
-            }
-        } },
-        react_1.default.createElement(DropItems, { "data-open": open, style: style, "data-bounced": bounced }, open &&
-            p.options.map((s, i) => (react_1.default.createElement(ListItem, { key: typeof s === 'string' ? s : p.renderF(s, i).key, render: p.renderF(s, i), onChange: () => p.onChange(s, i), selected: s === state })))),
-        openDisplay));
-}

package/dist/ui/components/DropdownList/Dialog.d.ts

@@ -1,7 +0,0 @@
-import type { IDropdownList } from './types';
-export declare const DropdownListDialog: <T>(p: {
-    position: {
-        x: number;
-        y: number;
-    };
-} & Omit<IDropdownList<T>, "onChange">) => Promise<undefined | [v: T, index: number]>;

package/dist/ui/components/DropdownList/Dialog.js

@@ -1,54 +0,0 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownListDialog = void 0;
-const react_1 = __importDefault(require("react"));
-const client_1 = require("react-dom/client");
-const index_1 = require("./index");
-const DropdownListDialog = (p) => __awaiter(void 0, void 0, void 0, function* () {
-    return new Promise((res) => {
-        const id = 'ag-common-ddld';
-        //already open
-        if (document.querySelectorAll('#' + id).length) {
-            return;
-        }
-        const wrapper = document.body.appendChild(document.createElement('div'));
-        wrapper.id = id;
-        wrapper.style.position = 'absolute';
-        wrapper.style.top = `${p.position.y}px`;
-        wrapper.style.left = `${p.position.x}px`;
-        const root = (0, client_1.createRoot)(wrapper);
-        root.render(react_1.default.createElement(index_1.DropdownList, Object.assign({}, p, { open: true, onClose: () => {
-                try {
-                    root.unmount();
-                    wrapper.remove();
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                }
-                catch (e) {
-                    //
-                }
-            }, onChange: (v, i) => {
-                try {
-                    root.unmount();
-                    wrapper.remove();
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                }
-                catch (e) {
-                    //
-                }
-                res(!v ? undefined : [v, i]);
-            } }), "\u00A0"));
-    });
-});
-exports.DropdownListDialog = DropdownListDialog;

package/dist/ui/components/DropdownList/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Base';
-export * from './Dialog';

package/dist/ui/components/DropdownList/index.js

@@ -1,18 +0,0 @@
-"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);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Base"), exports);
-__exportStar(require("./Dialog"), exports);

package/dist/ui/components/DropdownList/types.d.ts

@@ -1,37 +0,0 @@
-import type { JSX } from 'react';
-export interface IDropdownList<T> {
-    /**
-     * all items that can be in dropdown
-     */
-    options: T[];
-    /**
-     * selected item from options. closing will return undefined
-     */
-    value?: T;
-    onChange: (v: T | undefined, index: number) => void;
-    /** will call on close/click outside */
-    onClose?: () => void;
-    /**
-     * placeholder title for list
-     */
-    placeholder?: string;
-    className?: string;
-    /**
-     * function to render value
-     */
-    renderF: (v: T, index: number) => JSX.Element;
-    /**
-     * colour of dropdown shadow. default #555
-     */
-    shadow?: string;
-    /**
-     * max height of items list. default 50vh
-     */
-    maxHeight?: string;
-    /**
-     * if not provided, will default display value, then kebab dots
-     */
-    children?: React.ReactNode;
-    /** default false */
-    open?: boolean;
-}

package/dist/ui/components/DropdownList/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/ui/components/FlexColumn/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import type { IFlexColumn } from '../RowOrColumn';
-export declare const FlexColumn: (props: IFlexColumn) => React.JSX.Element;

package/dist/ui/components/FlexColumn/index.js

@@ -1,31 +0,0 @@
-"use strict";
-'use client';
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FlexColumn = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const Base = styled_1.default.div `
-  position: relative;
-  display: flex;
-  flex-flow: column;
-  flex-grow: 1;
-  width: 100%;
-  height: 100%;
-  &[data-center='true'] {
-    justify-content: center;
-    align-items: center;
-  }
-  &[data-nogrow='true'] {
-    flex-grow: 0;
-    width: unset;
-    height: unset;
-  }
-`;
-const FlexColumn = (props) => {
-    var _a, _b;
-    return (react_1.default.createElement(Base, Object.assign({ "data-nogrow": (_a = props.noGrow) !== null && _a !== void 0 ? _a : false, "data-center": (_b = props.center) !== null && _b !== void 0 ? _b : false }, props), props.children));
-};
-exports.FlexColumn = FlexColumn;

package/dist/ui/components/FlexRow/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import type { IFlexRow } from '../RowOrColumn';
-export declare const FlexRow: (props: IFlexRow) => React.JSX.Element;

package/dist/ui/components/FlexRow/index.js

@@ -1,37 +0,0 @@
-"use strict";
-'use client';
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FlexRow = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const Base = styled_1.default.div `
-  position: relative;
-  display: flex;
-  flex-flow: row wrap;
-
-  &[data-nowrap='true'] {
-    flex-flow: row;
-  }
-
-  &[data-nogrow='true'] {
-    flex-grow: 0;
-  }
-  &[data-nogrow='false'] {
-    width: 100%;
-    height: 100%;
-    flex-grow: 1;
-  }
-
-  &[data-center='true'] {
-    justify-content: center;
-    align-items: center;
-  }
-`;
-const FlexRow = (props) => {
-    var _a, _b, _c;
-    return (react_1.default.createElement(Base, Object.assign({ "data-nowrap": (_a = props.noWrap) !== null && _a !== void 0 ? _a : false, "data-nogrow": (_b = props.noGrow) !== null && _b !== void 0 ? _b : false, "data-center": (_c = props.center) !== null && _c !== void 0 ? _c : false }, props), props.children));
-};
-exports.FlexRow = FlexRow;

package/dist/ui/components/HorizontalScrollBar/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const HorizontalScrollBar: ({ children, className, }: {
-    children: React.ReactNode;
-    className?: string;
-}) => React.JSX.Element;

package/dist/ui/components/HorizontalScrollBar/index.js

@@ -1,66 +0,0 @@
-"use strict";
-'use client';
-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);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HorizontalScrollBar = void 0;
-const react_1 = __importStar(require("react"));
-const HorizontalScrollBar = ({ children, className, }) => {
-    const scrollRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        if (!scrollRef.current)
-            return;
-        const handleScroll = (e) => {
-            const { current } = scrollRef;
-            if (!current)
-                return;
-            e.preventDefault();
-            current.scrollLeft += e.deltaY;
-        };
-        scrollRef.current.addEventListener('wheel', handleScroll);
-        return () => {
-            var _a;
-            try {
-                // eslint-disable-next-line react-hooks/exhaustive-deps
-                (_a = scrollRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('wheel', handleScroll);
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            }
-            catch (e) {
-                //
-            }
-        };
-    }, [scrollRef]);
-    return (react_1.default.createElement("div", { ref: scrollRef, style: { overflowX: 'auto' }, className: className }, children));
-};
-exports.HorizontalScrollBar = HorizontalScrollBar;

package/dist/ui/components/Icon/index.d.ts

@@ -1,31 +0,0 @@
-import type { CSSProperties } from 'react';
-import React from 'react';
-export declare const IconF: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export interface IIcon {
-    disabled?: boolean;
-    outline?: string;
-    rotate?: number;
-    canHover?: boolean;
-    onClick?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
-    children?: React.ReactNode;
-    role?: string;
-    title?: string;
-    tabIndex?: number;
-    className?: string;
-    style?: {
-        /** default 100% */
-        width?: string;
-        /** default 100% */
-        height?: string;
-        /** default 0 */
-        padding?: string;
-        /** default unset */
-        margin?: string;
-        /** pass fill down to svg */
-        fill?: string;
-    } & CSSProperties;
-}
-export declare const Icon: (pr: IIcon) => React.JSX.Element;

package/dist/ui/components/Icon/index.js

@@ -1,69 +0,0 @@
-"use strict";
-'use client';
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Icon = exports.IconF = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const object_1 = require("../../../common/helpers/object");
-const common_1 = require("../../styles/common");
-exports.IconF = styled_1.default.span `
-  transition: all 200ms;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  font-size: 2rem;
-  cursor: inherit;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: unset;
-  &[data-chnd='true'] {
-    cursor: pointer;
-    &:hover {
-      filter: saturate(3);
-    }
-  }
-
-  > svg {
-    flex-grow: 1;
-  }
-
-  &[data-hasfill='true'] {
-    fill: var(--fill);
-
-    svg {
-      fill: var(--fill);
-    }
-
-    linearGradient > *,
-    radialGradient > * {
-      stop-color: var(--fill) !important;
-    }
-  }
-
-  &[data-hasoutline='true'] {
-    ${(0, common_1.HardOutline)('var(--outlinecolour)')}
-  }
-
-  svg {
-    width: 100%;
-    height: 100%;
-    object-fit: contain;
-    aspect-ratio: 1/1;
-  }
-
-  img {
-    object-fit: contain;
-  }
-`;
-const Icon = (pr) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
-    const { className, children, disabled, onClick } = pr;
-    const CHND = pr.canHover && !pr.disabled;
-    const style = (0, object_1.removeUndefValuesFromObject)(Object.assign(Object.assign({}, ((_a = pr.style) !== null && _a !== void 0 ? _a : {})), { '--fill': (_c = (_b = pr.style) === null || _b === void 0 ? void 0 : _b.fill) !== null && _c !== void 0 ? _c : null, width: (_d = pr.style) === null || _d === void 0 ? void 0 : _d.width, height: (_e = pr.style) === null || _e === void 0 ? void 0 : _e.height, padding: (_f = pr.style) === null || _f === void 0 ? void 0 : _f.padding, margin: (_g = pr.style) === null || _g === void 0 ? void 0 : _g.margin, transform: !pr.rotate ? null : `rotate(${pr.rotate || 0}deg)`, filter: !pr.disabled ? null : 'grayscale(1)', '--outlinecolour': pr.outline || null }));
-    return (react_1.default.createElement(exports.IconF, Object.assign({}, pr, { className: className, onClick: (e) => !disabled && (onClick === null || onClick === void 0 ? void 0 : onClick(e)), style: style, "data-chnd": CHND, "data-hasoutline": pr.outline, "data-hasfill": !!((_h = pr.style) === null || _h === void 0 ? void 0 : _h.fill), "data-type": "iconbox" }), children));
-};
-exports.Icon = Icon;

package/dist/ui/components/Image/index.d.ts

@@ -1,13 +0,0 @@
-import type { ImgHTMLAttributes } from 'react';
-import React from 'react';
-export interface IImage {
-    /** if true, will set order to -1 for mobile. default false */
-    smalltop?: boolean;
-    /** if true, will hide on mobile. default false */
-    bigonly?: boolean;
-    /** if true, will hide on desktop. default false */
-    smallonly?: boolean;
-    /** if true is counted as a small image, and will be sized accordingly. default false */
-    small?: boolean;
-}
-export declare const Image: (p: ImgHTMLAttributes<HTMLImageElement> & IImage) => React.JSX.Element | null;

package/dist/ui/components/Image/index.js

@@ -1,104 +0,0 @@
-"use strict";
-'use client';
-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);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Image = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const media_1 = require("../../styles/media");
-const Base = styled_1.default.img `
-  object-fit: contain;
-  width: 100%;
-  height: 100%;
-
-  min-width: 5rem;
-  min-height: 5rem;
-
-  max-width: 100%;
-  max-height: 100%;
-
-  &[data-smalltop='true'] {
-    @media ${media_1.smallScreen} {
-      order: -1;
-    }
-  }
-  @media ${media_1.smallScreen} {
-    max-width: 50vw;
-    max-height: 50vh;
-
-    &[data-bigonly='true'] {
-      display: none;
-    }
-    &[data-small='true'] {
-      max-width: 25vw;
-      max-height: 25vh;
-    }
-  }
-
-  @media ${media_1.bigScreen} {
-    max-width: 50vw;
-    max-height: 50vh;
-    &[data-smallonly='true'] {
-      display: none;
-    }
-    &[data-small='true'] {
-      max-width: 30vw;
-      max-height: 30vh;
-    }
-  }
-`;
-const Image = (p) => {
-    const { smalltop, bigonly, smallonly, small } = p, p1 = __rest(p, ["smalltop", "bigonly", "smallonly", "small"]);
-    const [display, setDisplay] = (0, react_1.useState)(true);
-    if (!display) {
-        return null;
-    }
-    return (react_1.default.createElement(Base, Object.assign({}, p1, { "data-smalltop": smalltop, "data-bigonly": bigonly, "data-smallonly": smallonly, "data-small": small, onError: () => setDisplay(false) })));
-};
-exports.Image = Image;