@koine/react 1.0.8 → 1.0.9

package/twm/index.js

@@ -0,0 +1,30 @@
+export * from "../shared";
+// export * from "../Alert";
+// export * from "../Animations";
+// export * from "../Autocomplete";
+// export * from "../Bg";
+// export * from "../Breadcrumbs";
+// export * from "../Buttons";
+// export * from "../Carousel";
+// export * from "../Collapsable";
+// export * from "../Debug";
+export { KoineDialog } from "../Dialog/tw/framer";
+// export * from "../Forms";
+// export * from "../Grid";
+// export * from "../Hamburger";
+// export * from "../Header";
+// export * from "../Hidden";
+// export * from "../Img";
+// export * from "../Link";
+// export * from "../MenuItem";
+// export * from "../Pagination";
+// export * from "../Pill";
+// export * from "../Progress";
+// export * from "../Rating";
+// // export * from "../Select";
+// export * from "../Sidebar";
+// export * from "../Spacing";
+// export * from "../Sticky";
+// export * from "../styles";
+// export * from "../Tabs";
+// export * from "../Typography";

package/twm/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "main": "../node/twm/index.js",
+  "types": "./index.d.ts"
+}

package/types.d.ts

@@ -1,11 +1,10 @@
-/// <reference types="react" />
-export declare type Translate = (i18nKey: any, query?: any, options?: any) => string;
-export declare type Option = {
-    value: string;
-    Label?: NonNullable<import("react").ReactNode>;
-    label: NonNullable<import("react").ReactChild | import("react").ReactFragment>;
-};
-export declare type KoineComponentProps<BaseComponentProps, ExtendableProps> = BaseComponentProps & {
-    Koine: ExtendableProps;
-};
-export declare type KoineComponent<Props = any> = string | React.ForwardRefExoticComponent<Props> | React.ExoticComponent<Props> | React.FC<Props> | ((props: Props) => JSX.Element);
+/// <reference types="react" />
+export type { KoineImgSmartWrapProps, KoineImgSmartProps } from "./Img/types";
+export declare type Translate = (i18nKey: any, query?: any, options?: any) => string;
+export declare type Option = {
+    value: string;
+    Label?: NonNullable<import("react").ReactNode>;
+    label: NonNullable<import("react").ReactChild | import("react").ReactFragment>;
+};
+export declare type KoineComponentProps<BaseComponentProps, ExtendableProps> = BaseComponentProps & ExtendableProps;
+export declare type KoineComponent<Props = any> = string | React.ForwardRefExoticComponent<Props> | React.ExoticComponent<Props> | React.FC<Props> | ((props: Props) => JSX.Element);

package/Dialog/Dialog.d.ts

@@ -1,23 +0,0 @@
-/// <reference types="react" />
-import { MotionProps } from "framer-motion";
-import { DialogProps as BaseDialogProps } from "@reach/dialog";
-import { SetRequired } from "@koine/utils";
-export declare const koineDialogBg: import("styled-components").FlattenSimpleInterpolation;
-export declare const koineDialogBackdropMotion: MotionProps;
-export declare const koineDialogInnerMotion: MotionProps;
-export declare const KoineDialogOverlay: import("styled-components").StyledComponent<import("@reach/utils/dist/declarations/src/polymorphic").ForwardRefComponent<"div", import("@reach/dialog/dist/declarations/src").DialogOverlayProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const KoineDialogBackdrop: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, {}, never>;
-export declare const KoineDialogInner: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, Pick<KoineDialogProps, "$centered">, never>;
-export declare const KoineDialogContent: import("styled-components").StyledComponent<import("@reach/utils/dist/declarations/src/polymorphic").ForwardRefComponent<"div", import("@reach/dialog/dist/declarations/src").DialogContentProps>, import("styled-components").DefaultTheme, Pick<KoineDialogProps, "$centered">, never>;
-export declare const KoineDialogCloseButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, import("../Buttons").KoineButtonUiProps & {
-    disabled?: boolean | undefined;
-}, never>;
-export declare const KoineDialogHeader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const KoineDialogBody: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const KoineDialogBodyChildren: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare type KoineDialogProps = SetRequired<BaseDialogProps, "onDismiss"> & {
-    title?: string;
-    /** @default true */
-    $centered?: boolean;
-};
-export declare const KoineDialog: ({ children, title, onDismiss, isOpen, $centered, ...props }: KoineDialogProps) => JSX.Element;

package/Dialog/Dialog.js

@@ -1,93 +0,0 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled, { css } from "styled-components";
-import { AnimatePresence, m } from "framer-motion";
-import { MdClear as IconClose } from "react-icons/md";
-import { DialogOverlay as BaseDialogOverlay, DialogContent as BaseDialogContent, } from "@reach/dialog";
-import { min } from "../styles/media";
-import { inset0 } from "../styles/styled";
-import { IconButton } from "../Buttons";
-export const koineDialogBg = css `
-  z-index: 1;
-  position: relative;
-  background: var(--bodyBg);
-  box-shadow: var(--shadow);
-`;
-export const koineDialogBackdropMotion = {
-    animate: {
-        backdropFilter: "blur(10px)",
-        background: "rgba(255,255,255,0.33)",
-    },
-    exit: {
-        backdropFilter: "blur(0px)",
-        background: "rgba(255,255,255,0)",
-        transition: { delay: 0.2 },
-    },
-};
-export const koineDialogInnerMotion = {
-    initial: {
-        // scale: .7,
-        opacity: 0,
-    },
-    animate: {
-        scale: 1,
-        opacity: 1,
-        // transition: { delay: 0.2 },
-    },
-    exit: {
-        scale: 0.9,
-        opacity: 0,
-    },
-};
-export const KoineDialogOverlay = styled(BaseDialogOverlay) `
-  z-index: 100;
-  position: fixed;
-  ${inset0}
-`;
-export const KoineDialogBackdrop = styled(m.div) `
-  z-index: 2;
-  position: fixed;
-  ${inset0}
-  backdrop-filter: blur(0px);
-`;
-export const KoineDialogInner = styled(m.div) `
-  z-index: 3;
-  position: absolute;
-  ${inset0}
-  overflow: hidden scroll;
-  ${(p) => p.$centered &&
-    `${min.sm} {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }`};
-`;
-// export const KoineDialogContent = styled(m(BaseDialogContent))<
-export const KoineDialogContent = styled(BaseDialogContent) `
-  position: relative;
-  outline: 0px;
-  width: 100%;
-  margin: 0 auto;
-`;
-export const KoineDialogCloseButton = styled(IconButton) `
-  position: absolute;
-  padding: 0;
-`;
-export const KoineDialogHeader = styled.div `
-  z-index: 2;
-  position: relative;
-`;
-export const KoineDialogBody = styled.div `
-  position: relative;
-
-  &:hover ${KoineDialogCloseButton} {
-  }
-`;
-export const KoineDialogBodyChildren = styled.div `
-  position: relative;
-  overflow: auto;
-`;
-export const KoineDialog = (_a) => {
-    var { children, title, onDismiss, isOpen, $centered = true } = _a, props = __rest(_a, ["children", "title", "onDismiss", "isOpen", "$centered"]);
-    return (_jsx(AnimatePresence, { children: isOpen && (_jsxs(KoineDialogOverlay, Object.assign({}, props, { onDismiss: onDismiss, isOpen: isOpen }, { children: [_jsx(KoineDialogBackdrop, Object.assign({}, koineDialogBackdropMotion)), _jsx(KoineDialogInner, Object.assign({}, koineDialogInnerMotion, { "$centered": $centered }, { children: _jsxs(KoineDialogContent, Object.assign({ "aria-label": title || "", "$centered": $centered }, { children: [title && _jsx(KoineDialogHeader, { children: title }), _jsxs(KoineDialogBody, { children: [_jsx(KoineDialogCloseButton, Object.assign({ onClick: onDismiss }, { children: _jsx(IconClose, {}) })), _jsx(KoineDialogBodyChildren, { children: children })] })] })) }))] }), "DialogOverlay")) }));
-};

package/Img/Img.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-export declare type KoineImgProps = {};
-export declare const KoineImg: import("styled-components").StyledComponent<"img", import("styled-components").DefaultTheme, {}, never>;
-export declare type KoineImgSmartWrapProps = {
-    $loaded?: boolean;
-    $error?: boolean;
-    $bg?: React.CSSProperties["backgroundColor"];
-};
-export declare type KoineImgSmartProps = KoineImgProps & {
-    Wrap: React.FC<KoineImgSmartWrapProps>;
-};