@koine/react 1.0.9 → 1.0.10

package/node/Collapsable/CollapsableReach.js

@@ -1,141 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Collapsable = exports.CollapsableBody = exports.CollapsableBodyRoot = exports.CollasableBodyWrap = exports.CollapsableInput = exports.CollapsableHead = exports.CollapsableHeadIcon = exports.CollapsableHeadText = exports.collapsableHeadLineMotion = exports.CollaspableHeadLine = exports.CollapsableHeadAction = exports.CollapsableHeadSpace = exports.CollapsableHeadRoot = exports.CollapsableRoot = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * @file
- *
- * Maybe do a simplified version following this example:
- * https://codesandbox.io/s/framer-motion-accordion-qx958?file=/src/Example.tsx
- */
-const react_1 = require("react");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const disclosure_1 = require("@reach/disclosure");
-const bs_1 = require("react-icons/bs");
-const Buttons_1 = require("../Buttons");
-const useWindowSize_1 = require("../hooks/useWindowSize");
-const styles_1 = require("../Forms/styles");
-/**
- * `overflow-anchor: none;` keeps the same scrolling position
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Accordion/Accordion.js#L54
- */
-exports.CollapsableRoot = (0, styled_components_1.default)(disclosure_1.Disclosure) `
-  overflow-anchor: none;
-`;
-exports.CollapsableHeadRoot = (0, styled_components_1.default)(framer_motion_1.m.label).attrs((props) => ({
-    htmlFor: `${props.id}-input`,
-})) `
-  ${Buttons_1.btnStyleReset}
-  width: 100%;
-  padding: 0;
-  text-align: left;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  cursor: pointer;
-`;
-exports.CollapsableHeadSpace = styled_components_1.default.div `
-  flex: 1;
-  padding-left: 20px;
-`;
-exports.CollapsableHeadAction = styled_components_1.default.div `
-  padding-left: 20px;
-`;
-exports.CollaspableHeadLine = (0, styled_components_1.default)(framer_motion_1.m.div) `
-  width: 0%;
-  height: 1px;
-  background: #bbb;
-`;
-exports.collapsableHeadLineMotion = {
-    hover: {
-        width: "100%",
-        transition: {
-            duration: 0.4,
-        },
-    },
-};
-exports.CollapsableHeadText = styled_components_1.default.div ``;
-exports.CollapsableHeadIcon = (0, styled_components_1.default)(framer_motion_1.m.div) ``;
-const CollapsableHead = ({ $expanded, id, onClick, HeadRoot = exports.CollapsableHeadRoot, HeadAction = exports.CollapsableHeadAction, HeadIcon = exports.CollapsableHeadIcon, children, }) => {
-    return ((0, jsx_runtime_1.jsxs)(disclosure_1.DisclosureButton, { onClick: onClick, 
-        // tabIndex={0}
-        // role="tab"
-        initial: "rest", whileHover: "hover", "$expanded": $expanded, as: HeadRoot, id: id, children: [(0, jsx_runtime_1.jsx)(exports.CollapsableHeadText, { children: children }), (0, jsx_runtime_1.jsx)(exports.CollapsableHeadSpace, { children: (0, jsx_runtime_1.jsx)(exports.CollaspableHeadLine, { variants: exports.collapsableHeadLineMotion, animate: $expanded ? "hover" : "" }) }), HeadAction && ((0, jsx_runtime_1.jsx)(HeadAction, { children: HeadIcon && ((0, jsx_runtime_1.jsx)(HeadIcon, { animate: { rotate: $expanded ? 180 : 0 }, children: (0, jsx_runtime_1.jsx)(bs_1.BsBoxArrowInDown, {}) })) }))] }));
-};
-exports.CollapsableHead = CollapsableHead;
-exports.CollapsableInput = (0, styled_components_1.default)(styles_1.InputInvisible).attrs({
-    type: "checkbox",
-}) ``;
-exports.CollasableBodyWrap = (0, styled_components_1.default)(disclosure_1.DisclosurePanel) `
-  /* this is because @reach adds the "hidden" attribute */
-
-  &[hidden] {
-    display: block;
-  }
-`;
-exports.CollapsableBodyRoot = (0, styled_components_1.default)(framer_motion_1.m.div) `
-  .no-js & {
-    transition: margin-top 0.2s ease;
-  }
-  .no-js ${exports.CollapsableInput}:checked + ${exports.CollasableBodyWrap} & {
-    margin-top: 0 !important;
-    opacity: 1 !important;
-  }
-`;
-exports.CollapsableBody = (0, react_1.forwardRef)(function CollapsableBody(props, ref) {
-    return (0, jsx_runtime_1.jsx)(exports.CollapsableBodyRoot, { ref: ref, ...props });
-});
-const Collapsable = ({ expanded: propExpanded, recalc, onChange, id, head, body, 
-// autoCollapse,
-components = {}, ariaExpand = "Expand", ariaCollapse = "Collapse", ...props }) => {
-    const isControlled = typeof propExpanded !== "undefined";
-    const [stateExpanded, setStateExpanded] = (0, react_1.useState)(propExpanded);
-    const [height, setHeight] = (0, react_1.useState)(0);
-    const hash = id ? `#${id}` : "";
-    const winSize = (0, useWindowSize_1.useWindowSize)();
-    const expanded = isControlled ? propExpanded : stateExpanded;
-    const [overflow, setOverflow] = (0, react_1.useState)(expanded ? "unset" : "hidden");
-    const content = (0, react_1.useRef)(null);
-    const defaultId = (0, react_1.useId)();
-    id = id || defaultId;
-    const handleClick = (0, react_1.useCallback)(() => {
-        if (hash) {
-            window.history.replaceState(null, "", expanded ? window.location.pathname + window.location.search : hash);
-        }
-        if (onChange) {
-            onChange();
-        }
-        if (!isControlled) {
-            setStateExpanded((prevExpanded) => !prevExpanded);
-        }
-    }, [expanded, hash, onChange, isControlled]);
-    const handleAnimationStart = (0, react_1.useCallback)(() => {
-        setOverflow("hidden");
-    }, []);
-    const handleAnimationComplete = (0, react_1.useCallback)(() => {
-        setOverflow(expanded ? "unset" : "hidden");
-    }, [expanded]);
-    (0, react_1.useEffect)(() => {
-        if (content.current) {
-            setHeight(Math.ceil(content.current.offsetHeight));
-        }
-    }, [winSize, recalc]);
-    // deeplink on mount
-    (0, react_1.useEffect)(() => {
-        if (!isControlled && hash && window.location.hash === hash) {
-            setStateExpanded(true);
-        }
-    }, [hash, isControlled]);
-    return ((0, jsx_runtime_1.jsxs)(exports.CollapsableRoot, { id: id, ...props, open: expanded || false, children: [head !== null && ((0, jsx_runtime_1.jsx)(exports.CollapsableHead, { id: id, "$expanded": expanded, onClick: handleClick, ...components, children: head })), (0, jsx_runtime_1.jsx)(exports.CollapsableInput, { id: `${id}-input` }), (0, jsx_runtime_1.jsx)(exports.CollasableBodyWrap, { "$expanded": expanded, style: { overflow }, children: (0, jsx_runtime_1.jsx)(exports.CollapsableBody, { ref: content, "$expanded": expanded, 
-                    // aria-expanded={expanded}
-                    // aria-label={expanded ? ariaCollapse : ariaExpand}
-                    style: {
-                        pointerEvents: expanded ? "all" : "none",
-                    }, onAnimationStart: handleAnimationStart, onAnimationComplete: handleAnimationComplete, animate: {
-                        marginTop: expanded ? 0 : height ? `-${height}px` : "-100vh",
-                        opacity: expanded ? 1 : 0.4,
-                    }, children: body }) })] }));
-};
-exports.Collapsable = Collapsable;

package/node/Collapsable/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./CollapsableReach"), exports);

package/node/Debug/Debug.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Debug = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const Root = styled_components_1.default.div `
-  background: #f4f4f4;
-  border: 1px solid #ddd;
-  border-left: 3px solid #f36d33;
-  color: #666;
-  page-break-inside: avoid;
-  font-family: monospace;
-  font-size: small;
-  line-height: 1.6;
-  margin-bottom: 1.6em;
-  max-width: 100%;
-  overflow: auto;
-  padding: 1em 1.5em;
-  display: block;
-  word-wrap: break-word;
-`;
-const Debug = ({ data }) => {
-    return (0, jsx_runtime_1.jsx)(Root, { children: JSON.stringify(data, undefined, 2) });
-};
-exports.Debug = Debug;

package/node/Debug/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Debug"), exports);

package/node/Dialog/DialogMui.js

@@ -1,82 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const ModalUnstyled_1 = tslib_1.__importDefault(require("@mui/base/ModalUnstyled"));
-const md_1 = require("react-icons/md");
-const helpers_1 = require("../helpers");
-exports.Root = ModalUnstyled_1.default;
-exports.Backdrop = "div";
-exports.Container = "div";
-exports.Paper = "div";
-exports.Close = "button";
-exports.Header = "div";
-exports.Body = "div";
-// const Dialog = ({
-//   children,
-//   title,
-//   $scrollPaper,
-//   Root: _Root,
-//   Backdrop: _Backdrop,
-//   Container: _Container,
-//   Paper: _Paper,
-//   Close: _Close,
-//   Header: _Header,
-//   Body: _Body,
-//   ...props
-// }: KoineDialogProps) => (
-//   <Root BackdropComponent={Backdrop} onBackdropClick={props.onClose} {...props}>
-//     <Container $scrollPaper={$scrollPaper}>
-//       <Paper aria-label={title || ""} $scrollPaper={$scrollPaper}>
-//         {title && <Header>{title}</Header>}
-//         <Close onClick={props.onClose}>
-//           <IconClose />
-//         </Close>
-//         <Body>{children}</Body>
-//       </Paper>
-//     </Container>
-//   </Root>
-// );
-/**
- *
- * Main differences from [Mui Dialog](https://mui.com/material-ui/react-dialog):
- *
- * - By default uses `scroll="body"` instead of paper.
- * - Optionally uses `framer-motion` for animations
- * - Uses backdrop blur by default
- *
- * FIXME: it actually works even without forwardRef, check if we do need it
- */
-const DialogWithRef = (0, react_1.forwardRef)(function Dialog({ children, title, $scrollPaper, Root: _Root, Backdrop: _Backdrop, Container: _Container, Paper: _Paper, Close: _Close, Header: _Header, Body: _Body, onClose, ...props }, ref) {
-    // click handling is taken from
-    // @see https://github.com/mui/material-ui/blob/c758b6c0b30f0831110458a746690b33147c45df/packages/mui-material/src/Dialog/Dialog.js#L205-L226
-    const backdropClick = (0, react_1.useRef)();
-    const handleMouseDown = (event) => {
-        // We don't want to close the dialog when clicking the dialog content.
-        // Make sure the event starts and ends on the same DOM element.
-        backdropClick.current = event.target === event.currentTarget;
-    };
-    const handleBackdropClick = (event) => {
-        // Ignore the events not coming from the "backdrop".
-        if (!backdropClick.current) {
-            return;
-        }
-        backdropClick.current = null;
-        // if (onBackdropClick) onBackdropClick(event);
-        if (onClose) {
-            onClose(event, "backdropClick");
-        }
-    };
-    return ((0, jsx_runtime_1.jsx)(exports.Root, { BackdropComponent: exports.Backdrop, onClick: handleBackdropClick, onClose: onClose, ref: ref, ...props, children: (0, jsx_runtime_1.jsx)(exports.Container, { "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown, children: (0, jsx_runtime_1.jsxs)(exports.Paper, { "aria-label": title || "", "$scrollPaper": $scrollPaper, children: [title && (0, jsx_runtime_1.jsx)(exports.Header, { children: title }), (0, jsx_runtime_1.jsx)(exports.Close, { onClick: onClose, children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) }), (0, jsx_runtime_1.jsx)(exports.Body, { children: children })] }) }) }));
-});
-exports.KoineDialog = (0, helpers_1.extendComponent)(DialogWithRef, {
-    Root: exports.Root,
-    Backdrop: exports.Backdrop,
-    Container: exports.Container,
-    Paper: exports.Paper,
-    Close: exports.Close,
-    Header: exports.Header,
-    Body: exports.Body,
-});

package/node/Dialog/css/bare.js

@@ -1,23 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
-const tslib_1 = require("tslib");
-const helpers_1 = require("../../helpers");
-const _ = tslib_1.__importStar(require("../DialogMui"));
-// export type { KoineDialogProps } from "../DialogMui";
-exports.Root = (0, helpers_1.classed)(_.Root) `dialog`;
-exports.Backdrop = (0, helpers_1.classed)(_.Backdrop) `dialogBackdrop`;
-exports.Container = (0, helpers_1.classed)(_.Container) `dialogContainer`;
-exports.Paper = (0, helpers_1.classed)(_.Paper) `dialogPaper`;
-exports.Close = (0, helpers_1.classed)(_.Close) `"dialogClose`;
-exports.Header = (0, helpers_1.classed)(_.Header) `dialogHeader`;
-exports.Body = (0, helpers_1.classed)(_.Body) `dialogBody`;
-exports.KoineDialog = (0, helpers_1.extendComponent)(_.KoineDialog, {
-    Root: exports.Root,
-    Backdrop: exports.Backdrop,
-    Container: exports.Container,
-    Paper: exports.Paper,
-    Close: exports.Close,
-    Header: exports.Header,
-    Body: exports.Body,
-});

package/node/Dialog/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-var DialogMui_1 = require("./DialogMui");
-Object.defineProperty(exports, "KoineDialog", { enumerable: true, get: function () { return DialogMui_1.KoineDialog; } });

package/node/Dialog/m/bare.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const md_1 = require("react-icons/md");
-const framer_motion_1 = require("framer-motion");
-const helpers_1 = require("../../helpers");
-const index_1 = require("./index");
-const DialogMui_1 = require("../DialogMui");
-/**
- * About nested `AnimatePresence` and animated dialogs with framer @see:
- *
- * - https://github.com/framer/motion/issues/478
- * - https://codesandbox.io/s/clever-banzai-7km49?file=/src/Modal.js
- */
-const Dialog = (0, react_1.forwardRef)(function Dialog({ children, title, $scrollPaper, Root, Backdrop, Container, Paper, Close, Header, Body, mBackdrop, mPaper, onClose, ...props }, ref) {
-    const BackdropMotion = (0, react_1.useMemo)(() => (props) => ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: props.open && (0, jsx_runtime_1.jsx)(Backdrop, { ...mBackdrop, ...props }) })), [Backdrop, mBackdrop]);
-    // FIXME: extract this logic either in a useDialog hook or in a useclickOutside hook
-    // click handling is taken from
-    // @see https://github.com/mui/material-ui/blob/c758b6c0b30f0831110458a746690b33147c45df/packages/mui-material/src/Dialog/Dialog.js#L205-L226
-    const backdropClick = (0, react_1.useRef)();
-    const handleMouseDown = (event) => {
-        // We don't want to close the dialog when clicking the dialog content.
-        // Make sure the event starts and ends on the same DOM element.
-        backdropClick.current = event.target === event.currentTarget;
-    };
-    const handleBackdropClick = (event) => {
-        // Ignore the events not coming from the "backdrop".
-        if (!backdropClick.current) {
-            return;
-        }
-        backdropClick.current = null;
-        // if (onBackdropClick) onBackdropClick(event);
-        if (onClose) {
-            onClose(event, "backdropClick");
-        }
-    };
-    return ((0, jsx_runtime_1.jsx)(Root, { keepMounted: true, BackdropComponent: BackdropMotion, onClick: handleBackdropClick, onClose: onClose, ref: ref, ...props, style: (0, index_1.mRootStyle)(props), children: (0, jsx_runtime_1.jsx)(Container, { "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown, children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: props.open && (
-                // @ts-expect-error framer props collision...
-                (0, jsx_runtime_1.jsxs)(Paper, { ...mPaper, "aria-label": title || "", "$scrollPaper": $scrollPaper, children: [title && (0, jsx_runtime_1.jsx)(Header, { children: title }), (0, jsx_runtime_1.jsx)(Close, { onClick: onClose, children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) }), (0, jsx_runtime_1.jsx)(Body, { children: children })] })) }) }) }));
-});
-exports.KoineDialog = (0, helpers_1.extendComponent)(Dialog, {
-    Root: DialogMui_1.Root,
-    Backdrop: (0, framer_motion_1.m)(DialogMui_1.Backdrop),
-    Container: DialogMui_1.Container,
-    Paper: (0, framer_motion_1.m)(DialogMui_1.Paper),
-    Close: DialogMui_1.Close,
-    Header: DialogMui_1.Header,
-    Body: DialogMui_1.Body,
-});

package/node/Dialog/m/basic.js

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.dialogPaperMotion = exports.dialogBackdropMotion = void 0;
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./index"), exports);
-exports.dialogBackdropMotion = {
-    initial: {
-        opacity: 0,
-    },
-    animate: {
-        backdropFilter: "blur(10px)",
-        opacity: 1,
-    },
-    exit: {
-        backdropFilter: "blur(0px)",
-        opacity: 0,
-    },
-};
-exports.dialogPaperMotion = {
-    initial: {
-        // scale: .9,
-        translateY: -60,
-        opacity: 0,
-    },
-    animate: {
-        // scale: 1,
-        translateY: 0,
-        opacity: 1,
-    },
-    exit: {
-        // scale: 0.9,
-        translateY: 60,
-        opacity: 0,
-    },
-};

package/node/Dialog/m/index.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.mRootStyle = void 0;
-const mRootStyle = (props) => ({
-    pointerEvents: props.open ? "all" : "none",
-    ...(props.style || {}),
-});
-exports.mRootStyle = mRootStyle;

package/node/Dialog/sc/bare.js

@@ -1,65 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const helpers_1 = require("../../helpers");
-const styled_1 = require("../../styles/styled");
-const Buttons_1 = require("../../Buttons");
-const _ = tslib_1.__importStar(require("../DialogMui"));
-exports.Root = (0, styled_components_1.default)(_.Root) `
-  z-index: 1300;
-  position: fixed;
-  ${styled_1.inset0}
-`;
-// export const Backdrop = (props) => {
-//   return <div {...props} />;
-// }
-exports.Backdrop = (0, styled_components_1.default)(_.Backdrop) `
-  z-index: -1;
-  position: fixed;
-  ${styled_1.inset0}
-  backdrop-filter: blur(0px);
-  -webkit-tap-highlight-color: transparent;
-`;
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
- */
-exports.Container = (0, styled_components_1.default)(_.Container) `
-  height: 100%;
-  outline: 0;
-  ${(p) => p.$scrollPaper
-    ? "display: flex; justify-content: center; align-items: center;"
-    : "overflow: hidden auto; text-align: center; &:after { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; }"}
-`;
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
- */
-exports.Paper = (0, styled_components_1.default)(_.Paper) `
-  position: relative;
-  ${(p) => p.$scrollPaper
-    ? "display: flex; flex-direction: column; max-height: calc(100%-64px);"
-    : "display: inline-block; vertical-align: middle; text-align: initial;"}
-`;
-exports.Close = (0, styled_components_1.default)(Buttons_1.IconButton) `
-  position: absolute;
-`;
-exports.Header = (0, styled_components_1.default)(_.Header) ``;
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
- */
-exports.Body = (0, styled_components_1.default)(_.Body) `
-  flex: 1 1 auto;
-  -webkit-overflow-scrolling: touch;
-  overflow-y: auto;
-  overflow: auto;
-`;
-exports.KoineDialog = (0, helpers_1.extendComponent)(_.KoineDialog, {
-    Root: exports.Root,
-    Backdrop: exports.Backdrop,
-    Container: exports.Container,
-    Paper: exports.Paper,
-    Close: exports.Close,
-    Header: exports.Header,
-    Body: exports.Body,
-});

package/node/Dialog/sc/framer.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-const framer_motion_1 = require("framer-motion");
-const helpers_1 = require("../../helpers");
-const basic_1 = require("../m/basic");
-const bare_1 = require("../m/bare");
-const bare_2 = require("./bare");
-exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
-    Root: bare_2.Root,
-    Backdrop: (0, framer_motion_1.m)(bare_2.Backdrop),
-    Container: bare_2.Container,
-    Paper: (0, framer_motion_1.m)(bare_2.Paper),
-    Close: bare_2.Close,
-    Header: bare_2.Header,
-    Body: bare_2.Body,
-    mBackdrop: basic_1.dialogBackdropMotion,
-    mPaper: basic_1.dialogPaperMotion,
-});

package/node/Dialog/sc/framerMaterial.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-const framer_motion_1 = require("framer-motion");
-const helpers_1 = require("../../helpers");
-const basic_1 = require("../m/basic");
-const bare_1 = require("../m/bare");
-const material_1 = require("./material");
-exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
-    Root: material_1.Root,
-    Backdrop: (0, framer_motion_1.m)(material_1.Backdrop),
-    Container: material_1.Container,
-    Paper: (0, framer_motion_1.m)(material_1.Paper),
-    Close: material_1.Close,
-    Header: material_1.Header,
-    Body: material_1.Body,
-    mBackdrop: basic_1.dialogBackdropMotion,
-    mPaper: basic_1.dialogPaperMotion,
-});

package/node/Dialog/sc/material.js

@@ -1,45 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const helpers_1 = require("../../helpers");
-const bare_1 = require("./bare");
-exports.Root = (0, styled_components_1.default)(bare_1.KoineDialog.Root) ``;
-exports.Backdrop = (0, styled_components_1.default)(bare_1.KoineDialog.Backdrop) `
-  background: rgba(0, 0, 0, 0.5);
-  filter: backdrop-blur(4px);
-`;
-exports.Container = (0, styled_components_1.default)(bare_1.KoineDialog.Container) ``;
-exports.Paper = (0, styled_components_1.default)(bare_1.KoineDialog.Paper) `
-  max-width: 640px;
-  margin: 64px;
-  border-radius: 4px;
-  background: white;
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
-`;
-exports.Close = (0, styled_components_1.default)(bare_1.KoineDialog.Close) `
-  position: absolute;
-  top: 0;
-  right: 0;
-  padding: 8px;
-  font-size: 2rem;
-  opacity: 0.5;
-`;
-exports.Header = (0, styled_components_1.default)(bare_1.KoineDialog.Header) `
-  padding: 16px;
-  font-size: 1.25rem;
-`;
-exports.Body = (0, styled_components_1.default)(bare_1.KoineDialog.Body) `
-  padding: 16px;
-  border-top: 1px solid rgba(0, 0, 0, 0.08);
-`;
-exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
-    Root: exports.Root,
-    Backdrop: exports.Backdrop,
-    Container: exports.Container,
-    Paper: exports.Paper,
-    Close: exports.Close,
-    Header: exports.Header,
-    Body: exports.Body,
-});

package/node/Dialog/tw/bare.js

@@ -1,40 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
-const tslib_1 = require("tslib");
-const helpers_1 = require("../../helpers");
-const _ = tslib_1.__importStar(require("../DialogMui"));
-exports.Root = (0, helpers_1.classed)(_.Root) `< class="dialog fixed z-[1300] inset-0`;
-exports.Backdrop = (0, helpers_1.classed)(_.Backdrop) `< class="dialogBackdrop fixed -z-[1] inset-0 [-webkit-tap-highlight-color:transparent]`;
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
- */
-exports.Container = (0, helpers_1.classed)(_.Container) `< class="dialogContainer h-full outline-0 ${(p) => p.$scrollPaper
-    ? "flex justify-center items-center"
-    : "overflow-y-auto overflow-x-hidden text-center [after:content:''] after:inline-block after:align-middle after:h-full after:w-0"}`;
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
- */
-exports.Paper = (0, helpers_1.classed)(_.Paper) `< class="dialogPaper relative ${(p) => p.$scrollPaper
-    ? "flex flex-col max-h-[calc(100%-64px)]"
-    : "inline-block align-middle [text-align:initial]"}`;
-exports.Close = (0, helpers_1.classed)(_.Close) `< class="dialogClose`;
-exports.Header = (0, helpers_1.classed)(_.Header) `< class="dialogHeader`;
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
- * The arbitrary rule webkit-overflow-scrolling is to add iOS momentum scrolling for iOS < 13.0,
- * this was removed from tailiwnd 2.0 on
- *
- * @see https://github.com/tailwindlabs/tailwindcss.com/issues/483
- * @see https://v2.tailwindcss.com/docs/upgrading-to-v2#the-scrolling-touch-and-scrolling-auto-utilities-have-been-removed
- */
-exports.Body = (0, helpers_1.classed)(_.Body) `< class="dialogBody flex-1 basis-auto overflow-y-auto [-webkit-overflow-scrolling:touch]`;
-exports.KoineDialog = (0, helpers_1.extendComponent)(_.KoineDialog, {
-    Root: exports.Root,
-    Backdrop: exports.Backdrop,
-    Container: exports.Container,
-    Paper: exports.Paper,
-    Close: exports.Close,
-    Header: exports.Header,
-    Body: exports.Body,
-});

package/node/Dialog/tw/elegant.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
-const helpers_1 = require("../../helpers");
-const bare_1 = require("./bare");
-exports.Root = (0, helpers_1.classed)(bare_1.KoineDialog.Root) ``;
-exports.Backdrop = (0, helpers_1.classed)(bare_1.KoineDialog.Backdrop) `< class="bg-white/[.5] backdrop-blur-sm`;
-exports.Container = (0, helpers_1.classed)(bare_1.KoineDialog.Container) ``;
-exports.Paper = (0, helpers_1.classed)(bare_1.KoineDialog.Paper) `< class="bg-white shadow-xl m-8 max-w-screen-sm border border-gray-400`;
-exports.Close = (0, helpers_1.classed)(bare_1.KoineDialog.Close) `< class="absolute top-0 right-0 p-8 text-2xl opacity-20 hover:opacity-100 focus:opacity-100`;
-exports.Header = (0, helpers_1.classed)(bare_1.KoineDialog.Header) `< class="p-8 text-2xl bold italic`;
-exports.Body = (0, helpers_1.classed)(bare_1.KoineDialog.Body) `< class="p-8 pt-4`;
-exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
-    Root: exports.Root,
-    Backdrop: exports.Backdrop,
-    Container: exports.Container,
-    Paper: exports.Paper,
-    Close: exports.Close,
-    Header: exports.Header,
-    Body: exports.Body,
-});

package/node/Dialog/tw/framer.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-const framer_motion_1 = require("framer-motion");
-const helpers_1 = require("../../helpers");
-const basic_1 = require("../m/basic");
-const bare_1 = require("../m/bare");
-const bare_2 = require("./bare");
-exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
-    Root: bare_2.Root,
-    Backdrop: (0, framer_motion_1.m)(bare_2.Backdrop),
-    Container: bare_2.Container,
-    Paper: (0, framer_motion_1.m)(bare_2.Paper),
-    Close: bare_2.Close,
-    Header: bare_2.Header,
-    Body: bare_2.Body,
-    mBackdrop: basic_1.dialogBackdropMotion,
-    mPaper: basic_1.dialogPaperMotion,
-});

package/node/Dialog/tw/framerMaterial.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-const framer_motion_1 = require("framer-motion");
-const helpers_1 = require("../../helpers");
-const basic_1 = require("../m/basic");
-const bare_1 = require("../m/bare");
-const material_1 = require("./material");
-exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
-    Root: material_1.Root,
-    Backdrop: (0, framer_motion_1.m)(material_1.Backdrop),
-    Container: material_1.Container,
-    Paper: (0, framer_motion_1.m)(material_1.Paper),
-    Close: material_1.Close,
-    Header: material_1.Header,
-    Body: material_1.Body,
-    mBackdrop: basic_1.dialogBackdropMotion,
-    mPaper: basic_1.dialogPaperMotion,
-});