@joelbarron/react-web-dev-kit 0.1.9 → 0.1.10

package/dist/core/buttons/index.js

@@ -0,0 +1 @@
+export * from './JBButton';

package/dist/core/dialogs/JBConfirmDialog.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+export type JBConfirmDialogProps = {
+    open: boolean;
+    title?: ReactNode;
+    description?: ReactNode;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    loading?: boolean;
+    maxWidth?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    confirmColor?: 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning';
+    onConfirm: () => void;
+    onClose: () => void;
+};
+export declare function JBConfirmDialog(props: JBConfirmDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBConfirmDialog.d.ts.map

package/dist/core/dialogs/JBConfirmDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBConfirmDialog.d.ts","sourceRoot":"","sources":["../../../src/core/dialogs/JBConfirmDialog.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;IAClF,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,2CA8C1D"}

package/dist/core/dialogs/JBConfirmDialog.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Dialog, DialogActions, DialogContent, DialogTitle, Typography } from '@mui/material';
+export function JBConfirmDialog(props) {
+    const { open, title = 'Confirmar', description, confirmLabel = 'Confirmar', cancelLabel = 'Cancelar', loading = false, maxWidth = 'xs', confirmColor = 'primary', onConfirm, onClose } = props;
+    return (_jsxs(Dialog, { open: open, onClose: loading ? undefined : onClose, maxWidth: maxWidth, fullWidth: true, children: [_jsx(DialogTitle, { children: title }), description ? (_jsx(DialogContent, { children: typeof description === 'string' ? _jsx(Typography, { variant: "body2", children: description }) : description })) : null, _jsxs(DialogActions, { sx: { px: 3, pb: 2 }, children: [_jsx(Button, { variant: "outlined", onClick: onClose, disabled: loading, children: cancelLabel }), _jsx(Button, { variant: "contained", color: confirmColor, onClick: onConfirm, disabled: loading, children: confirmLabel })] })] }));
+}

package/dist/core/dialogs/index.d.ts

@@ -0,0 +1,2 @@
+export * from './JBConfirmDialog';
+//# sourceMappingURL=index.d.ts.map

package/dist/core/dialogs/index.d.ts.map

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

package/dist/core/dialogs/index.js

@@ -0,0 +1 @@
+export * from './JBConfirmDialog';

package/dist/core/index.d.ts

@@ -0,0 +1,5 @@
+export * from './dialogs';
+export * from './layout';
+export * from './skeletons';
+export * from './buttons';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC"}

package/dist/core/index.js

@@ -0,0 +1,4 @@
+export * from './dialogs';
+export * from './layout';
+export * from './skeletons';
+export * from './buttons';

package/dist/core/layout/JBContentContainer.d.ts

@@ -0,0 +1,31 @@
+import { SxProps, Theme } from '@mui/material';
+import { KeyboardEventHandler, ReactNode } from 'react';
+export type JBContentContainerProps = {
+    children: ReactNode;
+    header?: ReactNode;
+    stickyHeader?: boolean;
+    stickyHeaderTop?: number | string;
+    stickyHeaderZIndex?: number;
+    onKeyDown?: KeyboardEventHandler<HTMLDivElement>;
+    animated?: boolean;
+    animationDelayMs?: number;
+    animationDurationMs?: number;
+    padding?: number | string | {
+        xs?: number | string;
+        sm?: number | string;
+        md?: number | string;
+        lg?: number | string;
+    };
+    contentPadding?: number | string | {
+        xs?: number | string;
+        sm?: number | string;
+        md?: number | string;
+        lg?: number | string;
+    };
+    withGradient?: boolean;
+    paperSx?: SxProps<Theme>;
+    headerSx?: SxProps<Theme>;
+    contentSx?: SxProps<Theme>;
+};
+export declare function JBContentContainer(props: JBContentContainerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBContentContainer.d.ts.map

package/dist/core/layout/JBContentContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBContentContainer.d.ts","sourceRoot":"","sources":["../../../src/core/layout/JBContentContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAE3D,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAExD,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAClC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,oBAAoB,CAAC,cAAc,CAAC,CAAC;IACjD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG;QAAE,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IACvH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG;QAAE,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAE9H,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CAC5B,CAAC;AAKF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA2FhE"}

package/dist/core/layout/JBContentContainer.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Paper } from '@mui/material';
+import { alpha } from '@mui/material/styles';
+const defaultOuterPadding = { xs: 1.5, sm: 2.5, md: 3 };
+const defaultContentPadding = { xs: 2.5, sm: 3, md: 4 };
+export function JBContentContainer(props) {
+    const { children, header, stickyHeader = true, stickyHeaderTop = 0, stickyHeaderZIndex = 2, onKeyDown, animated = true, animationDelayMs = 0, animationDurationMs = 260, padding = defaultOuterPadding, contentPadding = defaultContentPadding, 
+    // borderRadius = 3,
+    withGradient = false, paperSx, headerSx, contentSx } = props;
+    return (_jsx(Box, { className: "w-full h-full", sx: { p: padding }, onKeyDown: onKeyDown, children: _jsx(Box, { sx: animated
+                ? {
+                    '@keyframes jbFadeSlideIn': {
+                        from: { opacity: 0, transform: 'translateY(14px)' },
+                        to: { opacity: 1, transform: 'translateY(0)' }
+                    },
+                    animation: `jbFadeSlideIn ${animationDurationMs}ms ease-out ${animationDelayMs}ms both`
+                }
+                : undefined, children: _jsxs(Paper, { elevation: 0, sx: [
+                    (theme) => ({
+                        position: 'relative',
+                        overflow: stickyHeader ? 'visible' : 'hidden',
+                        // borderRadius,
+                        // border: `1px solid ${theme.palette.divider}`,
+                        background: withGradient
+                            ? `linear-gradient(180deg, ${alpha(theme.palette.background.paper, 0.96)} 0%, ${alpha(theme.palette.background.default, 0.9)} 100%)`
+                            : theme.palette.background.paper
+                    }),
+                    ...(Array.isArray(paperSx) ? paperSx : paperSx ? [paperSx] : [])
+                ], children: [header ? (_jsx(Box, { sx: [
+                            {
+                                px: { xs: 2, sm: 3, md: 4 },
+                                pt: { xs: 2, sm: 2.5 },
+                                pb: 0.75,
+                                borderBottom: '1px solid',
+                                borderColor: 'divider',
+                                ...(stickyHeader
+                                    ? {
+                                        position: 'sticky',
+                                        top: stickyHeaderTop,
+                                        zIndex: stickyHeaderZIndex,
+                                        bgcolor: 'background.paper'
+                                    }
+                                    : {})
+                            },
+                            ...(Array.isArray(headerSx) ? headerSx : headerSx ? [headerSx] : [])
+                        ], children: header })) : null, _jsx(Box, { sx: [
+                            { px: contentPadding, py: contentPadding },
+                            ...(Array.isArray(contentSx) ? contentSx : contentSx ? [contentSx] : [])
+                        ], children: children })] }) }) }));
+}

package/dist/core/layout/JBFormHeader.d.ts

@@ -0,0 +1,3 @@
+import { JBFormHeaderProps } from '../../grid/types';
+export declare function JBFormHeader(props: JBFormHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBFormHeader.d.ts.map

package/dist/core/layout/JBFormHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBFormHeader.d.ts","sourceRoot":"","sources":["../../../src/core/layout/JBFormHeader.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CA+PpD"}

package/dist/core/layout/JBFormHeader.js

@@ -0,0 +1,131 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Typography } from '@mui/material';
+import { alpha } from '@mui/material/styles';
+import { JBButton } from '../buttons';
+export function JBFormHeader(props) {
+    const { moduleConfig, iconNameRenderer, animated = true, animationDurationMs = 260, animationStaggerMs = 70, animationPreset = 'vertical', breadcrumb, showBackButton = false, backLabel, onBackClick, backContent, isNew = false, recordId, title, dynamicTitle, formValues, getDynamicTitle, subtitle, dynamicSubtitle, getDynamicSubtitle, icon, actions, rightContent } = props;
+    const dynamicTitleFromResolver = getDynamicTitle?.({ isNew, values: formValues });
+    const dynamicSubtitleFromResolver = getDynamicSubtitle?.({ isNew, values: formValues });
+    const resolvedDynamicTitle = (!isNew ? dynamicTitle : undefined) ?? dynamicTitleFromResolver;
+    const moduleTitle = title ??
+        (isNew ? moduleConfig?.texts?.newText : moduleConfig?.texts?.editText) ??
+        moduleConfig?.texts?.moduleName ??
+        '';
+    const hasStaticTitle = Boolean(moduleTitle);
+    const dynamicSubtitleCandidate = dynamicSubtitle ??
+        dynamicSubtitleFromResolver ??
+        (hasStaticTitle ? resolvedDynamicTitle : undefined);
+    const staticSubtitleCandidate = subtitle ??
+        moduleConfig?.texts?.formHeaderSubtitle ??
+        '';
+    const baseSubtitle = dynamicSubtitleCandidate ?? staticSubtitleCandidate;
+    const recordPrefix = moduleConfig?.texts?.formHeaderRecordPrefix;
+    const canApplyRecordPrefix = !isNew &&
+        Boolean(recordPrefix) &&
+        recordId !== undefined &&
+        recordId !== null &&
+        String(recordId).trim() !== '' &&
+        Boolean(dynamicSubtitleCandidate);
+    const resolvedTitle = (hasStaticTitle ? moduleTitle : undefined) ||
+        resolvedDynamicTitle ||
+        '';
+    const resolvedSubtitle = canApplyRecordPrefix
+        ? [`${recordPrefix}-${recordId}`, baseSubtitle].filter(Boolean).join(' / ')
+        : baseSubtitle;
+    const resolvedBackLabel = backLabel ?? moduleConfig?.texts?.goBackToGrid ?? 'Volver';
+    const resolvedIcon = icon ??
+        (moduleConfig?.texts?.iconName && iconNameRenderer
+            ? iconNameRenderer(moduleConfig.texts.iconName)
+            : null);
+    const formDisabled = actions?.formDisabled ?? false;
+    const allowEdit = actions?.allowEdit ?? false;
+    const allowDelete = actions?.allowDelete ?? false;
+    const showDeleteWhenEditing = actions?.showDeleteWhenEditing ?? false;
+    const defaultActions = actions ? (_jsxs(Box, { sx: {
+            display: 'flex',
+            gap: 1,
+            flexWrap: 'wrap',
+            justifyContent: { xs: 'center', md: 'flex-end' },
+            alignItems: 'center',
+            width: { xs: '100%', md: 'auto' }
+        }, children: [!isNew && allowEdit && formDisabled && actions.onStartEdit ? (_jsx(JBButton, { action: "edit", size: "large", disabled: actions.disableEdit, startIcon: actions.editIcon, onClick: actions.onStartEdit, children: actions.editLabel ?? 'Editar' })) : null, (isNew || !formDisabled) && actions.onCancel ? (_jsx(JBButton, { action: "cancel", size: "large", disabled: actions.disableCancel, startIcon: actions.cancelIcon, onClick: actions.onCancel, children: actions.cancelLabel ?? 'Cancelar' })) : null, (isNew || !formDisabled) && actions.onSave ? (_jsx(JBButton, { action: "save", size: "large", disabled: actions.disableSave, startIcon: actions.saveIcon, onClick: actions.onSave, children: actions.saveLabel ?? (isNew ? 'Guardar' : 'Guardar cambios') })) : null, allowDelete &&
+                actions.onDelete &&
+                (formDisabled || showDeleteWhenEditing) ? (_jsx(JBButton, { action: "delete", size: "large", disabled: actions.disableDelete, startIcon: actions.deleteIcon, onClick: actions.onDelete, children: actions.deleteLabel ?? 'Eliminar' })) : null] })) : null;
+    const resolvedRightContent = rightContent ?? defaultActions;
+    const animateSx = (delayMs) => animated
+        ? {
+            animation: `jbHeaderFadeIn ${animationDurationMs}ms ease-out ${delayMs}ms both`
+        }
+        : undefined;
+    const animateFromLeftSx = (delayMs) => animated && animationPreset === 'sides'
+        ? {
+            animation: `jbHeaderFadeInLeft ${animationDurationMs}ms ease-out ${delayMs}ms both`
+        }
+        : animateSx(delayMs);
+    const animateFromRightSx = (delayMs) => animated && animationPreset === 'sides'
+        ? {
+            animation: `jbHeaderFadeInRight ${animationDurationMs}ms ease-out ${delayMs}ms both`
+        }
+        : animateSx(delayMs);
+    return (_jsxs(Box, { sx: {
+            width: '100%',
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 2,
+            p: { xs: 2, sm: 3 },
+            '@keyframes jbHeaderFadeIn': {
+                from: { opacity: 0, transform: 'translateY(10px)' },
+                to: { opacity: 1, transform: 'translateY(0)' }
+            },
+            '@keyframes jbHeaderFadeInLeft': {
+                from: { opacity: 0, transform: 'translateX(-16px)' },
+                to: { opacity: 1, transform: 'translateX(0)' }
+            },
+            '@keyframes jbHeaderFadeInRight': {
+                from: { opacity: 0, transform: 'translateX(16px)' },
+                to: { opacity: 1, transform: 'translateX(0)' }
+            }
+        }, children: [breadcrumb ? _jsx(Box, { sx: animateSx(0), children: breadcrumb }) : null, backContent ? _jsx(Box, { sx: animateSx(animationStaggerMs), children: backContent }) : null, showBackButton && onBackClick ? (_jsx(Typography, { role: "button", color: "text.primary", sx: {
+                    display: 'inline-flex',
+                    alignItems: 'center',
+                    gap: 0.75,
+                    width: 'fit-content',
+                    alignSelf: { xs: 'center', md: 'flex-start' },
+                    fontWeight: 500,
+                    fontSize: { xs: '0.95rem', md: '1rem' },
+                    cursor: 'pointer',
+                    opacity: 0.9,
+                    transition: 'all .16s ease',
+                    '&:hover': { opacity: 1, color: 'primary.main' },
+                    ...animateSx(animationStaggerMs * 2)
+                }, onClick: onBackClick, children: `← ${resolvedBackLabel}` })) : null, _jsxs(Box, { sx: {
+                    display: { xs: 'flex', md: 'grid' },
+                    flexDirection: { xs: 'column', md: 'row' },
+                    gridTemplateColumns: { md: 'minmax(0, 1fr) auto' },
+                    alignItems: { xs: 'center', md: 'center' },
+                    width: '100%',
+                    gap: 2
+                }, children: [_jsxs(Box, { sx: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            justifyContent: { xs: 'center', md: 'flex-start' },
+                            gap: 1.25,
+                            minWidth: 0,
+                            width: '100%',
+                            ...animateFromLeftSx(animationStaggerMs * 3)
+                        }, children: [resolvedIcon ? _jsx(Box, { sx: { display: 'inline-flex', alignItems: 'center' }, children: resolvedIcon }) : null, _jsxs(Box, { sx: { minWidth: 0, textAlign: { xs: 'center', md: 'left' } }, children: [_jsx(Typography, { variant: "h5", sx: { fontWeight: 700, lineHeight: 1.15 }, children: resolvedTitle }), resolvedSubtitle ? (_jsx(Typography, { variant: "body2", sx: (theme) => ({
+                                            mt: 0.4,
+                                            fontWeight: 500,
+                                            lineHeight: 1.1,
+                                            color: theme.palette.mode === 'dark'
+                                                ? alpha(theme.palette.common.white, 0.9)
+                                                : theme.palette.primary.dark
+                                        }), children: resolvedSubtitle })) : null] })] }), _jsx(Box, { sx: {
+                            width: { xs: '100%', md: 'auto' },
+                            display: 'flex',
+                            justifySelf: { md: 'end' },
+                            justifyContent: { xs: 'center', md: 'flex-end' },
+                            alignItems: 'center',
+                            ...animateFromRightSx(animationStaggerMs * 4)
+                        }, children: resolvedRightContent })] })] }));
+}

package/dist/core/layout/index.d.ts

@@ -0,0 +1,3 @@
+export * from './JBContentContainer';
+export * from './JBFormHeader';
+//# sourceMappingURL=index.d.ts.map

package/dist/core/layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,gBAAgB,CAAC"}

package/dist/core/layout/index.js

@@ -0,0 +1,2 @@
+export * from './JBContentContainer';
+export * from './JBFormHeader';

package/dist/core/skeletons/JBFormContentSkeleton.d.ts

@@ -0,0 +1,5 @@
+export type JBFormContentSkeletonProps = {
+    fieldCount?: number;
+};
+export declare function JBFormContentSkeleton(props: JBFormContentSkeletonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBFormContentSkeleton.d.ts.map

package/dist/core/skeletons/JBFormContentSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBFormContentSkeleton.d.ts","sourceRoot":"","sources":["../../../src/core/skeletons/JBFormContentSkeleton.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,0BAA0B,GAAG;IACvC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CA8BtE"}

package/dist/core/skeletons/JBFormContentSkeleton.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Skeleton } from '@mui/material';
+export function JBFormContentSkeleton(props) {
+    const { fieldCount = 4 } = props;
+    const fields = Array.from({ length: fieldCount });
+    return (_jsx(Box, { sx: {
+            width: '100%',
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 3
+        }, children: fields.map((_, index) => (_jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', gap: 1 }, children: [_jsx(Skeleton, { variant: "text", width: 140, height: 24 }), _jsx(Skeleton, { variant: "rounded", width: "100%", height: 44 })] }, index))) }));
+}

package/dist/core/skeletons/JBFormHeaderSkeleton.d.ts

@@ -0,0 +1,6 @@
+export type JBFormHeaderSkeletonProps = {
+    showBackLink?: boolean;
+    showActions?: boolean;
+};
+export declare function JBFormHeaderSkeleton(props: JBFormHeaderSkeletonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBFormHeaderSkeleton.d.ts.map

package/dist/core/skeletons/JBFormHeaderSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBFormHeaderSkeleton.d.ts","sourceRoot":"","sources":["../../../src/core/skeletons/JBFormHeaderSkeleton.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,yBAAyB,GAAG;IACtC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,2CAwEpE"}

package/dist/core/skeletons/JBFormHeaderSkeleton.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Skeleton } from '@mui/material';
+export function JBFormHeaderSkeleton(props) {
+    const { showBackLink = true, showActions = true } = props;
+    return (_jsxs(Box, { sx: {
+            width: '100%',
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 2,
+            p: { xs: 2, sm: 3 }
+        }, children: [_jsx(Skeleton, { variant: "rounded", width: 300, height: 28 }), showBackLink ? (_jsx(Skeleton, { variant: "text", width: 170, height: 30 })) : null, _jsxs(Box, { sx: {
+                    display: { xs: 'flex', sm: 'grid' },
+                    flexDirection: { xs: 'column', sm: 'row' },
+                    gridTemplateColumns: { sm: 'minmax(0, 1fr) auto' },
+                    alignItems: { xs: 'stretch', sm: 'center' },
+                    width: '100%',
+                    gap: 2
+                }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1.25, minWidth: 0 }, children: [_jsx(Skeleton, { variant: "circular", width: 30, height: 30 }), _jsxs(Box, { sx: { minWidth: 0 }, children: [_jsx(Skeleton, { variant: "text", width: 280, height: 52 }), _jsx(Skeleton, { variant: "text", width: 240, height: 30 })] })] }), showActions ? (_jsxs(Box, { sx: { display: 'flex', gap: 1, justifySelf: { sm: 'end' } }, children: [_jsx(Skeleton, { variant: "rounded", width: 116, height: 42 }), _jsx(Skeleton, { variant: "rounded", width: 116, height: 42 })] })) : null] })] }));
+}

package/dist/core/skeletons/index.d.ts

@@ -0,0 +1,3 @@
+export * from './JBFormHeaderSkeleton';
+export * from './JBFormContentSkeleton';
+//# sourceMappingURL=index.d.ts.map

package/dist/core/skeletons/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/skeletons/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC"}

package/dist/core/skeletons/index.js

@@ -0,0 +1,2 @@
+export * from './JBFormHeaderSkeleton';
+export * from './JBFormContentSkeleton';

package/dist/forms/JBAutocompleteField.d.ts

@@ -0,0 +1,12 @@
+import { TextFieldProps } from '@mui/material';
+import { FieldValues, Path } from 'react-hook-form';
+import { JBFieldControlProps, SelectOption } from './types';
+export type JBAutocompleteFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = JBFieldControlProps<TFieldValues, TName> & Omit<TextFieldProps, 'name' | 'defaultValue' | 'value' | 'onChange' | 'error' | 'helperText'> & {
+    options: SelectOption[];
+    loading?: boolean;
+    disableClearable?: boolean;
+    noOptionsText?: string;
+    onSearchTextChange?: (value: string) => void;
+};
+export declare function JBAutocompleteField<TFieldValues extends FieldValues, TName extends Path<TFieldValues>>(props: JBAutocompleteFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBAutocompleteField.d.ts.map

package/dist/forms/JBAutocompleteField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBAutocompleteField.d.ts","sourceRoot":"","sources":["../../src/forms/JBAutocompleteField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6C,cAAc,EAAE,MAAM,eAAe,CAAC;AAC1F,OAAO,EAAc,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5D,MAAM,MAAM,wBAAwB,CAClC,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,IAC9B,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,GAC1C,IAAI,CACF,cAAc,EACd,MAAM,GAAG,cAAc,GAAG,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,YAAY,CACxE,GAAG;IACF,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C,CAAC;AAEJ,wBAAgB,mBAAmB,CACjC,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,EAChC,KAAK,EAAE,wBAAwB,CAAC,YAAY,EAAE,KAAK,CAAC,2CAwErD"}

package/dist/forms/JBAutocompleteField.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Autocomplete, CircularProgress, TextField } from '@mui/material';
+import { Controller } from 'react-hook-form';
+import { getJBFieldErrorMessage } from './utils';
+export function JBAutocompleteField(props) {
+    const { control, name, rules, options, loading = false, disableClearable = false, noOptionsText = 'Sin opciones', onSearchTextChange, size = 'medium', ...textFieldProps } = props;
+    return (_jsx(Controller, { control: control, name: name, rules: rules, render: ({ field, fieldState }) => {
+            const selectedOption = options.find((option) => String(option.value) === String(field.value ?? '')) ?? null;
+            return (_jsx(Autocomplete, { options: options, value: selectedOption, disabled: textFieldProps.disabled, loading: loading, disableClearable: disableClearable, noOptionsText: noOptionsText, getOptionDisabled: (option) => !!option.disabled, getOptionLabel: (option) => option.label ?? '', isOptionEqualToValue: (option, value) => String(option.value) === String(value.value), onChange: (_, option) => {
+                    field.onChange(option ? option.value : '');
+                }, onInputChange: (_, value, reason) => {
+                    if (reason === 'input') {
+                        onSearchTextChange?.(value);
+                    }
+                }, renderInput: (params) => (_jsx(TextField, { ...params, ...textFieldProps, name: field.name, size: size, error: !!fieldState.error, helperText: getJBFieldErrorMessage(fieldState.error), inputRef: field.ref, InputProps: {
+                        ...params.InputProps,
+                        endAdornment: (_jsxs(_Fragment, { children: [loading ? (_jsx(CircularProgress, { color: "inherit", size: 16 })) : null, params.InputProps.endAdornment] }))
+                    } })) }));
+        } }));
+}

package/dist/forms/JBCheckboxField.d.ts

@@ -0,0 +1,12 @@
+import { CheckboxProps, FormControlLabelProps, FormControlProps, SxProps, Theme } from '@mui/material';
+import { ReactNode } from 'react';
+import { FieldValues, Path } from 'react-hook-form';
+import { JBFieldControlProps } from './types';
+export type JBCheckboxFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = JBFieldControlProps<TFieldValues, TName> & Omit<CheckboxProps, 'name' | 'checked' | 'onChange' | 'defaultChecked'> & {
+    label: ReactNode;
+    formControlProps?: Omit<FormControlProps, 'error'>;
+    formControlLabelProps?: Omit<FormControlLabelProps, 'control' | 'label'>;
+    checkboxSx?: SxProps<Theme>;
+};
+export declare function JBCheckboxField<TFieldValues extends FieldValues, TName extends Path<TFieldValues>>(props: JBCheckboxFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBCheckboxField.d.ts.map

package/dist/forms/JBCheckboxField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBCheckboxField.d.ts","sourceRoot":"","sources":["../../src/forms/JBCheckboxField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,aAAa,EAGb,qBAAqB,EACrB,gBAAgB,EAEhB,OAAO,EACP,KAAK,EACN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAc,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAG9C,MAAM,MAAM,oBAAoB,CAC9B,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,IAC9B,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,GAC1C,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,gBAAgB,CAAC,GAAG;IACxE,KAAK,EAAE,SAAS,CAAC;IACjB,gBAAgB,CAAC,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC,CAAC;IACnD,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;IACzE,UAAU,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CAC7B,CAAC;AAEJ,wBAAgB,eAAe,CAC7B,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,EAChC,KAAK,EAAE,oBAAoB,CAAC,YAAY,EAAE,KAAK,CAAC,2CAsEjD"}

package/dist/forms/JBCheckboxField.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Checkbox, FormControl, FormControlLabel, FormHelperText } from '@mui/material';
+import { Controller } from 'react-hook-form';
+import { getJBFieldErrorMessage } from './utils';
+export function JBCheckboxField(props) {
+    const { control, name, rules, label, formControlProps, formControlLabelProps, checkboxSx, ...checkboxProps } = props;
+    return (_jsx(Controller, { control: control, name: name, rules: rules, render: ({ field, fieldState }) => (_jsxs(FormControl, { ...formControlProps, error: !!fieldState.error, children: [_jsx(FormControlLabel, { ...formControlLabelProps, label: label, sx: {
+                        alignItems: 'center',
+                        m: 0,
+                        columnGap: 1,
+                        '& .MuiFormControlLabel-label': {
+                            fontSize: 14,
+                            lineHeight: 1.35,
+                            color: 'text.primary'
+                        }
+                    }, control: _jsx(Checkbox, { ...checkboxProps, size: checkboxProps.size ?? 'small', inputRef: field.ref, checked: !!field.value, onBlur: field.onBlur, onChange: (_, checked) => {
+                            field.onChange(checked);
+                        }, sx: {
+                            p: 0.25,
+                            borderRadius: 1,
+                            '& .MuiSvgIcon-root': {
+                                fontSize: 18
+                            },
+                            '&:not(.Mui-checked) .MuiSvgIcon-root': {
+                                color: 'transparent',
+                                border: '1px solid',
+                                borderColor: 'rgba(15, 23, 42, 0.35)',
+                                borderRadius: '4px',
+                                backgroundColor: 'background.paper'
+                            },
+                            '&:hover:not(.Mui-checked) .MuiSvgIcon-root': {
+                                borderColor: 'rgba(15, 23, 42, 0.55)'
+                            },
+                            ...(checkboxSx ?? {})
+                        } }) }), _jsx(FormHelperText, { children: getJBFieldErrorMessage(fieldState.error) })] })) }));
+}

package/dist/forms/JBDatePickerField.d.ts

@@ -0,0 +1,13 @@
+import { TextFieldProps } from '@mui/material';
+import { DatePicker } from '@mui/x-date-pickers';
+import { ComponentProps } from 'react';
+import { FieldValues, Path } from 'react-hook-form';
+import { JBFieldControlProps } from './types';
+type MuiDatePickerProps = ComponentProps<typeof DatePicker>;
+export type JBDatePickerFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = JBFieldControlProps<TFieldValues, TName> & Omit<MuiDatePickerProps, 'value' | 'onChange' | 'slotProps'> & {
+    textFieldProps?: TextFieldProps;
+    storeAsDateString?: boolean;
+};
+export declare function JBDatePickerField<TFieldValues extends FieldValues, TName extends Path<TFieldValues>>(props: JBDatePickerFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=JBDatePickerField.d.ts.map

package/dist/forms/JBDatePickerField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBDatePickerField.d.ts","sourceRoot":"","sources":["../../src/forms/JBDatePickerField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,UAAU,EAAwB,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAc,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAG9C,KAAK,kBAAkB,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAE5D,MAAM,MAAM,sBAAsB,CAChC,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,IAC9B,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,GAC1C,IAAI,CAAC,kBAAkB,EAAE,OAAO,GAAG,UAAU,GAAG,WAAW,CAAC,GAAG;IAC7D,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAyCJ,wBAAgB,iBAAiB,CAC/B,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,EAChC,KAAK,EAAE,sBAAsB,CAAC,YAAY,EAAE,KAAK,CAAC,2CAqDnD"}

package/dist/forms/JBDatePickerField.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
+import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers';
+import { Controller } from 'react-hook-form';
+import { getJBFieldErrorMessage } from './utils';
+const asDateValue = (value) => {
+    if (value instanceof Date && !Number.isNaN(value.getTime())) {
+        return value;
+    }
+    if (typeof value !== 'string' || !value.trim()) {
+        return null;
+    }
+    const isoDateOnlyMatch = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value.trim());
+    if (isoDateOnlyMatch) {
+        const year = Number(isoDateOnlyMatch[1]);
+        const month = Number(isoDateOnlyMatch[2]);
+        const day = Number(isoDateOnlyMatch[3]);
+        const localDate = new Date(year, month - 1, day);
+        if (!Number.isNaN(localDate.getTime())) {
+            return localDate;
+        }
+    }
+    const parsed = new Date(value);
+    if (Number.isNaN(parsed.getTime())) {
+        return null;
+    }
+    return parsed;
+};
+const formatDateValue = (value) => {
+    if (!(value instanceof Date) || Number.isNaN(value.getTime())) {
+        return '';
+    }
+    const year = value.getFullYear();
+    const month = String(value.getMonth() + 1).padStart(2, '0');
+    const day = String(value.getDate()).padStart(2, '0');
+    return `${year}-${month}-${day}`;
+};
+export function JBDatePickerField(props) {
+    const { control, name, rules, textFieldProps, storeAsDateString = false, ...datePickerProps } = props;
+    const { size = 'medium', ...resolvedTextFieldProps } = textFieldProps ?? {};
+    const mergedTextFieldSx = Array.isArray(resolvedTextFieldProps.sx)
+        ? [
+            {
+                '& .MuiOutlinedInput-root, & .MuiPickersOutlinedInput-root': {
+                    backgroundColor: 'common.background'
+                }
+            },
+            ...resolvedTextFieldProps.sx
+        ]
+        : [
+            {
+                '& .MuiOutlinedInput-root, & .MuiPickersOutlinedInput-root': {
+                    backgroundColor: 'common.background'
+                }
+            },
+            resolvedTextFieldProps.sx
+        ];
+    return (_jsx(Controller, { control: control, name: name, rules: rules, render: ({ field, fieldState }) => (_jsx(LocalizationProvider, { dateAdapter: AdapterDateFns, children: _jsx(DatePicker, { ...datePickerProps, value: storeAsDateString ? asDateValue(field.value) : field.value ?? null, onChange: (value) => field.onChange(storeAsDateString ? formatDateValue(value) : value), slotProps: {
+                    textField: {
+                        ...resolvedTextFieldProps,
+                        size,
+                        sx: mergedTextFieldSx,
+                        error: !!fieldState.error,
+                        helperText: getJBFieldErrorMessage(fieldState.error) ?? resolvedTextFieldProps.helperText
+                    }
+                } }) })) }));
+}

package/dist/forms/JBRadioGroupField.d.ts

@@ -0,0 +1,10 @@
+import { FormControlProps, RadioGroupProps } from '@mui/material';
+import { FieldValues, Path } from 'react-hook-form';
+import { JBFieldControlProps, SelectOption } from './types';
+export type JBRadioGroupFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = JBFieldControlProps<TFieldValues, TName> & Omit<RadioGroupProps, 'name' | 'value' | 'onChange'> & {
+    label?: string;
+    options: SelectOption[];
+    formControlProps?: Omit<FormControlProps, 'error'>;
+};
+export declare function JBRadioGroupField<TFieldValues extends FieldValues, TName extends Path<TFieldValues>>(props: JBRadioGroupFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBRadioGroupField.d.ts.map

package/dist/forms/JBRadioGroupField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBRadioGroupField.d.ts","sourceRoot":"","sources":["../../src/forms/JBRadioGroupField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,gBAAgB,EAKhB,eAAe,EAChB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAc,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5D,MAAM,MAAM,sBAAsB,CAChC,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,IAC9B,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,GAC1C,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,CAAC,GAAG;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,gBAAgB,CAAC,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC,CAAC;CACpD,CAAC;AAEJ,wBAAgB,iBAAiB,CAC/B,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,EAChC,KAAK,EAAE,sBAAsB,CAAC,YAAY,EAAE,KAAK,CAAC,2CAkCnD"}

package/dist/forms/JBRadioGroupField.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FormControl, FormControlLabel, FormHelperText, FormLabel, Radio, RadioGroup } from '@mui/material';
+import { Controller } from 'react-hook-form';
+import { getJBFieldErrorMessage } from './utils';
+export function JBRadioGroupField(props) {
+    const { control, name, rules, label, options, formControlProps, ...radioGroupProps } = props;
+    return (_jsx(Controller, { control: control, name: name, rules: rules, render: ({ field, fieldState }) => (_jsxs(FormControl, { ...formControlProps, error: !!fieldState.error, children: [label ? _jsx(FormLabel, { children: label }) : null, _jsx(RadioGroup, { ...radioGroupProps, name: field.name, value: field.value ?? '', onBlur: field.onBlur, onChange: (_, value) => field.onChange(value), children: options.map((option) => (_jsx(FormControlLabel, { value: option.value, disabled: option.disabled, control: _jsx(Radio, { inputRef: field.ref }), label: option.label }, `${option.value}`))) }), _jsx(FormHelperText, { children: getJBFieldErrorMessage(fieldState.error) })] })) }));
+}

package/dist/forms/JBSelectField.d.ts

@@ -0,0 +1,9 @@
+import { TextFieldProps } from '@mui/material';
+import { FieldValues, Path } from 'react-hook-form';
+import { JBFieldControlProps, SelectOption } from './types';
+export type JBSelectFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = JBFieldControlProps<TFieldValues, TName> & Omit<TextFieldProps, 'name' | 'defaultValue' | 'value' | 'onChange' | 'error' | 'helperText' | 'select'> & {
+    options: SelectOption[];
+    emptyOptionLabel?: string;
+};
+export declare function JBSelectField<TFieldValues extends FieldValues, TName extends Path<TFieldValues>>(props: JBSelectFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JBSelectField.d.ts.map

package/dist/forms/JBSelectField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JBSelectField.d.ts","sourceRoot":"","sources":["../../src/forms/JBSelectField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,cAAc,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,EAAc,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5D,MAAM,MAAM,kBAAkB,CAC5B,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,IAC9B,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,GAC1C,IAAI,CACF,cAAc,EACd,MAAM,GAAG,cAAc,GAAG,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,YAAY,GAAG,QAAQ,CACnF,GAAG;IACF,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEJ,wBAAgB,aAAa,CAC3B,YAAY,SAAS,WAAW,EAChC,KAAK,SAAS,IAAI,CAAC,YAAY,CAAC,EAChC,KAAK,EAAE,kBAAkB,CAAC,YAAY,EAAE,KAAK,CAAC,2CA8B/C"}

package/dist/forms/JBSelectField.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MenuItem, TextField } from '@mui/material';
+import { Controller } from 'react-hook-form';
+import { getJBFieldErrorMessage } from './utils';
+export function JBSelectField(props) {
+    const { control, name, rules, options, emptyOptionLabel, size = 'medium', ...textFieldProps } = props;
+    return (_jsx(Controller, { control: control, name: name, rules: rules, render: ({ field, fieldState }) => (_jsxs(TextField, { ...textFieldProps, ...field, size: size, select: true, value: field.value ?? '', error: !!fieldState.error, helperText: getJBFieldErrorMessage(fieldState.error), children: [emptyOptionLabel ? _jsx(MenuItem, { value: "", children: emptyOptionLabel }) : null, options.map((option, index) => (_jsx(MenuItem, { value: option.value, disabled: option.disabled, children: option.label }, `${option.value}-${index}`)))] })) }));
+}