@lateralus-ai/shipping-ui 1.4.13 → 1.4.14

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 (64) hide show
  1. package/README.md +108 -108
  2. package/dist/index.cjs +38 -38
  3. package/dist/index.esm.js +4495 -4489
  4. package/dist/tailwind-theme.d.ts +12 -0
  5. package/package.json +99 -99
  6. package/src/components/DocumentEditor/DocumentEditor.tsx +871 -871
  7. package/src/components/HelloWorld.tsx +3 -3
  8. package/src/components/InputPrompt.tsx +96 -96
  9. package/src/components/ModalPanel.tsx +49 -49
  10. package/src/components/PdfViewer/ImageViewer.tsx +211 -211
  11. package/src/components/PdfViewer/PdfViewer.tsx +232 -232
  12. package/src/components/PdfViewer/index.ts +2 -2
  13. package/src/components/PdfViewer/usePageManagement.ts +32 -32
  14. package/src/components/PdfViewer/usePanning.ts +42 -42
  15. package/src/components/PdfViewer/useRefDimensions.ts +16 -16
  16. package/src/components/PdfViewer/useRotation.ts +13 -13
  17. package/src/components/PdfViewer/useZoom.ts +26 -26
  18. package/src/components/SearchModal.tsx +320 -320
  19. package/src/components/Sidebar/Button.tsx +20 -20
  20. package/src/components/Sidebar/Container.tsx +31 -31
  21. package/src/components/Sidebar/Item.tsx +39 -39
  22. package/src/components/Sidebar/Layout.tsx +32 -32
  23. package/src/components/Sidebar/Provider.tsx +47 -47
  24. package/src/components/Sidebar/SecondaryItem.tsx +39 -39
  25. package/src/components/Sidebar/SideContainer.tsx +31 -31
  26. package/src/components/Sidebar/ToggleCollapseButton.tsx +24 -24
  27. package/src/components/Sidebar/index.ts +8 -8
  28. package/src/components/Tabs.tsx +43 -43
  29. package/src/components/icons/CloseSidebarIcon.tsx +19 -19
  30. package/src/components/icons/CloseSidebarMidIcon.tsx +19 -19
  31. package/src/components/icons/ExpandIcon.tsx +21 -21
  32. package/src/components/icons/SendArrowIcon.tsx +23 -23
  33. package/src/components/icons/SendArrowIconGreen.tsx +17 -17
  34. package/src/components/icons/SettingsIcon.tsx +33 -33
  35. package/src/components/icons/XIcon.tsx +21 -21
  36. package/src/components/index.ts +6 -6
  37. package/src/index.ts +4 -4
  38. package/src/material-theme.ts +477 -477
  39. package/src/stories/Buttons.stories.tsx +15 -15
  40. package/src/stories/Buttons.tsx +52 -52
  41. package/src/stories/Checkbox.stories.tsx +15 -15
  42. package/src/stories/Checkbox.tsx +56 -56
  43. package/src/stories/ColorPalette.stories.tsx +15 -15
  44. package/src/stories/ColorPalette.tsx +85 -72
  45. package/src/stories/DocumentEditor.stories.tsx +287 -287
  46. package/src/stories/Dropdowns.stories.tsx +15 -15
  47. package/src/stories/Dropdowns.tsx +52 -52
  48. package/src/stories/InputPrompt.stories.tsx +15 -15
  49. package/src/stories/InputPrompt.tsx +63 -63
  50. package/src/stories/ModalHeader.stories.tsx +35 -35
  51. package/src/stories/PDFViewer.stories.tsx +39 -39
  52. package/src/stories/SearchModal.stories.tsx +132 -132
  53. package/src/stories/SearchModal.tsx +82 -82
  54. package/src/stories/Sidebar.stories.tsx +15 -15
  55. package/src/stories/Sidebar.tsx +108 -108
  56. package/src/stories/Tabs.stories.tsx +51 -51
  57. package/src/stories/Typography.stories.tsx +15 -15
  58. package/src/stories/Typography.tsx +110 -110
  59. package/src/style.css +2 -2
  60. package/src/styles/tabs.css +55 -55
  61. package/src/tailwind-theme.ts +243 -231
  62. package/src/types/documentEditor.ts +55 -55
  63. package/src/utils/checkboxModule.ts +241 -241
  64. package/src/utils/cn.ts +11 -11
@@ -1,3 +1,3 @@
1
- export const HelloWorld = () => {
2
- return <div className="bg-red-800 text-white p-2">Hello world</div>;
3
- };
1
+ export const HelloWorld = () => {
2
+ return <div className="bg-red-800 text-white p-2">Hello world</div>;
3
+ };
@@ -1,96 +1,96 @@
1
- import { IconButton, Tooltip } from "@material-tailwind/react";
2
- import { useState, type KeyboardEvent, type ReactNode } from "react";
3
- import TextareaAutosize from "react-textarea-autosize";
4
- import { cn } from "../utils/cn";
5
- import SendArrowIcon from "./icons/SendArrowIcon";
6
- import SendArrowIconGreen from "./icons/SendArrowIconGreen";
7
-
8
- interface SubmitButtonProps extends React.ComponentProps<typeof IconButton> {
9
- tooltipContent?: string;
10
- className?: string;
11
- }
12
-
13
- export const SubmitButton: React.FC<SubmitButtonProps> = ({
14
- tooltipContent = "Send message",
15
- className,
16
- ...props
17
- }) => {
18
- const [hover, setHover] = useState(false);
19
-
20
- return (
21
- <Tooltip content={tooltipContent}>
22
- <IconButton
23
- variant="text"
24
- color="gray"
25
- className={cn(className, "hover:rounded-lg hover:bg-gray-100")}
26
- type="submit"
27
- onMouseEnter={() => setHover(true)}
28
- onMouseLeave={() => setHover(false)}
29
- {...props}
30
- >
31
- {hover ? (
32
- <SendArrowIconGreen className="size-6 " />
33
- ) : (
34
- <SendArrowIcon className="size-6 " />
35
- )}
36
- </IconButton>
37
- </Tooltip>
38
- );
39
- };
40
-
41
- interface TextareaProps extends React.ComponentProps<typeof TextareaAutosize> {
42
- onSubmit?: () => void;
43
- }
44
-
45
- export const Textarea: React.FC<TextareaProps> = ({
46
- onSubmit = () => {},
47
- ...props
48
- }) => {
49
- return (
50
- <TextareaAutosize
51
- autoFocus
52
- placeholder="Write your message here"
53
- className="pl-1 block w-full focus:outline-none max-h-32 resize-none placeholder:text-gray-400"
54
- onKeyDown={(e: KeyboardEvent<HTMLTextAreaElement>) => {
55
- if (e.key === "Enter" && !e.shiftKey) {
56
- e.preventDefault();
57
- onSubmit();
58
- }
59
- }}
60
- {...props}
61
- />
62
- );
63
- };
64
-
65
- interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
66
- bottom?: ReactNode;
67
- right?: ReactNode;
68
- top?: ReactNode;
69
- textArea?: ReactNode;
70
- }
71
-
72
- export const Container: React.FC<ContainerProps> = ({
73
- bottom,
74
- right,
75
- top,
76
- textArea = <Textarea />,
77
- ...props
78
- }) => {
79
- return (
80
- <div
81
- className="border gap-2 rounded-lg bg-white shadow-[0px_2px_2px_0px_#0000000A,0px_8px_8px_-8px_#0000000A] border-gray-100"
82
- {...props}
83
- >
84
- {top}
85
-
86
- <div className="flex gap-2 p-4 rounded-lg bg-white">
87
- <div className="grow flex flex-col items-start justify-center">
88
- {textArea}
89
- {bottom}
90
- </div>
91
-
92
- <div className="shrink flex items-end justify-end">{right}</div>
93
- </div>
94
- </div>
95
- );
96
- };
1
+ import { IconButton, Tooltip } from "@material-tailwind/react";
2
+ import { useState, type KeyboardEvent, type ReactNode } from "react";
3
+ import TextareaAutosize from "react-textarea-autosize";
4
+ import { cn } from "../utils/cn";
5
+ import SendArrowIcon from "./icons/SendArrowIcon";
6
+ import SendArrowIconGreen from "./icons/SendArrowIconGreen";
7
+
8
+ interface SubmitButtonProps extends React.ComponentProps<typeof IconButton> {
9
+ tooltipContent?: string;
10
+ className?: string;
11
+ }
12
+
13
+ export const SubmitButton: React.FC<SubmitButtonProps> = ({
14
+ tooltipContent = "Send message",
15
+ className,
16
+ ...props
17
+ }) => {
18
+ const [hover, setHover] = useState(false);
19
+
20
+ return (
21
+ <Tooltip content={tooltipContent}>
22
+ <IconButton
23
+ variant="text"
24
+ color="gray"
25
+ className={cn(className, "hover:rounded-lg hover:bg-gray-100")}
26
+ type="submit"
27
+ onMouseEnter={() => setHover(true)}
28
+ onMouseLeave={() => setHover(false)}
29
+ {...props}
30
+ >
31
+ {hover ? (
32
+ <SendArrowIconGreen className="size-6 " />
33
+ ) : (
34
+ <SendArrowIcon className="size-6 " />
35
+ )}
36
+ </IconButton>
37
+ </Tooltip>
38
+ );
39
+ };
40
+
41
+ interface TextareaProps extends React.ComponentProps<typeof TextareaAutosize> {
42
+ onSubmit?: () => void;
43
+ }
44
+
45
+ export const Textarea: React.FC<TextareaProps> = ({
46
+ onSubmit = () => {},
47
+ ...props
48
+ }) => {
49
+ return (
50
+ <TextareaAutosize
51
+ autoFocus
52
+ placeholder="Write your message here"
53
+ className="pl-1 block w-full focus:outline-none max-h-32 resize-none placeholder:text-gray-400"
54
+ onKeyDown={(e: KeyboardEvent<HTMLTextAreaElement>) => {
55
+ if (e.key === "Enter" && !e.shiftKey) {
56
+ e.preventDefault();
57
+ onSubmit();
58
+ }
59
+ }}
60
+ {...props}
61
+ />
62
+ );
63
+ };
64
+
65
+ interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
66
+ bottom?: ReactNode;
67
+ right?: ReactNode;
68
+ top?: ReactNode;
69
+ textArea?: ReactNode;
70
+ }
71
+
72
+ export const Container: React.FC<ContainerProps> = ({
73
+ bottom,
74
+ right,
75
+ top,
76
+ textArea = <Textarea />,
77
+ ...props
78
+ }) => {
79
+ return (
80
+ <div
81
+ className="border gap-2 rounded-lg bg-white shadow-[0px_2px_2px_0px_#0000000A,0px_8px_8px_-8px_#0000000A] border-gray-100"
82
+ {...props}
83
+ >
84
+ {top}
85
+
86
+ <div className="flex gap-2 p-4 rounded-lg bg-white">
87
+ <div className="grow flex flex-col items-start justify-center">
88
+ {textArea}
89
+ {bottom}
90
+ </div>
91
+
92
+ <div className="shrink flex items-end justify-end">{right}</div>
93
+ </div>
94
+ </div>
95
+ );
96
+ };
@@ -1,49 +1,49 @@
1
- import { IconButton } from "@material-tailwind/react";
2
- import XIcon from "./icons/XIcon";
3
- import { PropsWithChildren } from "react";
4
-
5
- interface HeaderProps {
6
- onClose: () => void;
7
- right?: React.ReactNode;
8
- }
9
-
10
- const Header = ({
11
- onClose,
12
- right,
13
- children,
14
- }: PropsWithChildren<HeaderProps>) => {
15
- return (
16
- <div className="bg-gray-50 flex gap-2 items-center px-2 py-3 rounded-t-xl">
17
- <div className="grow text-subheader-em">{children}</div>
18
- <div className="flex items-center gap-4">
19
- {right}
20
- <IconButton
21
- variant="text"
22
- size="sm"
23
- color="gray"
24
- className="rounded-full"
25
- onClick={onClose}
26
- >
27
- <XIcon className="size-4 text-gray-600" />
28
- </IconButton>
29
- </div>
30
- </div>
31
- );
32
- };
33
-
34
- interface BodyProps {
35
- className?: string;
36
- }
37
-
38
- const Body = ({ children, className = "" }: PropsWithChildren<BodyProps>) => {
39
- return (
40
- <div className={`w-full overflow-auto ${className}`}>
41
- {children}
42
- </div>
43
- );
44
- };
45
-
46
- export const ModalPanel = {
47
- Header,
48
- Body,
49
- };
1
+ import { IconButton } from "@material-tailwind/react";
2
+ import XIcon from "./icons/XIcon";
3
+ import { PropsWithChildren } from "react";
4
+
5
+ interface HeaderProps {
6
+ onClose: () => void;
7
+ right?: React.ReactNode;
8
+ }
9
+
10
+ const Header = ({
11
+ onClose,
12
+ right,
13
+ children,
14
+ }: PropsWithChildren<HeaderProps>) => {
15
+ return (
16
+ <div className="bg-gray-50 flex gap-2 items-center px-2 py-3 rounded-t-xl">
17
+ <div className="grow text-subheader-em">{children}</div>
18
+ <div className="flex items-center gap-4">
19
+ {right}
20
+ <IconButton
21
+ variant="text"
22
+ size="sm"
23
+ color="gray"
24
+ className="rounded-full"
25
+ onClick={onClose}
26
+ >
27
+ <XIcon className="size-4 text-gray-600" />
28
+ </IconButton>
29
+ </div>
30
+ </div>
31
+ );
32
+ };
33
+
34
+ interface BodyProps {
35
+ className?: string;
36
+ }
37
+
38
+ const Body = ({ children, className = "" }: PropsWithChildren<BodyProps>) => {
39
+ return (
40
+ <div className={`w-full overflow-auto ${className}`}>
41
+ {children}
42
+ </div>
43
+ );
44
+ };
45
+
46
+ export const ModalPanel = {
47
+ Header,
48
+ Body,
49
+ };