@kimdw-rtk/ui 0.0.18 → 0.0.21

package/dist/components/Card/CardInteraction.d.ts

@@ -1,10 +1,5 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
+import type { UIComponent } from '@/types';
 type CardInteractionProps = UIComponent<'div'>;
-declare const CardInteraction: react.ForwardRefExoticComponent<Omit<CardInteractionProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
-export { CardInteraction };
+export declare const CardInteraction: import("react").ForwardRefExoticComponent<Omit<CardInteractionProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=CardInteraction.d.ts.map

package/dist/components/Card/CardInteraction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardInteraction.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardInteraction.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,KAAK,oBAAoB,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;AAE/C,eAAO,MAAM,eAAe,8HAoB3B,CAAC"}

package/dist/components/Card/CardInteraction.js

@@ -0,0 +1,14 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { cardInteraction } from './CardInteraction.css.js';
+import { useRipple } from '../../hooks/useRipple/index.js';
+import { sx } from '../../styles/sx.js';
+
+const CardInteraction = forwardRef(({ children, className, sx: propSx, ...props }, ref) => {
+    const { ripple } = useRipple(ref);
+    return (jsxRuntimeExports.jsxs("div", { ref: ref, className: clsx(className, cardInteraction, cardInteraction, sx(propSx)), ...props, children: [children, ripple] }));
+});
+CardInteraction.displayName = 'CardInteraction';
+
+export { CardInteraction };

package/dist/components/Card/CardThumbnail.css.d.ts

@@ -1,3 +1,2 @@
-declare const thumbnail: string;
-
-export { thumbnail };
+export declare const thumbnail: string;
+//# sourceMappingURL=CardThumbnail.css.d.ts.map

package/dist/components/Card/CardThumbnail.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardThumbnail.css.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardThumbnail.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,QAGpB,CAAC"}

package/dist/components/Card/CardThumbnail.css.js

@@ -0,0 +1,8 @@
+import { styleWithLayer } from '../../utils/styleUtils.css.js';
+
+const thumbnail = styleWithLayer({
+    width: 'auto',
+    maxWidth: '100%',
+});
+
+export { thumbnail };

package/dist/components/Card/CardThumbnail.d.ts

@@ -1,10 +1,5 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
+import type { UIComponent } from '@/types';
 type CardThumbnailProps = UIComponent<'img'>;
-declare const CardThumbnail: react.ForwardRefExoticComponent<Omit<CardThumbnailProps, "ref"> & react.RefAttributes<HTMLImageElement>>;
-
-export { CardThumbnail };
+export declare const CardThumbnail: import("react").ForwardRefExoticComponent<Omit<CardThumbnailProps, "ref"> & import("react").RefAttributes<HTMLImageElement>>;
+export {};
+//# sourceMappingURL=CardThumbnail.d.ts.map

package/dist/components/Card/CardThumbnail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardThumbnail.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardThumbnail.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,KAAK,kBAAkB,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;AAE7C,eAAO,MAAM,aAAa,8HAUzB,CAAC"}

package/dist/components/Card/CardThumbnail.js

@@ -0,0 +1,12 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { thumbnail } from './CardThumbnail.css.js';
+import { sx } from '../../styles/sx.js';
+
+const CardThumbnail = forwardRef(({ className, sx: propSx, ...props }, ref) => {
+    return (jsxRuntimeExports.jsx("img", { ref: ref, className: clsx(thumbnail, className, sx(propSx)), ...props }));
+});
+CardThumbnail.displayName = 'CardThumbnail';
+
+export { CardThumbnail };

package/dist/components/Card/index.d.ts

@@ -1,10 +1,5 @@
-export { Card } from './Card.js';
-export { CardContent } from './CardContent.js';
-export { CardInteraction } from './CardInteraction.js';
-export { CardThumbnail } from './CardThumbnail.js';
-export { C as cardCss } from '../../Card.css-CotPlKu4.js';
-import 'react';
-import '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
+export * from './Card';
+export * from './CardContent';
+export * from './CardInteraction';
+export * from './CardThumbnail';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC"}

package/dist/components/Chip/Chip.css.d.ts

@@ -1,2 +1,46 @@
-import '@vanilla-extract/recipes';
-export { c as chip } from '../../Chip.css-lxhSCCWQ.js';
+export declare const chip: import("@vanilla-extract/recipes").RuntimeFn<{
+    color: {
+        red: string;
+        orange: string;
+        amber: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        slate: string;
+        gray: string;
+        zinc: string;
+        neutral: string;
+        stone: string;
+        primary: string;
+        secondary: string;
+        muted: string;
+        accent: string;
+        card: string;
+        danger: string;
+        warning: string;
+        success: string;
+    };
+    size: {
+        sm: {
+            fontSize: "0.75em";
+        };
+        md: {
+            fontSize: "0.875em";
+        };
+        lg: {
+            fontSize: "1em";
+        };
+    };
+}>;
+//# sourceMappingURL=Chip.css.d.ts.map

package/dist/components/Chip/Chip.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.css.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.css.ts"],"names":[],"mappings":"AAqCA,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqCf,CAAC"}

package/dist/components/Chip/Chip.css.js

@@ -0,0 +1,59 @@
+import { createVar } from '../../node_modules/.pnpm/@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.esm.js';
+import { recipeWithLayer, styleWithLayer } from '../../utils/styleUtils.css.js';
+import { SCALE_COLOR } from '../../tokens/scale/color.js';
+import { theme } from '../../themes/theme.css.js';
+import { semanticColor } from '../../tokens/semantic/color.js';
+
+const backgroundVar = createVar();
+const foregroundVar = createVar();
+const semanticColors = semanticColor.reduce((prev, color) => ({
+    ...prev,
+    [color]: styleWithLayer({
+        vars: {
+            [backgroundVar]: theme.color[color],
+            [foregroundVar]: theme.color[`${color}-foreground`],
+        },
+    }),
+}), {});
+const scaleColors = SCALE_COLOR.reduce((prev, value) => ({
+    ...prev,
+    [value]: styleWithLayer({
+        vars: {
+            [backgroundVar]: theme.color[value][500],
+            [foregroundVar]: theme.color[value][50],
+        },
+    }),
+}), {});
+const chip = recipeWithLayer({
+    base: {
+        display: 'inline-flex',
+        alignItems: 'center',
+        lineHeight: '0',
+        gap: '0.125em',
+        height: '2em',
+        padding: '0 0.75em',
+        borderRadius: theme.borderRadius,
+        backgroundColor: `rgb(${backgroundVar})`,
+        color: `rgb(${foregroundVar})`,
+        userSelect: 'none',
+    },
+    variants: {
+        color: {
+            ...semanticColors,
+            ...scaleColors,
+        },
+        size: {
+            sm: {
+                fontSize: '0.75em',
+            },
+            md: {
+                fontSize: '0.875em',
+            },
+            lg: {
+                fontSize: '1em',
+            },
+        },
+    },
+});
+
+export { chip };

package/dist/components/Chip/Chip.d.ts

@@ -1,12 +1,6 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import { c as chip } from '../../Chip.css-lxhSCCWQ.js';
-export { C as chipCss } from '../../Chip.css-lxhSCCWQ.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
-type ChipProps = UIComponent<'div', typeof chip>;
-declare const Chip: react.ForwardRefExoticComponent<Omit<ChipProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
-export { Chip };
+import type { UIComponent } from '@/types';
+import * as s from './Chip.css';
+type ChipProps = UIComponent<'div', typeof s.chip>;
+export declare const Chip: import("react").ForwardRefExoticComponent<Omit<ChipProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export { s as chipCss };
+//# sourceMappingURL=Chip.d.ts.map

package/dist/components/Chip/Chip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,OAAO,KAAK,CAAC,MAAM,YAAY,CAAC;AAEhC,KAAK,SAAS,GAAG,WAAW,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC;AAEnD,eAAO,MAAM,IAAI,mHAsBhB,CAAC;AAGF,OAAO,EAAE,CAAC,IAAI,OAAO,EAAE,CAAC"}

package/dist/components/Chip/Chip.js

@@ -0,0 +1,14 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { chip } from './Chip.css.js';
+import * as Chip_css from './Chip.css.js';
+export { Chip_css as chipCss };
+import { sx } from '../../styles/sx.js';
+
+const Chip = forwardRef(({ children, className, color = 'primary', size = 'md', sx: propSx, ...props }, ref) => {
+    return (jsxRuntimeExports.jsx("div", { ref: ref, className: clsx(chip({ color, size }), className, sx(propSx)), ...props, children: jsxRuntimeExports.jsx("span", { children: children }) }));
+});
+Chip.displayName = 'Chip';
+
+export { Chip };

package/dist/components/Chip/Chip.spec.d.ts

@@ -1,2 +1,2 @@
-
-export {  }
+export {};
+//# sourceMappingURL=Chip.spec.d.ts.map

package/dist/components/Chip/Chip.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.spec.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.spec.tsx"],"names":[],"mappings":""}

package/dist/components/Chip/index.d.ts

@@ -1,7 +1,2 @@
-export { Chip } from './Chip.js';
-export { C as chipCss } from '../../Chip.css-lxhSCCWQ.js';
-import 'react';
-import '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
+export * from './Chip';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Chip/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/dist/components/Confirm/index.d.ts

@@ -1,6 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode, Ref } from 'react';
-
+import { type ReactNode, type Ref } from 'react';
 interface ConfirmProps {
     children: ReactNode;
     ref?: Ref<{
@@ -9,6 +7,6 @@ interface ConfirmProps {
     onConfirm: () => void;
     onCancle: () => void;
 }
-declare const Confirm: ({ children, ref, onConfirm, onCancle, }: ConfirmProps) => react_jsx_runtime.JSX.Element;
-
-export { Confirm };
+export declare const Confirm: ({ children, ref, onConfirm, onCancle, }: ConfirmProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Confirm/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Confirm/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAMtE,UAAU,YAAY;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,GAAG,CAAC,EAAE,GAAG,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,OAAO,GAAI,yCAKrB,YAAY,4CAuBd,CAAC"}

package/dist/components/Confirm/index.js

@@ -0,0 +1,19 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { useImperativeHandle } from 'react';
+import { useOverlay, usePreventKeyboardInput } from '@kimdw-rtk/utils';
+import { Box } from '../Box/index.js';
+import { Dialog } from '../Dialog/Dialog.js';
+import { DialogContent } from '../Dialog/DialogContent.js';
+import { DialogFooter } from '../Dialog/DialogFooter.js';
+import { Button } from '../Button/index.js';
+
+const Confirm = ({ children, ref, onConfirm, onCancle, }) => {
+    const { close } = useOverlay();
+    usePreventKeyboardInput();
+    useImperativeHandle(ref, () => ({
+        close,
+    }));
+    return (jsxRuntimeExports.jsxs(Dialog, { children: [jsxRuntimeExports.jsx(DialogContent, { children: children }), jsxRuntimeExports.jsx(DialogFooter, { children: jsxRuntimeExports.jsxs(Box, { flex: true, gap: "md", children: [jsxRuntimeExports.jsx(Button, { size: "sm", onClick: onConfirm, children: "\uD655\uC778" }), jsxRuntimeExports.jsx(Button, { color: "secondary", size: "sm", onClick: onCancle, children: "\uCDE8\uC18C" })] }) })] }));
+};
+
+export { Confirm };

package/dist/components/Dialog/Dialog.css.d.ts

@@ -1,4 +1,3 @@
-declare const container: string;
-declare const message: string;
-
-export { container, message };
+export declare const container: string;
+export declare const message: string;
+//# sourceMappingURL=Dialog.css.d.ts.map

package/dist/components/Dialog/Dialog.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.css.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,SAAS,QAapB,CAAC;AAEH,eAAO,MAAM,OAAO,QAKlB,CAAC"}

package/dist/components/Dialog/Dialog.css.js

@@ -0,0 +1,22 @@
+import { style } from '../../node_modules/.pnpm/@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.esm.js';
+import { theme } from '../../themes/theme.css.js';
+
+const container = style({
+    display: 'flex',
+    flexDirection: 'column',
+    gap: '1rem',
+    overflowY: 'auto',
+    maxWidth: 'calc(100vw - 2rem)',
+    minWidth: 'min(20rem, calc(100vw - 2rem))',
+    maxHeight: 'calc(100vh - 2rem)',
+    borderRadius: theme.borderRadius,
+    boxSizing: 'border-box',
+    backgroundColor: `rgb(${theme.color.background})`,
+});
+style({
+    marginBottom: '1rem',
+    lineHeight: '150%',
+    wordBreak: 'break-all',
+});
+
+export { container };

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

@@ -1,10 +1,5 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
+import type { UIComponent } from '@/types';
 type DialogProps = Omit<UIComponent<'div'>, 'color'>;
-declare const Dialog: react.ForwardRefExoticComponent<Omit<DialogProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
-export { Dialog };
+export declare const Dialog: import("react").ForwardRefExoticComponent<Omit<DialogProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=Dialog.d.ts.map

package/dist/components/Dialog/Dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,KAAK,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;AAErD,eAAO,MAAM,MAAM,qHAgBlB,CAAC"}

package/dist/components/Dialog/Dialog.js

@@ -0,0 +1,13 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { container } from './Dialog.css.js';
+import { Box } from '../Box/index.js';
+import { sx } from '../../styles/sx.js';
+
+const Dialog = forwardRef(({ children, className, sx: propSx, ...props }, ref) => {
+    return (jsxRuntimeExports.jsx(Box, { ref: ref, flex: true, flexDirection: "row", gap: "lg", boxShadow: "border-sm", className: clsx(container, className, sx(propSx)), ...props, children: children }));
+});
+Dialog.displayName = 'Dialog';
+
+export { Dialog };

package/dist/components/Dialog/Dialog.spec.d.ts

@@ -1,2 +1,2 @@
-
-export {  }
+export {};
+//# sourceMappingURL=Dialog.spec.d.ts.map

package/dist/components/Dialog/Dialog.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.spec.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.spec.tsx"],"names":[],"mappings":""}

package/dist/components/Dialog/DialogContent.css.d.ts

@@ -1,3 +1,2 @@
-declare const container: string;
-
-export { container };
+export declare const container: string;
+//# sourceMappingURL=DialogContent.css.d.ts.map

package/dist/components/Dialog/DialogContent.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogContent.css.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/DialogContent.css.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,SAAS,QAUpB,CAAC"}

package/dist/components/Dialog/DialogContent.css.js

@@ -0,0 +1,15 @@
+import { styleWithLayer } from '../../utils/styleUtils.css.js';
+import { container as container$1 } from './DialogHeader.css.js';
+import { theme } from '../../themes/theme.css.js';
+
+const container = styleWithLayer({
+    padding: '0 1.5rem 1.5rem 1.5rem',
+    wordBreak: 'break-all',
+    selectors: {
+        [`${container$1} + &`]: {
+            color: `rgb(${theme.color['muted-foreground']})`,
+        },
+    },
+});
+
+export { container };

package/dist/components/Dialog/DialogContent.d.ts

@@ -1,10 +1,5 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
+import type { UIComponent } from '@/types';
 type DialogContentProps = Omit<UIComponent<'div'>, 'color'>;
-declare const DialogContent: react.ForwardRefExoticComponent<Omit<DialogContentProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
-export { DialogContent };
+export declare const DialogContent: import("react").ForwardRefExoticComponent<Omit<DialogContentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=DialogContent.d.ts.map

package/dist/components/Dialog/DialogContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogContent.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/DialogContent.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,KAAK,kBAAkB,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;AAE5D,eAAO,MAAM,aAAa,4HAYzB,CAAC"}

package/dist/components/Dialog/DialogContent.js

@@ -0,0 +1,13 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { container } from './DialogContent.css.js';
+import { Box } from '../Box/index.js';
+import { sx } from '../../styles/sx.js';
+
+const DialogContent = forwardRef(({ children, className, sx: propSx, ...props }, ref) => {
+    return (jsxRuntimeExports.jsx(Box, { ref: ref, className: clsx(container, className, sx(propSx)), ...props, children: children }));
+});
+DialogContent.displayName = 'DialogContent';
+
+export { DialogContent };

package/dist/components/Dialog/DialogFooter.css.d.ts

@@ -1,4 +1,3 @@
-declare const container: string;
-declare const message: string;
-
-export { container, message };
+export declare const container: string;
+export declare const message: string;
+//# sourceMappingURL=DialogFooter.css.d.ts.map

package/dist/components/Dialog/DialogFooter.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogFooter.css.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/DialogFooter.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,QAUpB,CAAC;AAEH,eAAO,MAAM,OAAO,QAKlB,CAAC"}

package/dist/components/Dialog/DialogFooter.d.ts

@@ -1,10 +1,5 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
+import type { UIComponent } from '@/types';
 type DialogFooterProps = Omit<UIComponent<'div'>, 'color'>;
-declare const DialogFooter: react.ForwardRefExoticComponent<Omit<DialogFooterProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
-export { DialogFooter };
+export declare const DialogFooter: import("react").ForwardRefExoticComponent<Omit<DialogFooterProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=DialogFooter.d.ts.map

package/dist/components/Dialog/DialogFooter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogFooter.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/DialogFooter.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,KAAK,iBAAiB,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;AAE3D,eAAO,MAAM,YAAY,2HAcxB,CAAC"}

package/dist/components/Dialog/DialogFooter.js

@@ -0,0 +1,12 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { Box } from '../Box/index.js';
+import { sx } from '../../styles/sx.js';
+
+const DialogFooter = forwardRef(({ children, className, sx: propSx, ...props }, ref) => {
+    return (jsxRuntimeExports.jsx(Box, { ref: ref, flex: true, justifyContent: "flex-end", className: clsx(className, sx(propSx)), ...props, children: children }));
+});
+DialogFooter.displayName = 'DialogFooter';
+
+export { DialogFooter };

package/dist/components/Dialog/DialogHeader.css.d.ts

@@ -1,4 +1,3 @@
-declare const container: string;
-declare const close: string;
-
-export { close, container };
+export declare const container: string;
+export declare const close: string;
+//# sourceMappingURL=DialogHeader.css.d.ts.map

package/dist/components/Dialog/DialogHeader.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogHeader.css.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/DialogHeader.css.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS,QAOpB,CAAC;AAEH,eAAO,MAAM,KAAK,QAkBhB,CAAC"}

package/dist/components/Dialog/DialogHeader.css.js

@@ -0,0 +1,26 @@
+import { styleWithLayer } from '../../utils/styleUtils.css.js';
+import { theme } from '../../themes/theme.css.js';
+
+const container = styleWithLayer({
+    position: 'sticky',
+    top: '0',
+    padding: '1.5rem',
+    zIndex: '10',
+    backgroundColor: `rgb(${theme.color.background})`,
+});
+const close = styleWithLayer({
+    width: '1.25rem',
+    height: '1.25rem',
+    padding: '0',
+    border: '0',
+    backgroundColor: 'transparent',
+    fontSize: '1em',
+    color: `rgb(${theme.color['muted-foreground']})`,
+    cursor: 'pointer',
+    transition: 'color 0.1s ease',
+    ':hover': {
+        color: `rgb(${theme.color['foreground']})`,
+    },
+});
+
+export { close, container };

package/dist/components/Dialog/DialogHeader.d.ts

@@ -1,12 +1,7 @@
-import * as react from 'react';
-import { UIComponent } from '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
-
+import type { UIComponent } from '@/types';
 interface DialogHeaderProps extends Omit<UIComponent<'div'>, 'color'> {
     onCloseClick?: () => void;
 }
-declare const DialogHeader: react.ForwardRefExoticComponent<Omit<DialogHeaderProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
-export { DialogHeader };
+export declare const DialogHeader: import("react").ForwardRefExoticComponent<Omit<DialogHeaderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=DialogHeader.d.ts.map

package/dist/components/Dialog/DialogHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/DialogHeader.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,UAAU,iBAAkB,SAAQ,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACnE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,2HAoBxB,CAAC"}

package/dist/components/Dialog/DialogHeader.js

@@ -0,0 +1,14 @@
+import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
+import { forwardRef } from 'react';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
+import { close, container } from './DialogHeader.css.js';
+import X from '../../node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/x.js';
+import { Box } from '../Box/index.js';
+import { sx } from '../../styles/sx.js';
+
+const DialogHeader = forwardRef(({ children, className, sx: propSx, onCloseClick, ...props }, ref) => {
+    return (jsxRuntimeExports.jsxs(Box, { ref: ref, flex: true, justifyContent: "space-between", alignItems: "center", fontSize: "lg", fontWeight: "normal", className: clsx(container, className, sx(propSx)), ...props, children: [jsxRuntimeExports.jsx("span", { children: children }), jsxRuntimeExports.jsx("button", { className: close, onClick: onCloseClick, "aria-label": "\uB2EB\uAE30", children: jsxRuntimeExports.jsx(X, {}) })] }));
+});
+DialogHeader.displayName = 'DialogHeader';
+
+export { DialogHeader };

package/dist/components/Dialog/index.d.ts

@@ -1,9 +1,5 @@
-export { Dialog } from './Dialog.js';
-export { DialogContent } from './DialogContent.js';
-export { DialogFooter } from './DialogFooter.js';
-export { DialogHeader } from './DialogHeader.js';
-import 'react';
-import '../../types/ui.types.js';
-import '@vanilla-extract/css';
-import '@vanilla-extract/recipes';
-import '../../styles/sprinkles.css.js';
+export * from './Dialog';
+export * from './DialogContent';
+export * from './DialogFooter';
+export * from './DialogHeader';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Dialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC"}