@stackframe/stack 2.1.2 → 2.2.0

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

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

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

@@ -1 +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"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components-core/button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AA4F1B,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,MAAM,CAAC;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;CAChD,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAA;AAkDzE,QAAA,MAAM,MAAM,oGAoCX,CAAC;AAIF,OAAO,EACL,MAAM,GACP,CAAC"}

package/dist/components-core/button.js

@@ -1,30 +1,61 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } 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, backgroundColor) {
-    const c = Color(color);
-    const pc = Color(backgroundColor);
+import { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES, LINK_COLORS } from "../utils/constants";
+import LoadingIndicator from "./loading-indicator";
+function getColors({ propsColor, colors, variant, colorMode, }) {
+    let bgColor;
+    switch (variant) {
+        case 'primary': {
+            bgColor = colors.primaryColor;
+            break;
+        }
+        case 'secondary': {
+            bgColor = colors.secondaryColor;
+            break;
+        }
+        case 'warning': {
+            bgColor = '#ff4500';
+            break;
+        }
+        case 'link': {
+            bgColor = 'transparent';
+            break;
+        }
+    }
+    if (propsColor) {
+        bgColor = propsColor;
+    }
+    const c = Color(bgColor);
+    const pc = Color(colors.primaryColor);
     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 (variant === 'link') {
+        return {
+            bgColor: 'transparent',
+            hoverBgColor: getAlpha(0.1),
+            activeBgColor: getAlpha(0.2),
+            textColor: LINK_COLORS[colorMode],
+        };
+    }
     if (c.alpha() === 0) {
         return {
             bgColor: 'transparent',
             hoverBgColor: getAlpha(0.1),
             activeBgColor: getAlpha(0.2),
-            textColor: pc.isLight() ? 'black' : 'white',
+            textColor: colors.primaryColor,
         };
     }
     else if (c.isLight()) {
         return {
-            bgColor: color,
+            bgColor,
             hoverBgColor: changeColor(-10),
             activeBgColor: changeColor(-20),
             textColor: 'black',
@@ -32,7 +63,7 @@ function getColors(color, backgroundColor) {
     }
     else {
         return {
-            bgColor: color,
+            bgColor,
             hoverBgColor: changeColor(10),
             activeBgColor: changeColor(20),
             textColor: 'white',
@@ -87,29 +118,18 @@ const StyledButton = styled.button `
     opacity: 0.5;
   }
   font-family: ${FONT_FAMILY};
+  text-decoration: ${props => props.$underline ? 'underline' : 'none'};
+  position: relative;
 `;
-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.backgroundColor);
-    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 }));
+const Button = React.forwardRef(({ variant = 'primary', size = 'md', loading = false, ...props }, ref) => {
+    const { colors, colorMode } = useDesign();
+    const buttonColors = getColors({
+        propsColor: props.color,
+        colors,
+        variant,
+        colorMode,
+    });
+    return (_jsxs(StyledButton, { ref: ref, "$size": size, "$bgColor": buttonColors.bgColor, "$hoverBgColor": buttonColors.hoverBgColor, "$activeBgColor": buttonColors.activeBgColor, "$textColor": buttonColors.textColor, "$underline": variant === 'link', "$loading": loading, ...props, children: [_jsx("div", { style: { position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', visibility: loading ? 'visible' : 'hidden' }, children: _jsx(LoadingIndicator, { color: buttonColors.textColor }) }), _jsx("div", { style: { visibility: loading ? 'hidden' : 'visible' }, children: props.children })] }));
 });
 Button.displayName = 'Button';
-export default Button;
+export { Button, };

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

@@ -1,5 +1,6 @@
 import * as React from "react";
-export type CardProps = React.HTMLProps<HTMLDivElement>;
-declare const Card: React.ForwardRefExoticComponent<Omit<CardProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export default Card;
-//# sourceMappingURL=card.d.ts.map
+declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Card, CardHeader, CardFooter, CardContent, };

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

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/components-core/card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;AAExD,QAAA,MAAM,IAAI,+FAUT,CAAC;AAGF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/components-core/card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,IAAI,6GAGR,CAAC;AAGH,QAAA,MAAM,UAAU,6GAEd,CAAC;AAGH,QAAA,MAAM,WAAW,6GAEf,CAAC;AAGH,QAAA,MAAM,UAAU,6GAEd,CAAC;AA8BH,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,WAAW,GACZ,CAAC"}

package/dist/components-core/card.js

@@ -1,18 +1,37 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { useDesign } from "../providers/design-provider";
-import styled from 'styled-components';
+import styled from "styled-components";
+import { useDesign } from "..";
+const Card = React.forwardRef((props, ref) => {
+    const { colors } = useDesign();
+    return _jsx(StyledCard, { ref: ref, ...props, backgroundColor: colors.backgroundColor, borderColor: colors.neutralColor });
+});
+Card.displayName = "Card";
+const CardHeader = React.forwardRef((props, ref) => (_jsx(StyledCardHeader, { ref: ref, ...props })));
+CardHeader.displayName = "CardHeader";
+const CardContent = React.forwardRef((props, ref) => (_jsx(StyledCardContent, { ref: ref, ...props })));
+CardContent.displayName = "CardContent";
+const CardFooter = React.forwardRef((props, ref) => (_jsx(StyledCardFooter, { ref: ref, ...props })));
+CardFooter.displayName = "CardFooter";
 const StyledCard = styled.div `
-  border-radius: 0.75rem;
+  border-radius: 0.5rem;
   border: 1px solid ${props => props.borderColor};
   background-color: ${props => props.backgroundColor};
   box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
   padding: 1.5rem;
 `;
-const Card = React.forwardRef((props, ref) => {
-    const { colors, colorMode } = useDesign();
-    return _jsx(StyledCard, { ref: ref, ...props, backgroundColor: colors.backgroundColor, borderColor: colors.neutralColor });
-});
-Card.displayName = "Card";
-export default Card;
+const StyledCardHeader = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 0.375rem;
+  margin-bottom: 1.5rem;
+`;
+const StyledCardContent = styled.div `
+`;
+const StyledCardFooter = styled.div `
+  display: flex;
+  align-items: center;
+  margin-top: 1.5rem;
+`;
+export { Card, CardHeader, CardFooter, CardContent, };

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

@@ -0,0 +1,5 @@
+declare const Collapsible: any;
+declare const CollapsibleTrigger: any;
+declare const CollapsibleContent: any;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };
+//# sourceMappingURL=collapsble.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"collapsble.d.ts","sourceRoot":"","sources":["../../src/components-core/collapsble.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,WAAW,KAA4B,CAAC;AAE9C,QAAA,MAAM,kBAAkB,KAA0C,CAAC;AAEnE,QAAA,MAAM,kBAAkB,KAA0C,CAAC;AAEnE,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/components-core/collapsble.js

@@ -0,0 +1,6 @@
+"use client";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+const Collapsible = CollapsiblePrimitive.Root;
+const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
+const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+declare const Collapsible: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const CollapsibleTrigger: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const CollapsibleContent: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };

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

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.d.ts","sourceRoot":"","sources":["../../src/components-core/collapsible.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAC;AAEpE,QAAA,MAAM,WAAW,kIAA4B,CAAC;AAC9C,QAAA,MAAM,kBAAkB,4IAA0C,CAAC;AACnE,QAAA,MAAM,kBAAkB,yIAA0C,CAAC;AAEnE,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/components-core/collapsible.js

@@ -0,0 +1,6 @@
+"use client";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+const Collapsible = CollapsiblePrimitive.Root;
+const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
+const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-export type ContainerProps = {
+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
+export declare function Container({ size, ...props }: ContainerProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -1 +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"}
+{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../src/components-core/container.tsx"],"names":[],"mappings":";AAKA,KAAK,cAAc,GAAG;IACpB,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,wBAAgB,SAAS,CAAC,EACxB,IAAS,EACT,GAAG,KAAK,EACT,EAAG,cAAc,2CAYjB"}

package/dist/components-core/container.js

@@ -13,7 +13,7 @@ const InnerContainer = styled.div `
     width: ${props => props.$breakpoint}px;
   }
 `;
-export default function Container({ size = 'md', ...props }) {
+export 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

@@ -1,6 +1,5 @@
 import React from 'react';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
-export type DividerProps = React.ComponentProps<typeof SeparatorPrimitive.Root>;
-declare const Divider: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export default Divider;
+declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Separator };
 //# sourceMappingURL=divider.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../src/components-core/divider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAC;AAIhE,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,CAAC;AAehF,QAAA,MAAM,OAAO,6JAaX,CAAC;AAIH,eAAe,OAAO,CAAC"}
+{"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../src/components-core/divider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAC;AAiBhE,QAAA,MAAM,SAAS,6JAab,CAAC;AAIH,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components-core/divider.js

@@ -4,7 +4,7 @@ import React from 'react';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import styled from 'styled-components';
 import { useDesign } from '..';
-const StyledDivider = styled(SeparatorPrimitive.Root) `
+const StyledSeparator = styled(SeparatorPrimitive.Root) `
   flex-shrink: 0;
   background-color: ${props => props.$color};
   
@@ -12,9 +12,9 @@ const StyledDivider = styled(SeparatorPrimitive.Root) `
     ? 'height: 1px; width: 100%;'
     : 'height: 100%; width: 1px;'}
 `;
-const Divider = React.forwardRef(({ orientation = 'horizontal', decorative = true, ...props }, ref) => {
+const Separator = React.forwardRef(({ orientation = 'horizontal', decorative = true, ...props }, ref) => {
     const { colors } = useDesign();
-    return _jsx(StyledDivider, { ref: ref, decorative: decorative, "$orientation": orientation, "$color": colors.neutralColor, ...props });
+    return _jsx(StyledSeparator, { ref: ref, decorative: decorative, "$orientation": orientation, "$color": colors.neutralColor, ...props });
 });
-Divider.displayName = 'Separator';
-export default Divider;
+Separator.displayName = 'Separator';
+export { Separator };

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

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, };

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

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../src/components-core/dropdown.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,qBAAqB,MAAM,+BAA+B,CAAC;AAIvE,QAAA,MAAM,YAAY,mDAA6B,CAAC;AAUhD,QAAA,MAAM,mBAAmB,gLAKvB,CAAC;AAgBH,QAAA,MAAM,mBAAmB,0KAgBvB,CAAC;AAyBH,QAAA,MAAM,gBAAgB;;wCAQpB,CAAC;AAUH,QAAA,MAAM,iBAAiB;;wCAOrB,CAAC;AAWH,QAAA,MAAM,qBAAqB,4KAMzB,CAAC;AAGH,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,qBAAqB,GACtB,CAAC"}

package/dist/components-core/dropdown.js

@@ -0,0 +1,73 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import styled from 'styled-components';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { useDesign } from '..';
+import { SELECTED_BACKGROUND_COLORS } from '../utils/constants';
+const DropdownMenu = DropdownMenuPrimitive.Root;
+const StyledTrigger = styled(DropdownMenuPrimitive.Trigger) `
+  all: unset;
+  &:focus {
+    outline: none;
+    box-shadow: 0;
+  }
+`;
+const DropdownMenuTrigger = React.forwardRef(({ className, ...props }, ref) => (_jsx(StyledTrigger, { ref: ref, ...props })));
+const StyledContent = styled(DropdownMenuPrimitive.Content) `
+  z-index: 50;
+  min-width: 8rem;
+  overflow: hidden;
+  border-radius: 4px;
+  border: 1px solid ${({ $neutralColor }) => $neutralColor};
+  background: ${({ $backgroundColor }) => $backgroundColor};
+  padding: 0.25rem;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+`;
+const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => {
+    const { colors } = useDesign();
+    return (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(StyledContent, { "$backgroundColor": colors.backgroundColor, "$neutralColor": colors.neutralColor, sideOffset: sideOffset, ref: ref, ...props }) }));
+});
+DropdownMenuContent.displayName = 'DropdownMenuContent';
+const StyledItem = styled(DropdownMenuPrimitive.Item) `
+  display: flex;
+  cursor: default;
+  align-items: center;
+  border-radius: 4px;
+  padding: 0.375rem 0.5rem;
+  font-size: 0.875rem;
+  outline: none;
+  transition: color 0.2s ease;
+  &:focus {
+    background-color: var(--accent);
+    color: var(--accent-foreground);
+  }
+  &:hover {
+    background-color: ${({ $colorMode }) => SELECTED_BACKGROUND_COLORS[$colorMode]};
+  }
+  ${({ $inset }) => $inset && 'padding-left: 2rem;'}
+`;
+const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => {
+    const { colorMode } = useDesign();
+    return _jsx(StyledItem, { ref: ref, ...props, "$inset": inset, "$colorMode": colorMode });
+});
+DropdownMenuItem.displayName = 'DropdownMenuItem';
+const StyledLabel = styled(DropdownMenuPrimitive.Label) `
+  padding: 0.375rem 0.5rem;
+  font-size: 0.875rem;
+  font-weight: bold;
+  ${({ inset }) => inset && 'padding-left: 2rem;'}
+`;
+const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(StyledLabel, { ref: ref, ...props, inset: inset })));
+DropdownMenuLabel.displayName = 'DropdownMenuLabel';
+const StyledSeparator = styled(DropdownMenuPrimitive.Separator) `
+  margin: 0.25rem -0.25rem;
+  height: 1px;
+  background-color: ${({ $color }) => $color};
+`;
+const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => {
+    const { colors } = useDesign();
+    return _jsx(StyledSeparator, { ref: ref, ...props, "$color": colors.neutralColor });
+});
+DropdownMenuSeparator.displayName = 'DropdownMenuSeparator';
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, };

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

@@ -1,19 +1,41 @@
-/// <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';
-import { CardProps } from './card';
-export { ButtonProps, ContainerProps, DividerProps, InputProps, LabelProps, LinkProps, TextProps, CardProps, };
-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<import("@radix-ui/react-separator").SeparatorProps & import("react").RefAttributes<HTMLDivElement>, "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>>;
-export declare const Card: import("react").ForwardRefExoticComponent<Omit<CardProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=index.d.ts.map
+import React from 'react';
+import type { Link as StaticLink } from './link';
+import type { Popover as StaticPopover } from './popover';
+import type { DropdownMenu as StaticDropdownMenu } from './dropdown';
+import type { Collapsible as StaticCollapsible } from './collapsible';
+export declare const Button: React.ForwardRefExoticComponent<Omit<Omit<import("./button").ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Container: React.ForwardRefExoticComponent<Omit<{
+    size?: number | "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+} & Omit<React.HTMLProps<HTMLDivElement>, "size">, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Separator: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-separator").SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLHRElement>>;
+export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.InputHTMLAttributes<HTMLInputElement> & Pick<React.HTMLProps<HTMLInputElement>, "ref">, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const Label: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-label").LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+export declare function Link(props: React.ComponentProps<typeof StaticLink>): import("react/jsx-runtime").JSX.Element;
+export declare const Text: React.ForwardRefExoticComponent<Omit<Omit<{
+    variant?: "primary" | "secondary" | "warning" | "success" | undefined;
+    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+} & Omit<React.HTMLProps<HTMLParagraphElement>, "size">, "ref"> & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export declare const Card: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare function Popover(props: React.ComponentProps<typeof StaticPopover>): import("react/jsx-runtime").JSX.Element;
+export declare const PopoverTrigger: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-popover").PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const PopoverContent: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-popover").PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare function DropdownMenu(props: React.ComponentProps<typeof StaticDropdownMenu>): import("react/jsx-runtime").JSX.Element;
+export declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Avatar: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-avatar").AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-avatar").AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const AvatarImage: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-avatar").AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
+export declare function Collapsible(props: React.ComponentProps<typeof StaticCollapsible>): import("react/jsx-runtime").JSX.Element;
+export declare const CollapsibleTrigger: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-collapsible").CollapsibleTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const CollapsibleContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-collapsible").CollapsibleContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const CardHeader: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const CardContent: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const CardFooter: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -1 +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;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAEnC,OAAO,EACL,WAAW,EACX,cAAc,EACd,YAAY,EACZ,UAAU,EACV,UAAU,EACV,SAAS,EACT,SAAS,EACT,SAAS,GACV,CAAC;AAEF,eAAO,MAAM,MAAM,wHAGjB,CAAC;AAEH,eAAO,MAAM,SAAS,wHAGpB,CAAC;AAEH,eAAO,MAAM,OAAO,2MAGlB,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;AAEH,eAAO,MAAM,IAAI,mHAGf,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components-core/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,QAAQ,CAAC;AAQjD,OAAO,KAAK,EACV,OAAO,IAAI,aAAa,EAGzB,MAAM,WAAW,CAAC;AACnB,OAAO,KAAK,EACV,YAAY,IAAI,kBAAkB,EAMnC,MAAM,YAAY,CAAC;AAMpB,OAAO,KAAK,EACV,WAAW,IAAI,iBAAiB,EAGjC,MAAM,eAAe,CAAC;AAGvB,eAAO,MAAM,MAAM,6KAgBjB,CAAC;AAEH,eAAO,MAAM,SAAS;;gGAMpB,CAAC;AAEH,eAAO,MAAM,SAAS,gOAMpB,CAAC;AAEH,eAAO,MAAM,KAAK,yOAMhB,CAAC;AAEH,eAAO,MAAM,KAAK,+NAMhB,CAAC;AAEH,wBAAgB,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,2CAGlE;AAED,eAAO,MAAM,IAAI;;;;gKAMf,CAAC;AAEH,eAAO,MAAM,IAAI,gKAMf,CAAC;AAEH,wBAAgB,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,2CAGxE;AAED,eAAO,MAAM,cAAc,uLAMzB,CAAC;AAEH,eAAO,MAAM,cAAc,oOAMzB,CAAC;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,2CAGlF;AAED,eAAO,MAAM,mBAAmB,wPAM9B,CAAC;AAEH,eAAO,MAAM,mBAAmB,+OAM9B,CAAC;AAEH,eAAO,MAAM,gBAAgB;;sFAM3B,CAAC;AAEH,eAAO,MAAM,iBAAiB;;sFAM5B,CAAC;AAEH,eAAO,MAAM,qBAAqB,iPAMhC,CAAC;AAEH,eAAO,MAAM,MAAM,6NAMjB,CAAC;AAEH,eAAO,MAAM,cAAc,qOAMzB,CAAC;AAEH,eAAO,MAAM,WAAW,sOAMtB,CAAC;AAEH,wBAAgB,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,2CAGhF;AAED,eAAO,MAAM,kBAAkB,+LAM7B,CAAC;AAEH,eAAO,MAAM,kBAAkB,yLAM7B,CAAC;AAEH,eAAO,MAAM,UAAU,gKAMrB,CAAC;AAEH,eAAO,MAAM,WAAW,gKAMtB,CAAC;AAEH,eAAO,MAAM,UAAU,gKAMrB,CAAC"}

package/dist/components-core/index.js

@@ -2,17 +2,21 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { useComponents } from '../providers/component-provider';
+import { useAsyncCallbackWithLoggedError } from '@stackframe/stack-shared/dist/hooks/use-async-callback';
 export const Button = forwardRef((props, ref) => {
     const { Button } = useComponents();
-    return _jsx(Button, { ...props, ref: ref });
+    const [onClick, onClickLoading] = useAsyncCallbackWithLoggedError(async () => {
+        return await props.onClick?.();
+    }, [props.onClick]);
+    return _jsx(Button, { ...props, onClick: props.onClick && onClick, loading: props.loading || onClickLoading, disabled: props.disabled || onClickLoading, 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 Separator = forwardRef((props, ref) => {
+    const { Separator } = useComponents();
+    return _jsx(Separator, { ...props, ref: ref });
 });
 export const Input = forwardRef((props, ref) => {
     const { Input } = useComponents();
@@ -34,3 +38,75 @@ export const Card = forwardRef((props, ref) => {
     const { Card } = useComponents();
     return _jsx(Card, { ...props, ref: ref });
 });
+export function Popover(props) {
+    const { Popover } = useComponents();
+    return _jsx(Popover, { ...props });
+}
+export const PopoverTrigger = forwardRef((props, ref) => {
+    const { PopoverTrigger } = useComponents();
+    return _jsx(PopoverTrigger, { ...props, ref: ref });
+});
+export const PopoverContent = forwardRef((props, ref) => {
+    const { PopoverContent } = useComponents();
+    return _jsx(PopoverContent, { ...props, ref: ref });
+});
+export function DropdownMenu(props) {
+    const { DropdownMenu } = useComponents();
+    return _jsx(DropdownMenu, { ...props });
+}
+export const DropdownMenuTrigger = forwardRef((props, ref) => {
+    const { DropdownMenuTrigger } = useComponents();
+    return _jsx(DropdownMenuTrigger, { ...props, ref: ref });
+});
+export const DropdownMenuContent = forwardRef((props, ref) => {
+    const { DropdownMenuContent } = useComponents();
+    return _jsx(DropdownMenuContent, { ...props, ref: ref });
+});
+export const DropdownMenuItem = forwardRef((props, ref) => {
+    const { DropdownMenuItem } = useComponents();
+    return _jsx(DropdownMenuItem, { ...props, ref: ref });
+});
+export const DropdownMenuLabel = forwardRef((props, ref) => {
+    const { DropdownMenuLabel } = useComponents();
+    return _jsx(DropdownMenuLabel, { ...props, ref: ref });
+});
+export const DropdownMenuSeparator = forwardRef((props, ref) => {
+    const { DropdownMenuSeparator } = useComponents();
+    return _jsx(DropdownMenuSeparator, { ...props, ref: ref });
+});
+export const Avatar = forwardRef((props, ref) => {
+    const { Avatar } = useComponents();
+    return _jsx(Avatar, { ...props, ref: ref });
+});
+export const AvatarFallback = forwardRef((props, ref) => {
+    const { AvatarFallback } = useComponents();
+    return _jsx(AvatarFallback, { ...props, ref: ref });
+});
+export const AvatarImage = forwardRef((props, ref) => {
+    const { AvatarImage } = useComponents();
+    return _jsx(AvatarImage, { ...props, ref: ref });
+});
+export function Collapsible(props) {
+    const { Collapsible } = useComponents();
+    return _jsx(Collapsible, { ...props });
+}
+export const CollapsibleTrigger = forwardRef((props, ref) => {
+    const { CollapsibleTrigger } = useComponents();
+    return _jsx(CollapsibleTrigger, { ...props, ref: ref });
+});
+export const CollapsibleContent = forwardRef((props, ref) => {
+    const { CollapsibleContent } = useComponents();
+    return _jsx(CollapsibleContent, { ...props, ref: ref });
+});
+export const CardHeader = forwardRef((props, ref) => {
+    const { CardHeader } = useComponents();
+    return _jsx(CardHeader, { ...props, ref: ref });
+});
+export const CardContent = forwardRef((props, ref) => {
+    const { CardContent } = useComponents();
+    return _jsx(CardContent, { ...props, ref: ref });
+});
+export const CardFooter = forwardRef((props, ref) => {
+    const { CardFooter } = useComponents();
+    return _jsx(CardFooter, { ...props, ref: ref });
+});

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

@@ -1,5 +1,4 @@
 import React from "react";
-export type InputProps = React.InputHTMLAttributes<HTMLInputElement> & Pick<React.HTMLProps<HTMLInputElement>, 'ref'>;
+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
+export { Input };

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

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

package/dist/components-core/input.js

@@ -42,4 +42,4 @@ const Input = React.forwardRef((props, ref) => {
     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;
+export { Input };