@stackframe/stack 2.0.0 → 2.1.1

package/dist/{elements/RedirectMessageCard.js → components/redirect-message-card.js}

@@ -2,8 +2,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRouter } from "next/navigation";
 import { useStackApp } from "..";
-import MessageCard from "./MessageCard";
-import Button from "./Button";
+import MessageCard from "./message-card";
+import { Text, Button } from "../components-core";
 export default function RedirectMessageCard({ type, fullPage = false, }) {
     const stackApp = useStackApp();
     const router = useRouter();
@@ -16,7 +16,6 @@ export default function RedirectMessageCard({ type, fullPage = false, }) {
     switch (type) {
         case 'signedIn': {
             title = "You are already signed in";
-            message = 'You are already signed in.';
             primaryUrl = stackApp.urls.home;
             secondaryUrl = stackApp.urls.signOut;
             primaryButton = "Go to Home";
@@ -51,5 +50,5 @@ export default function RedirectMessageCard({ type, fullPage = false, }) {
             break;
         }
     }
-    return (_jsxs(MessageCard, { title: title, fullPage: fullPage, children: [message && _jsx("p", { className: 'wl_mb-8', children: message }), _jsxs("div", { className: 'wl_flex wl_flex-row wl_align-center wl_justify-center wl_gap-4', children: [secondaryButton && (_jsx(Button, { className: 'wl_btn_ghost', onClick: () => router.push(stackApp.urls.signOut.toString()), children: secondaryButton })), _jsx(Button, { className: 'wl_btn wl_btn-primary', onClick: () => router.push(primaryUrl.toString()), children: primaryButton })] })] }));
+    return (_jsxs(MessageCard, { title: title, fullPage: fullPage, children: [message && _jsx(Text, { children: message }), _jsxs("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', gap: '16px', marginTop: 20 }, children: [secondaryButton && (_jsx(Button, { variant: "secondary", onClick: () => router.push(stackApp.urls.signOut.toString()), children: secondaryButton })), _jsx(Button, { onClick: () => router.push(primaryUrl.toString()), children: primaryButton })] })] }));
 }

package/dist/components/sign-in.d.ts

@@ -0,0 +1,4 @@
+export default function SignIn({ fullPage }: {
+    fullPage?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sign-in.d.ts.map

package/dist/components/sign-in.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sign-in.d.ts","sourceRoot":"","sources":["../../src/components/sign-in.tsx"],"names":[],"mappings":"AAWA,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAE,QAAc,EAAE,EAAE;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,2CA0BxE"}

package/dist/components/sign-in.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import CredentialSignIn from '../elements/credential-sign-in';
+import DividerWithText from '../elements/divider-with-text';
+import OAuthGroup from '../elements/oauth-group';
+import CardFrame from '../elements/card-frame';
+import CardHeader from '../elements/card-header';
+import { useUser, useStackApp } from '..';
+import RedirectMessageCard from '../elements/redirect-message-card';
+import { Link, Text } from '@stackframe/stack-ui';
+export default function SignIn({ fullPage = false }) {
+    const stackApp = useStackApp();
+    const user = useUser();
+    const project = stackApp.useProject();
+    if (user) {
+        return _jsx(RedirectMessageCard, { type: 'signedIn', fullPage: fullPage });
+    }
+    const enableDivider = project.credentialEnabled && project.oauthProviders.filter(p => p.enabled).length > 0;
+    return (_jsxs(CardFrame, { fullPage: fullPage, children: [_jsx(CardHeader, { title: "Sign In to Your Account", children: _jsxs(Text, { children: ["Don't have an account? ", _jsx(Link, { href: stackApp.urls['signUp'], children: "Sign up" })] }) }), _jsx(OAuthGroup, { type: 'signin' }), enableDivider && _jsx(DividerWithText, { text: 'OR' }), project.credentialEnabled && _jsx(CredentialSignIn, {})] }));
+}

package/dist/components/sign-out.d.ts

@@ -0,0 +1,2 @@
+export default function Signout(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sign-out.d.ts.map

package/dist/components/sign-out.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sign-out.d.ts","sourceRoot":"","sources":["../../src/components/sign-out.tsx"],"names":[],"mappings":"AAMA,MAAM,CAAC,OAAO,UAAU,OAAO,4CAS9B"}

package/dist/components/{SignOut.js → sign-out.js}

@@ -2,7 +2,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { use } from "react";
 import { useStackApp, useUser } from "..";
-import GoHomeMessageCard from "../elements/RedirectMessageCard";
+import GoHomeMessageCard from "../elements/redirect-message-card";
 export default function Signout() {
     const user = useUser();
     const app = useStackApp();

package/dist/components/sign-up.d.ts

@@ -0,0 +1,4 @@
+export default function SignUp({ fullPage }: {
+    fullPage?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sign-up.d.ts.map

package/dist/components/sign-up.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sign-up.d.ts","sourceRoot":"","sources":["../../src/components/sign-up.tsx"],"names":[],"mappings":"AAWA,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAE,QAAc,EAAE,EAAE;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,2CA0BxE"}

package/dist/components/sign-up.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DividerWithText from '../elements/divider-with-text';
+import OAuthGroup from '../elements/oauth-group';
+import CardFrame from '../elements/card-frame';
+import CredentialSignUp from '../elements/credential-sign-up';
+import CardHeader from '../elements/card-header';
+import { useUser, useStackApp } from '..';
+import RedirectMessageCard from '../elements/redirect-message-card';
+import { Link, Text } from '@stackframe/stack-ui';
+export default function SignUp({ fullPage = false }) {
+    const stackApp = useStackApp();
+    const user = useUser();
+    const project = stackApp.useProject();
+    if (user) {
+        return _jsx(RedirectMessageCard, { type: 'signedIn', fullPage: fullPage });
+    }
+    const enableDivider = project.credentialEnabled && project.oauthProviders.filter(p => p.enabled).length > 0;
+    return (_jsxs(CardFrame, { fullPage: fullPage, children: [_jsx(CardHeader, { title: "Create a New Account", children: _jsxs(Text, { children: ["Already have an account? ", _jsx(Link, { href: stackApp.urls['signIn'], children: "Sign in" })] }) }), _jsx(OAuthGroup, { type: 'signup' }), enableDivider && _jsx(DividerWithText, { text: 'OR' }), project.credentialEnabled && _jsx(CredentialSignUp, {})] }));
+}

package/dist/components/stack-handler.d.ts

@@ -0,0 +1,9 @@
+import { StackServerApp } from "..";
+export default function StackHandler<HasTokenStore extends boolean>({ app, params: { stack }, searchParams, }: {
+    app: StackServerApp<HasTokenStore>;
+    params?: {
+        stack?: string[];
+    };
+    searchParams?: Record<string, string>;
+}): Promise<import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=stack-handler.d.ts.map

package/dist/components/stack-handler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-handler.d.ts","sourceRoot":"","sources":["../../src/components/stack-handler.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAiB,cAAc,EAAE,MAAM,IAAI,CAAC;AAOnD,wBAA8B,YAAY,CAAC,aAAa,SAAS,OAAO,EAAE,EACxE,GAAG,EACH,MAAM,EAAE,EAAE,KAAK,EAAO,EACtB,YAAiB,GAClB,EAAE;IACD,GAAG,EAAE,cAAc,CAAC,aAAa,CAAC,CAAC;IACnC,MAAM,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACvC,oDAuDA"}

package/dist/components/{StackHandler.js → stack-handler.js}

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import SignUp from "./SignUp";
-import SignIn from "./SignIn";
+import SignUp from "./sign-up";
+import SignIn from "./sign-in";
 import { RedirectType, notFound, redirect } from 'next/navigation';
-import EmailVerification from "./EmailVerification";
+import EmailVerification from "./email-verification";
 import { PasswordReset } from "..";
-import MessageCard from "../elements/MessageCard";
-import Signout from "./SignOut";
-import ForgotPassword from "./ForgotPassword";
-import OAuthCallback from "./OAuthCallback";
+import MessageCard from "../elements/message-card";
+import Signout from "./sign-out";
+import ForgotPassword from "./forgot-password";
+import OAuthCallback from "./oauth-callback";
 export default async function StackHandler({ app, params: { stack } = {}, searchParams = {}, }) {
     if (!stack) {
         return (_jsx(MessageCard, { title: "Invalid Stack Handler Setup", fullPage: true, children: _jsx("p", { children: "Can't use Stack handler at this location. Make sure that the file is in a folder called [...stack]." }) }));

package/dist/components-core/button.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export type ButtonProps = {
+    variant?: 'primary' | 'secondary' | 'warning';
+    color?: string;
+    size?: 'sm' | 'md' | 'lg';
+    loading?: boolean;
+} & Omit<React.HTMLProps<HTMLButtonElement>, 'size' | 'type'>;
+declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export default Button;
+//# sourceMappingURL=button.d.ts.map

package/dist/components-core/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components-core/button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAiD1B,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;AA8C7D,QAAA,MAAM,MAAM,oGA4CX,CAAC;AAIF,eAAe,MAAM,CAAC"}

package/dist/components-core/button.js

@@ -0,0 +1,115 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { useDesign } from "../providers/design-provider";
+import Color from 'color';
+import styled from 'styled-components';
+import { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES } from "../utils/constants";
+function getColors(color, primaryBgColor) {
+    const c = Color(color);
+    const pc = Color(primaryBgColor);
+    const changeColor = (value) => {
+        return c.hsl(c.hue(), c.saturationl(), c.lightness() + value).toString();
+    };
+    const getAlpha = (alpha) => {
+        return Color(pc.isDark() ? 'white' : 'black').alpha(alpha).toString();
+    };
+    if (c.alpha() === 0) {
+        return {
+            bgColor: 'transparent',
+            hoverBgColor: getAlpha(0.1),
+            activeBgColor: getAlpha(0.2),
+            textColor: pc.isLight() ? 'black' : 'white',
+        };
+    }
+    else if (c.isLight()) {
+        return {
+            bgColor: color,
+            hoverBgColor: changeColor(-10),
+            activeBgColor: changeColor(-20),
+            textColor: 'black',
+        };
+    }
+    else {
+        return {
+            bgColor: color,
+            hoverBgColor: changeColor(10),
+            activeBgColor: changeColor(20),
+            textColor: 'white',
+        };
+    }
+}
+const StyledButton = styled.button `
+  border: 0;
+  border-radius: ${BORDER_RADIUS};
+  padding: ${props => {
+    switch (props.$size) {
+        case 'sm': {
+            return '0rem 0.75rem';
+        }
+        case 'md': {
+            return '0rem 1rem';
+        }
+        case 'lg': {
+            return '0rem 2rem';
+        }
+    }
+}};
+  height: ${props => {
+    switch (props.$size) {
+        case 'sm': {
+            return '2rem';
+        }
+        case 'md': {
+            return '2.5rem';
+        }
+        case 'lg': {
+            return '3rem';
+        }
+    }
+}};
+  font-size: ${FONT_SIZES.md};
+  background-color: ${props => props.$bgColor};
+  color: ${props => props.$textColor};
+  opacity: ${props => props.disabled ? 0.5 : 1};
+  transition: background-color 0.2s;
+  cursor: pointer;
+  &:not([disabled]) {
+    &:active,&:hover:active {
+      background-color: ${props => props.$activeBgColor};
+    }
+    &:hover {
+      background-color: ${props => props.$hoverBgColor};
+    }
+  }
+  &:disabled {
+    cursor: auto;
+    opacity: 0.5;
+  }
+  font-family: ${FONT_FAMILY};
+`;
+const Button = React.forwardRef(({ variant = 'primary', size = 'md', loading = false, disabled = false, ...props }, ref) => {
+    const { colors } = useDesign();
+    let bgColor;
+    switch (variant) {
+        case 'primary': {
+            bgColor = colors.primaryColor;
+            break;
+        }
+        case 'secondary': {
+            bgColor = colors.secondaryColor;
+            break;
+        }
+        case 'warning': {
+            bgColor = '#ff4500';
+            break;
+        }
+    }
+    if (props.color) {
+        bgColor = props.color;
+    }
+    const buttonColors = getColors(bgColor, colors.primaryBgColor);
+    return (_jsx(StyledButton, { ref: ref, "$size": size, "$bgColor": buttonColors.bgColor, "$hoverBgColor": buttonColors.hoverBgColor, "$activeBgColor": buttonColors.activeBgColor, "$textColor": buttonColors.textColor, disabled: disabled || loading, ...props, children: props.children }));
+});
+Button.displayName = 'Button';
+export default Button;

package/dist/components-core/container.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export type ContainerProps = {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
+} & Omit<React.HTMLProps<HTMLDivElement>, 'size'>;
+export default function Container({ size, ...props }: ContainerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=container.d.ts.map

package/dist/components-core/container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../src/components-core/container.tsx"],"names":[],"mappings":";AAKA,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;CAClD,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC,CAAA;AAejD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,IAAS,EACT,GAAG,KAAK,EACT,EAAG,cAAc,2CAYjB"}

package/dist/components-core/container.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useDesign } from "../providers/design-provider";
+import styled from 'styled-components';
+const OuterContainer = styled.div `
+  display: flex;
+  justify-content: center;
+  width: 100%;
+`;
+const InnerContainer = styled.div `
+  width: 100%;
+  @media (min-width: ${props => props.$breakpoint}px) {
+    width: ${props => props.$breakpoint}px;
+  }
+`;
+export default function Container({ size = 'md', ...props }) {
+    const { breakpoints } = useDesign();
+    return (_jsx(OuterContainer, { children: _jsx(InnerContainer, { "$breakpoint": typeof size === 'number' ? size : breakpoints[size], ...props, children: props.children }) }));
+}

package/dist/components-core/divider.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+export type DividerProps = {
+    direction?: 'horizontal' | 'vertical';
+} & React.HTMLProps<HTMLHRElement>;
+declare const Divider: React.ForwardRefExoticComponent<Omit<DividerProps, "ref"> & React.RefAttributes<HTMLHRElement>>;
+export default Divider;
+//# sourceMappingURL=divider.d.ts.map

package/dist/components-core/divider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../src/components-core/divider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,MAAM,YAAY,GAAG;IAAE,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;AAErG,QAAA,MAAM,OAAO,iGAcZ,CAAC;AAGF,eAAe,OAAO,CAAC"}

package/dist/components-core/divider.js

@@ -0,0 +1,17 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { useDesign } from "../providers/design-provider";
+const Divider = React.forwardRef(({ direction = 'horizontal' }, ref) => {
+    const { colors } = useDesign();
+    return _jsx("hr", { ref: ref, style: {
+            width: direction === 'horizontal' ? undefined : '1px',
+            height: direction === 'horizontal' ? '1px' : undefined,
+            border: 'none',
+            backgroundColor: colors.neutralColor,
+            margin: 0,
+            padding: 0,
+        } });
+});
+Divider.displayName = 'Divider';
+export default Divider;

package/dist/components-core/index.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { ButtonProps } from './button';
+import { ContainerProps } from './container';
+import { DividerProps } from './divider';
+import { InputProps } from './input';
+import { LabelProps } from './label';
+import { LinkProps } from './link';
+import { TextProps } from './text';
+export { ButtonProps, ContainerProps, DividerProps, InputProps, LabelProps, LinkProps, TextProps, };
+export declare const Button: import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const Container: import("react").ForwardRefExoticComponent<Omit<ContainerProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Divider: import("react").ForwardRefExoticComponent<Omit<DividerProps, "ref"> & import("react").RefAttributes<HTMLHRElement>>;
+export declare const Input: import("react").ForwardRefExoticComponent<Omit<InputProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export declare const Label: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-label").LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+export declare function Link(props: LinkProps): import("react/jsx-runtime").JSX.Element;
+export declare const Text: import("react").ForwardRefExoticComponent<Omit<TextProps, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+//# sourceMappingURL=index.d.ts.map

package/dist/components-core/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components-core/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAEnC,OAAO,EACL,WAAW,EACX,cAAc,EACd,YAAY,EACZ,UAAU,EACV,UAAU,EACV,SAAS,EACT,SAAS,GACV,CAAC;AAEF,eAAO,MAAM,MAAM,wHAGjB,CAAC;AAEH,eAAO,MAAM,SAAS,wHAGpB,CAAC;AAEH,eAAO,MAAM,OAAO,qHAGlB,CAAC;AAEH,eAAO,MAAM,KAAK,sHAGhB,CAAC;AAEH,eAAO,MAAM,KAAK,wMAGhB,CAAC;AAEH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,2CAGpC;AAED,eAAO,MAAM,IAAI,yHAGf,CAAC"}

package/dist/components-core/index.js

@@ -0,0 +1,32 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { useComponents } from '../providers/component-provider';
+export const Button = forwardRef((props, ref) => {
+    const { Button } = useComponents();
+    return _jsx(Button, { ...props, ref: ref });
+});
+export const Container = forwardRef((props, ref) => {
+    const { Container } = useComponents();
+    return _jsx(Container, { ...props, ref: ref });
+});
+export const Divider = forwardRef((props, ref) => {
+    const { Divider } = useComponents();
+    return _jsx(Divider, { ...props, ref: ref });
+});
+export const Input = forwardRef((props, ref) => {
+    const { Input } = useComponents();
+    return _jsx(Input, { ...props, ref: ref });
+});
+export const Label = forwardRef((props, ref) => {
+    const { Label } = useComponents();
+    return _jsx(Label, { ...props, ref: ref });
+});
+export function Link(props) {
+    const { Link } = useComponents();
+    return _jsx(Link, { ...props });
+}
+export const Text = forwardRef((props, ref) => {
+    const { Text } = useComponents();
+    return _jsx(Text, { ...props, ref: ref });
+});

package/dist/components-core/input.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+export type InputProps = React.InputHTMLAttributes<HTMLInputElement> & Pick<React.HTMLProps<HTMLInputElement>, 'ref'>;
+declare const Input: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export default Input;
+//# sourceMappingURL=input.d.ts.map

package/dist/components-core/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/components-core/input.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,KAAK,CAAC,CAAA;AA2CrH,QAAA,MAAM,KAAK,kGAgBV,CAAC;AAGF,eAAe,KAAK,CAAC"}

package/dist/components-core/input.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { useDesign } from "../providers/design-provider";
+import styled from 'styled-components';
+import { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES, PRIMARY_FONT_COLORS, SECONDARY_FONT_COLORS } from "../utils/constants";
+const StyledInput = styled.input `
+  font-family: ${FONT_FAMILY};
+  font-size: ${FONT_SIZES.md};
+  height: 2.5rem;
+  border-radius: ${BORDER_RADIUS};
+  background-color: transparent;
+  border: 1px solid;
+  border-color: ${props => props.$borderColor};
+  padding: 0rem 1rem;
+  color: ${props => props.$textColor};
+  &::placeholder {
+    color: ${props => props.$placeholderColor};
+  }
+  &:focus-visible {
+    outline: none;
+    box-shadow: 0 0 0 2px ${props => props.$focusShadowColor};
+  }
+  &:disabled {
+    cursor: auto;
+    opacity: 0.5;
+  }
+  &[type=file] {
+    color: ${props => props.$fileSelectorColor};
+  }
+  &[type=file]::file-selector-button{
+    border: none;
+    color: ${props => props.$fileSelectorButtonColor};
+    background-color: transparent;
+    height: 2.5rem;
+    margin-right: 0.5rem;
+    padding: 0;
+  }
+`;
+const Input = React.forwardRef((props, ref) => {
+    const { colors, colorMode } = useDesign();
+    return (_jsx(StyledInput, { ref: ref, "$borderColor": colors.neutralColor, "$placeholderColor": SECONDARY_FONT_COLORS[colorMode], "$textColor": PRIMARY_FONT_COLORS[colorMode], "$fileSelectorColor": SECONDARY_FONT_COLORS[colorMode], "$fileSelectorButtonColor": PRIMARY_FONT_COLORS[colorMode], "$focusShadowColor": colors.primaryColor, ...props }));
+});
+Input.displayName = 'Input';
+export default Input;

package/dist/components-core/label.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+export type LabelProps = React.ComponentProps<typeof LabelPrimitive.Root>;
+declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+export default Label;
+//# sourceMappingURL=label.d.ts.map

package/dist/components-core/label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../src/components-core/label.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAC;AAexD,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAE1E,QAAA,MAAM,KAAK,yJAYV,CAAC;AAGF,eAAe,KAAK,CAAC"}

package/dist/components-core/label.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import styled from 'styled-components';
+import { FONT_FAMILY, FONT_SIZES, SECONDARY_FONT_COLORS } from "../utils/constants";
+import { useDesign } from "../providers/design-provider";
+const Primitive = styled(LabelPrimitive.Root) `
+  font-size: ${FONT_SIZES.sm};
+  line-height: 1;
+  color: ${props => props.color};
+  font-weight: 500;
+  font-family: ${FONT_FAMILY};
+  display: block;
+  margin-bottom: 0.5rem;
+`;
+const Label = React.forwardRef((props, ref) => {
+    const { colorMode } = useDesign();
+    return _jsx(Primitive, { color: colorMode === 'dark' ? SECONDARY_FONT_COLORS.dark : SECONDARY_FONT_COLORS.light, ref: ref, ...props });
+});
+Label.displayName = LabelPrimitive.Root.displayName;
+export default Label;

package/dist/components-core/link.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="node" />
+import { Url } from "url";
+import React from "react";
+export type LinkProps = {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    href: Url | string;
+} & Omit<React.HTMLProps<HTMLLinkElement>, 'size' | 'href'>;
+export default function Link({ size, href, style, ...props }: LinkProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=link.d.ts.map

package/dist/components-core/link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../src/components-core/link.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACxC,IAAI,EAAE,GAAG,GAAG,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;AAE3D,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,IAAS,EACT,IAAI,EACJ,KAAK,EACL,GAAG,KAAK,EACT,EAAG,SAAS,2CAmBZ"}

package/dist/components-core/link.js

@@ -0,0 +1,18 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import NextLink from "next/link";
+import { FONT_FAMILY, FONT_SIZES, LINE_HEIGHTS } from "../utils/constants";
+import { useDesign } from "..";
+export default function Link({ size = 'md', href, style, ...props }) {
+    const { colorMode } = useDesign();
+    return (_jsx(NextLink, { href: href, style: {
+            fontSize: FONT_SIZES[size],
+            lineHeight: LINE_HEIGHTS[size],
+            fontFamily: FONT_FAMILY,
+            color: colorMode === 'dark' ? '#3B82F6' : '#2563EB',
+            textDecoration: 'underline',
+            margin: 0,
+            padding: 0,
+            ...style
+        }, children: props.children }));
+}

package/dist/components-core/text.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export type TextProps = {
+    variant?: 'primary' | 'secondary' | 'warning' | 'success';
+    as?: 'p' | 'h6' | 'h5' | 'h4' | 'h3' | 'h2' | 'h1';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+} & Omit<React.HTMLProps<HTMLParagraphElement>, 'size'>;
+declare const Text: React.ForwardRefExoticComponent<Omit<TextProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export default Text;
+//# sourceMappingURL=text.d.ts.map

package/dist/components-core/text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../src/components-core/text.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,SAAS,GAAG;IACtB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,SAAS,CAAC;IAC1D,EAAE,CAAC,EAAE,GAAG,GAAG,IAAI,GAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAClD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACzC,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC,CAAA;AAEvD,QAAA,MAAM,IAAI,qGA8CR,CAAC;AAGH,eAAe,IAAI,CAAC"}

package/dist/components-core/text.js

@@ -0,0 +1,42 @@
+'use client';
+import React from "react";
+import { createElement } from "react";
+import { FONT_FAMILY, FONT_SIZES, LINE_HEIGHTS, PRIMARY_FONT_COLORS, SECONDARY_FONT_COLORS } from "../utils/constants";
+import { useDesign } from "../providers/design-provider";
+const Text = React.forwardRef(({ variant = 'primary', size = 'md', as = 'p', style, ...props }, ref) => {
+    const { colorMode } = useDesign();
+    let textColor;
+    switch (variant) {
+        case 'primary': {
+            textColor = PRIMARY_FONT_COLORS[colorMode];
+            break;
+        }
+        case 'secondary': {
+            textColor = SECONDARY_FONT_COLORS[colorMode];
+            break;
+        }
+        case 'warning': {
+            textColor = '#ff4500';
+            break;
+        }
+        case 'success': {
+            textColor = '#32cd32';
+            break;
+        }
+    }
+    return createElement(as, {
+        style: {
+            fontSize: FONT_SIZES[size],
+            lineHeight: LINE_HEIGHTS[size],
+            fontFamily: FONT_FAMILY,
+            color: textColor,
+            padding: 0,
+            margin: 0,
+            ...style
+        },
+        ref,
+        ...props
+    }, props.children);
+});
+Text.displayName = 'Typography';
+export default Text;

package/dist/components-core-joy/button.d.ts

@@ -0,0 +1,3 @@
+import { ButtonProps } from "../components-core";
+export default function Button({ variant, color, size, loading, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=button.d.ts.map

package/dist/components-core-joy/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components-core-joy/button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAIjD,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,OAAmB,EACnB,KAAK,EACL,IAAW,EACX,OAAe,EACf,GAAG,KAAK,EACT,EAAG,WAAW,2CAmCd"}

package/dist/components-core-joy/button.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button as JoyButton } from '@mui/joy';
+import Color from "color";
+export default function Button({ variant = "primary", color, size = "md", loading = false, ...props }) {
+    const muiVariant = {
+        primary: "primary",
+        secondary: "neutral",
+        warning: "danger",
+    }[variant] || "primary";
+    const { children, action, ref, ...validProps } = props;
+    const c = Color(color);
+    const changeColor = (value) => {
+        return c.hsl(c.hue(), c.saturationl(), c.lightness() + (c.isDark() ? value : -value)).toString();
+    };
+    return _jsx(JoyButton, { color: muiVariant, sx: color ? {
+            backgroundColor: color,
+            color: c.isDark() ? 'white' : 'black',
+            '&:hover': {
+                backgroundColor: changeColor(10)
+            },
+            '&:active': {
+                backgroundColor: changeColor(20)
+            },
+        } : {}, size: size, loading: loading, ...validProps, children: children });
+}

package/dist/components-core-joy/divider.d.ts

@@ -0,0 +1,3 @@
+import { DividerProps } from "../components-core";
+export default function Divider(props: DividerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=divider.d.ts.map

package/dist/components-core-joy/divider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../src/components-core-joy/divider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGlD,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,KAAK,EAAG,YAAY,2CAGnD"}