@eml-payments/ui-kit 0.1.65 → 0.1.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/src/components/Dialog/DialogContainer.d.ts +3 -1
  2. package/dist/src/components/Dialog/DialogContainer.js +2 -2
  3. package/dist/src/components/Dialog/DialogContainer.stories.d.ts +1 -0
  4. package/dist/src/components/Dialog/DialogContainer.stories.js +3 -0
  5. package/package.json +2 -2
package/dist/src/components/Dialog/DialogContainer.d.ts CHANGED
@@ -7,8 +7,10 @@ export interface DialogContainerProps {
7
7
  submitLoader?: boolean;
8
8
  submitLabel?: string;
9
9
  cancelLabel?: string;
10
+ backLabel?: string;
10
11
  onSubmit?: () => void;
11
12
  onCancel?: () => void;
13
+ onBack?: () => void;
12
14
  isSubmitDisabled?: boolean;
13
15
  fullScreen?: boolean;
14
16
  showCloseButton?: boolean;
@@ -16,4 +18,4 @@ export interface DialogContainerProps {
16
18
  showSubmitButton?: boolean;
17
19
  customFooter?: React.ReactNode;
18
20
  }
19
- export declare function DialogContainer({ triggerElement, title, description, children, submitLoader, submitLabel, cancelLabel, onSubmit, onCancel, isSubmitDisabled, fullScreen, showCloseButton, showCancelButton, showSubmitButton, customFooter, }: Readonly<DialogContainerProps>): import("react/jsx-runtime").JSX.Element;
21
+ export declare function DialogContainer({ triggerElement, title, description, children, submitLoader, submitLabel, cancelLabel, backLabel, onSubmit, onCancel, onBack, isSubmitDisabled, fullScreen, showCloseButton, showCancelButton, showSubmitButton, customFooter, }: Readonly<DialogContainerProps>): import("react/jsx-runtime").JSX.Element;
package/dist/src/components/Dialog/DialogContainer.js CHANGED
@@ -4,9 +4,9 @@ import { Dialog, DialogTrigger, DialogContent, DialogClose, DialogHeader, Dialog
4
4
  import { cn } from '../../lib/utils';
5
5
  import { Button } from '../Button';
6
6
  import { FiX } from 'react-icons/fi';
7
- export function DialogContainer({ triggerElement, title, description, children, submitLoader = false, submitLabel = 'Submit', cancelLabel = 'Cancel', onSubmit, onCancel, isSubmitDisabled = false, fullScreen = false, showCloseButton = true, showCancelButton = true, showSubmitButton = true, customFooter, }) {
7
+ export function DialogContainer({ triggerElement, title, description, children, submitLoader = false, submitLabel = 'Submit', cancelLabel = 'Cancel', backLabel = 'Back', onSubmit, onCancel, onBack, isSubmitDisabled = false, fullScreen = false, showCloseButton = true, showCancelButton = true, showSubmitButton = true, customFooter, }) {
8
8
  const shouldShowFooter = customFooter || showCancelButton || showSubmitButton;
9
9
  return (_jsxs(Dialog, { children: [_jsx(DialogTrigger, { asChild: true, children: triggerElement }), _jsxs(DialogContent, { showCloseButton: showCloseButton, className: cn('min-h-screen overflow-auto p-0 flex flex-col w-full sm:max-w-lg md:max-w-xl lg:max-w-2xl', fullScreen ? 'min-w-full h-screen' : 'min-h-[300px] max-h-[600px]'), children: [_jsx("div", { className: "sticky top-0 z-10 bg-background border-b", children: _jsxs(DialogHeader, { className: cn('p-6 border-b space-y-2'), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(DialogTitle, { className: cn('text-(--uikit-textPrimary) text-[24px] font-normal', {
10
10
  'text-left': fullScreen,
11
- }), children: title }), showCloseButton && (_jsx(DialogClose, { asChild: true, children: _jsx("button", { className: "hover:cursor-pointer", children: _jsx(FiX, { className: "w-5 h-5 text-(--uikit-actionActive)" }) }) }))] }), description && (_jsx(DialogDescription, { className: "text-muted-foreground", children: description }))] }) }), _jsx("div", { className: cn('overflow-y-auto px-6 py-6 space-y-4 flex-1'), children: children }), shouldShowFooter && (_jsx("div", { className: "sticky bottom-0 z-10 bg-background border-t p-4 flex justify-end gap-2", children: customFooter ? (_jsx(React.Fragment, { children: customFooter })) : (_jsxs(React.Fragment, { children: [showCancelButton && (_jsx(DialogClose, { asChild: true, children: _jsx(Button, { variant: "secondary", onClick: onCancel, children: cancelLabel }) })), showSubmitButton && (_jsx(Button, { onClick: onSubmit, disabled: isSubmitDisabled || submitLoader, loading: submitLoader, className: cn('btn', isSubmitDisabled && 'opacity-50 cursor-not-allowed'), children: submitLabel }))] })) }))] })] }));
11
+ }), children: title }), showCloseButton && (_jsx(DialogClose, { asChild: true, children: _jsx("button", { className: "hover:cursor-pointer", children: _jsx(FiX, { className: "w-5 h-5 text-(--uikit-actionActive)" }) }) }))] }), description && (_jsx(DialogDescription, { className: "text-muted-foreground", children: description }))] }) }), _jsx("div", { className: cn('overflow-y-auto px-6 py-6 space-y-4 flex-1'), children: children }), shouldShowFooter && (_jsx("div", { className: "sticky bottom-0 z-10 bg-background border-t p-4 flex justify-end gap-2", children: customFooter ? (_jsx(React.Fragment, { children: customFooter })) : (_jsxs(React.Fragment, { children: [showCancelButton && (_jsx(DialogClose, { asChild: true, children: _jsx(Button, { variant: "secondary", onClick: onCancel, children: cancelLabel }) })), onBack && (_jsx(Button, { variant: "secondary", onClick: onBack, children: backLabel })), showSubmitButton && (_jsx(Button, { onClick: onSubmit, disabled: isSubmitDisabled || submitLoader, loading: submitLoader, className: cn('btn', isSubmitDisabled && 'opacity-50 cursor-not-allowed'), children: submitLabel }))] })) }))] })] }));
12
12
  }
package/dist/src/components/Dialog/DialogContainer.stories.d.ts CHANGED
@@ -4,6 +4,7 @@ declare const meta: Meta<typeof DialogContainer>;
4
4
  export default meta;
5
5
  type Story = StoryObj<typeof DialogContainer>;
6
6
  export declare const Default: Story;
7
+ export declare const WithBackButton: Story;
7
8
  export declare const WithDisabledSubmit: Story;
8
9
  export declare const WithOverflow: Story;
9
10
  export declare const FullScreen: Story;
package/dist/src/components/Dialog/DialogContainer.stories.js CHANGED
@@ -14,6 +14,9 @@ function InputPairs({ count = 10 }) {
14
14
  export const Default = {
15
15
  render: () => (_jsxs(DialogContainer, { triggerElement: _jsx(Button, { children: "Open Dialog" }), title: "Create Profile", onSubmit: () => alert('Submitted'), onCancel: () => alert('Canceled'), children: [_jsx(Input, { placeholder: "Full Name" }), _jsx(Input, { placeholder: "Email Address", type: "email" })] })),
16
16
  };
17
+ export const WithBackButton = {
18
+ render: () => (_jsxs(DialogContainer, { triggerElement: _jsx(Button, { children: "Open Dialog" }), title: "Create Profile", onSubmit: () => alert('Submitted'), showCancelButton: false, onBack: () => alert('Back Pressed'), children: [_jsx(Input, { placeholder: "Full Name" }), _jsx(Input, { placeholder: "Email Address", type: "email" })] })),
19
+ };
17
20
  export const WithDisabledSubmit = {
18
21
  render: () => (_jsxs(DialogContainer, { triggerElement: _jsx(Button, { children: "Open Dialog" }), title: "With Disabled Submit", isSubmitDisabled: true, onSubmit: () => alert('Submitted'), onCancel: () => alert('Canceled'), children: [_jsx(Input, { placeholder: "Full Name" }), _jsx(Input, { placeholder: "Email Address", type: "email" })] })),
19
22
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eml-payments/ui-kit",
3
- "version": "0.1.65",
3
+ "version": "0.1.66",
4
4
  "private": false,
5
5
  "description": "ARLO UIKit",
6
6
  "homepage": "https://github.com/EML-Payments/arlo.npm.uikit#readme",
@@ -89,7 +89,7 @@
89
89
  "eslint-plugin-jsx-a11y": "^6.10.2",
90
90
  "eslint-plugin-prettier": "^5.5.1",
91
91
  "eslint-plugin-react": "^7.37.5",
92
- "eslint-plugin-react-hooks": "^6.1.1",
92
+ "eslint-plugin-react-hooks": "^7.0.0",
93
93
  "eslint-plugin-react-refresh": "^0.4.20",
94
94
  "eslint-plugin-storybook": "^9.0.15",
95
95
  "husky": "^9.1.7",