@freightos/freightwind 1.0.0 → 1.1.0

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 (210) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +28 -0
  3. package/dist/cjs/components/alert.js +33 -16
  4. package/dist/cjs/components/avatar.js +53 -58
  5. package/dist/cjs/components/badge.js +42 -18
  6. package/dist/cjs/components/button.js +35 -24
  7. package/dist/cjs/components/checkbox.js +21 -3
  8. package/dist/cjs/components/chip.js +67 -9
  9. package/dist/cjs/components/message.js +38 -0
  10. package/dist/cjs/components/pop-confirm.js +86 -0
  11. package/dist/cjs/components/radio-button-group.js +31 -35
  12. package/dist/cjs/components/radio-group.js +2 -1
  13. package/dist/cjs/components/slider.js +14 -6
  14. package/dist/cjs/components/switch.js +29 -10
  15. package/dist/cjs/components/tooltip.js +40 -11
  16. package/dist/cjs/index.js +38 -84
  17. package/dist/cjs/lib/icon-utils.js +5 -0
  18. package/dist/cjs/{components/aspect-ratio.js → lib/use-stable-id.js} +7 -4
  19. package/dist/cjs/lib/utils.js +18 -1
  20. package/dist/esm/components/alert.js +34 -17
  21. package/dist/esm/components/avatar.js +53 -22
  22. package/dist/esm/components/badge.js +45 -19
  23. package/dist/esm/components/button.js +36 -25
  24. package/dist/esm/components/checkbox.js +22 -4
  25. package/dist/esm/components/chip.js +34 -9
  26. package/dist/esm/components/message.js +34 -0
  27. package/dist/esm/components/pop-confirm.js +51 -0
  28. package/dist/esm/components/radio-button-group.js +31 -33
  29. package/dist/esm/components/radio-group.js +2 -1
  30. package/dist/esm/components/slider.js +14 -6
  31. package/dist/esm/components/switch.js +30 -11
  32. package/dist/esm/components/tooltip.js +40 -7
  33. package/dist/esm/index.js +18 -66
  34. package/dist/esm/lib/icon-utils.js +1 -0
  35. package/dist/esm/lib/use-stable-id.js +6 -0
  36. package/dist/esm/lib/utils.js +18 -1
  37. package/dist/types/components/alert.d.ts +5 -5
  38. package/dist/types/components/avatar.d.ts +14 -19
  39. package/dist/types/components/badge.d.ts +22 -8
  40. package/dist/types/components/button.d.ts +15 -9
  41. package/dist/types/components/checkbox.d.ts +8 -2
  42. package/dist/types/components/chip.d.ts +14 -8
  43. package/dist/types/components/message.d.ts +14 -0
  44. package/dist/types/components/pop-confirm.d.ts +28 -0
  45. package/dist/types/components/radio-button-group.d.ts +19 -14
  46. package/dist/types/components/slider.d.ts +10 -2
  47. package/dist/types/components/switch.d.ts +7 -6
  48. package/dist/types/components/tooltip.d.ts +9 -6
  49. package/dist/types/index.d.ts +25 -61
  50. package/dist/types/lib/icon-utils.d.ts +1 -0
  51. package/dist/types/lib/use-stable-id.d.ts +1 -0
  52. package/package.json +62 -54
  53. package/tokens.css +387 -0
  54. package/dist/cjs/components/accordion.js +0 -57
  55. package/dist/cjs/components/breadcrumb.js +0 -65
  56. package/dist/cjs/components/calendar.js +0 -106
  57. package/dist/cjs/components/card.js +0 -59
  58. package/dist/cjs/components/chart.js +0 -176
  59. package/dist/cjs/components/collapsible.js +0 -43
  60. package/dist/cjs/components/command.js +0 -73
  61. package/dist/cjs/components/context-menu.js +0 -83
  62. package/dist/cjs/components/country-select.js +0 -155
  63. package/dist/cjs/components/date-picker.js +0 -59
  64. package/dist/cjs/components/date-range-picker.js +0 -59
  65. package/dist/cjs/components/date-time-picker.js +0 -106
  66. package/dist/cjs/components/dialog.js +0 -70
  67. package/dist/cjs/components/drawer.js +0 -68
  68. package/dist/cjs/components/dropdown-menu.js +0 -85
  69. package/dist/cjs/components/empty.js +0 -42
  70. package/dist/cjs/components/file-preview.js +0 -73
  71. package/dist/cjs/components/form.js +0 -106
  72. package/dist/cjs/components/inline-edit.js +0 -83
  73. package/dist/cjs/components/input-group.js +0 -70
  74. package/dist/cjs/components/input-otp.js +0 -58
  75. package/dist/cjs/components/input.js +0 -57
  76. package/dist/cjs/components/label.js +0 -45
  77. package/dist/cjs/components/menubar.js +0 -96
  78. package/dist/cjs/components/navigation-menu.js +0 -68
  79. package/dist/cjs/components/pagination.js +0 -65
  80. package/dist/cjs/components/phone-input.js +0 -218
  81. package/dist/cjs/components/popover.js +0 -49
  82. package/dist/cjs/components/progress.js +0 -43
  83. package/dist/cjs/components/resizable.js +0 -47
  84. package/dist/cjs/components/rich-text-editor.js +0 -152
  85. package/dist/cjs/components/route.js +0 -47
  86. package/dist/cjs/components/scroll-area.js +0 -48
  87. package/dist/cjs/components/select.js +0 -71
  88. package/dist/cjs/components/separator.js +0 -43
  89. package/dist/cjs/components/sheet.js +0 -245
  90. package/dist/cjs/components/skeleton.js +0 -8
  91. package/dist/cjs/components/sonner.js +0 -25
  92. package/dist/cjs/components/spinner.js +0 -25
  93. package/dist/cjs/components/stepper.js +0 -99
  94. package/dist/cjs/components/steps.js +0 -127
  95. package/dist/cjs/components/table.js +0 -66
  96. package/dist/cjs/components/tabs.js +0 -51
  97. package/dist/cjs/components/textarea.js +0 -44
  98. package/dist/cjs/components/time-picker.js +0 -110
  99. package/dist/cjs/components/toast.js +0 -75
  100. package/dist/cjs/components/toaster.js +0 -12
  101. package/dist/cjs/components/toggle-group.js +0 -58
  102. package/dist/cjs/components/toggle.js +0 -62
  103. package/dist/cjs/hooks/use-toast.js +0 -166
  104. package/dist/cjs/lib/countryUtils.js +0 -93
  105. package/dist/esm/components/accordion.js +0 -18
  106. package/dist/esm/components/aspect-ratio.js +0 -3
  107. package/dist/esm/components/breadcrumb.js +0 -23
  108. package/dist/esm/components/calendar.js +0 -70
  109. package/dist/esm/components/card.js +0 -18
  110. package/dist/esm/components/chart.js +0 -135
  111. package/dist/esm/components/collapsible.js +0 -5
  112. package/dist/esm/components/command.js +0 -29
  113. package/dist/esm/components/context-menu.js +0 -33
  114. package/dist/esm/components/country-select.js +0 -118
  115. package/dist/esm/components/date-picker.js +0 -23
  116. package/dist/esm/components/date-range-picker.js +0 -23
  117. package/dist/esm/components/date-time-picker.js +0 -70
  118. package/dist/esm/components/dialog.js +0 -24
  119. package/dist/esm/components/drawer.js +0 -23
  120. package/dist/esm/components/dropdown-menu.js +0 -35
  121. package/dist/esm/components/empty.js +0 -6
  122. package/dist/esm/components/file-preview.js +0 -69
  123. package/dist/esm/components/form.js +0 -63
  124. package/dist/esm/components/inline-edit.js +0 -47
  125. package/dist/esm/components/input-group.js +0 -63
  126. package/dist/esm/components/input-otp.js +0 -19
  127. package/dist/esm/components/input.js +0 -21
  128. package/dist/esm/components/label.js +0 -9
  129. package/dist/esm/components/menubar.js +0 -45
  130. package/dist/esm/components/navigation-menu.js +0 -24
  131. package/dist/esm/components/pagination.js +0 -23
  132. package/dist/esm/components/phone-input.js +0 -181
  133. package/dist/esm/components/popover.js +0 -10
  134. package/dist/esm/components/progress.js +0 -7
  135. package/dist/esm/components/resizable.js +0 -9
  136. package/dist/esm/components/rich-text-editor.js +0 -145
  137. package/dist/esm/components/route.js +0 -11
  138. package/dist/esm/components/scroll-area.js +0 -11
  139. package/dist/esm/components/select.js +0 -26
  140. package/dist/esm/components/separator.js +0 -7
  141. package/dist/esm/components/sheet.js +0 -197
  142. package/dist/esm/components/skeleton.js +0 -6
  143. package/dist/esm/components/sonner.js +0 -22
  144. package/dist/esm/components/spinner.js +0 -21
  145. package/dist/esm/components/stepper.js +0 -57
  146. package/dist/esm/components/steps.js +0 -80
  147. package/dist/esm/components/table.js +0 -22
  148. package/dist/esm/components/tabs.js +0 -12
  149. package/dist/esm/components/textarea.js +0 -8
  150. package/dist/esm/components/time-picker.js +0 -74
  151. package/dist/esm/components/toast.js +0 -33
  152. package/dist/esm/components/toaster.js +0 -9
  153. package/dist/esm/components/toggle-group.js +0 -21
  154. package/dist/esm/components/toggle.js +0 -25
  155. package/dist/esm/hooks/use-toast.js +0 -128
  156. package/dist/esm/lib/countryUtils.js +0 -87
  157. package/dist/styles.css +0 -152
  158. package/dist/types/components/accordion.d.ts +0 -11
  159. package/dist/types/components/aspect-ratio.d.ts +0 -3
  160. package/dist/types/components/breadcrumb.d.ts +0 -19
  161. package/dist/types/components/calendar.d.ts +0 -7
  162. package/dist/types/components/card.d.ts +0 -11
  163. package/dist/types/components/chart.d.ts +0 -66
  164. package/dist/types/components/collapsible.d.ts +0 -5
  165. package/dist/types/components/command.d.ts +0 -80
  166. package/dist/types/components/context-menu.d.ts +0 -27
  167. package/dist/types/components/country-select.d.ts +0 -17
  168. package/dist/types/components/date-picker.d.ts +0 -9
  169. package/dist/types/components/date-range-picker.d.ts +0 -10
  170. package/dist/types/components/date-time-picker.d.ts +0 -10
  171. package/dist/types/components/dialog.d.ts +0 -23
  172. package/dist/types/components/drawer.d.ts +0 -22
  173. package/dist/types/components/dropdown-menu.d.ts +0 -27
  174. package/dist/types/components/empty.d.ts +0 -6
  175. package/dist/types/components/file-preview.d.ts +0 -9
  176. package/dist/types/components/form.d.ts +0 -23
  177. package/dist/types/components/inline-edit.d.ts +0 -10
  178. package/dist/types/components/input-group.d.ts +0 -16
  179. package/dist/types/components/input-otp.d.ts +0 -34
  180. package/dist/types/components/input.d.ts +0 -9
  181. package/dist/types/components/label.d.ts +0 -5
  182. package/dist/types/components/menubar.d.ts +0 -28
  183. package/dist/types/components/navigation-menu.d.ts +0 -12
  184. package/dist/types/components/pagination.d.ts +0 -29
  185. package/dist/types/components/phone-input.d.ts +0 -20
  186. package/dist/types/components/popover.d.ts +0 -9
  187. package/dist/types/components/progress.d.ts +0 -4
  188. package/dist/types/components/resizable.d.ts +0 -23
  189. package/dist/types/components/rich-text-editor.d.ts +0 -8
  190. package/dist/types/components/route.d.ts +0 -10
  191. package/dist/types/components/scroll-area.d.ts +0 -5
  192. package/dist/types/components/select.d.ts +0 -13
  193. package/dist/types/components/separator.d.ts +0 -4
  194. package/dist/types/components/sheet.d.ts +0 -49
  195. package/dist/types/components/skeleton.d.ts +0 -2
  196. package/dist/types/components/sonner.d.ts +0 -4
  197. package/dist/types/components/spinner.d.ts +0 -8
  198. package/dist/types/components/stepper.d.ts +0 -17
  199. package/dist/types/components/steps.d.ts +0 -64
  200. package/dist/types/components/table.d.ts +0 -14
  201. package/dist/types/components/tabs.d.ts +0 -7
  202. package/dist/types/components/textarea.d.ts +0 -3
  203. package/dist/types/components/time-picker.d.ts +0 -10
  204. package/dist/types/components/toast.d.ts +0 -15
  205. package/dist/types/components/toaster.d.ts +0 -1
  206. package/dist/types/components/toggle-group.d.ts +0 -12
  207. package/dist/types/components/toggle.d.ts +0 -12
  208. package/dist/types/hooks/use-toast.d.ts +0 -44
  209. package/dist/types/lib/countryUtils.d.ts +0 -20
  210. package/tailwind-preset.js +0 -70
@@ -1,25 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Toaster = void 0;
4
- const jsx_runtime_1 = require("react/jsx-runtime");
5
- const lucide_react_1 = require("lucide-react");
6
- const next_themes_1 = require("next-themes");
7
- const sonner_1 = require("sonner");
8
- const Toaster = ({ ...props }) => {
9
- const { theme = "system" } = (0, next_themes_1.useTheme)();
10
- return ((0, jsx_runtime_1.jsx)(sonner_1.Toaster, { theme: theme, className: "toaster group", icons: {
11
- success: (0, jsx_runtime_1.jsx)(lucide_react_1.CircleCheck, { className: "h-4 w-4" }),
12
- info: (0, jsx_runtime_1.jsx)(lucide_react_1.Info, { className: "h-4 w-4" }),
13
- warning: (0, jsx_runtime_1.jsx)(lucide_react_1.TriangleAlert, { className: "h-4 w-4" }),
14
- error: (0, jsx_runtime_1.jsx)(lucide_react_1.OctagonX, { className: "h-4 w-4" }),
15
- loading: (0, jsx_runtime_1.jsx)(lucide_react_1.LoaderCircle, { className: "h-4 w-4 animate-spin" }),
16
- }, toastOptions: {
17
- classNames: {
18
- toast: "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
19
- description: "group-[.toast]:text-muted-foreground",
20
- actionButton: "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
21
- cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
22
- },
23
- }, ...props }));
24
- };
25
- exports.Toaster = Toaster;
@@ -1,25 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.spinnerVariants = void 0;
4
- exports.Spinner = Spinner;
5
- const jsx_runtime_1 = require("react/jsx-runtime");
6
- const icons_1 = require("@freightos/icons");
7
- const utils_1 = require("../lib/utils");
8
- const class_variance_authority_1 = require("class-variance-authority");
9
- const spinnerVariants = (0, class_variance_authority_1.cva)('text-[var(--fds-color-primary-blue)] animate-spin inline-flex items-center justify-center align-middle', {
10
- variants: {
11
- size: {
12
- tiny: 'size-3', // 12px
13
- small: 'size-4', // 16px
14
- medium: 'size-6', // 24px
15
- large: 'size-8', // 32px
16
- },
17
- },
18
- defaultVariants: {
19
- size: 'medium',
20
- },
21
- });
22
- exports.spinnerVariants = spinnerVariants;
23
- function Spinner({ className, size, ...props }) {
24
- return ((0, jsx_runtime_1.jsx)("span", { role: "status", "aria-label": "Loading", className: (0, utils_1.cn)(spinnerVariants({ size, className })), ...props, children: (0, jsx_runtime_1.jsx)(icons_1.IconLoading, { className: "w-full h-full" }) }));
25
- }
@@ -1,99 +0,0 @@
1
- "use strict";
2
- 'use client';
3
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
4
- if (k2 === undefined) k2 = k;
5
- var desc = Object.getOwnPropertyDescriptor(m, k);
6
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
7
- desc = { enumerable: true, get: function() { return m[k]; } };
8
- }
9
- Object.defineProperty(o, k2, desc);
10
- }) : (function(o, m, k, k2) {
11
- if (k2 === undefined) k2 = k;
12
- o[k2] = m[k];
13
- }));
14
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
15
- Object.defineProperty(o, "default", { enumerable: true, value: v });
16
- }) : function(o, v) {
17
- o["default"] = v;
18
- });
19
- var __importStar = (this && this.__importStar) || (function () {
20
- var ownKeys = function(o) {
21
- ownKeys = Object.getOwnPropertyNames || function (o) {
22
- var ar = [];
23
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
24
- return ar;
25
- };
26
- return ownKeys(o);
27
- };
28
- return function (mod) {
29
- if (mod && mod.__esModule) return mod;
30
- var result = {};
31
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
32
- __setModuleDefault(result, mod);
33
- return result;
34
- };
35
- })();
36
- Object.defineProperty(exports, "__esModule", { value: true });
37
- exports.StepperSeparator = exports.StepperDescription = exports.StepperTitle = exports.StepperIndicator = exports.StepperTrigger = exports.StepperItem = exports.Stepper = void 0;
38
- const jsx_runtime_1 = require("react/jsx-runtime");
39
- const React = __importStar(require("react"));
40
- const utils_1 = require("../lib/utils");
41
- const StepperContext = React.createContext(null);
42
- const useStepper = () => {
43
- const context = React.useContext(StepperContext);
44
- if (!context) {
45
- throw new Error("Stepper components must be used within a Stepper");
46
- }
47
- return context;
48
- };
49
- const Stepper = React.forwardRef(({ className, defaultValue = 1, value, orientation = "horizontal", children, ...props }, ref) => {
50
- const currentValue = value ?? defaultValue;
51
- return ((0, jsx_runtime_1.jsx)(StepperContext.Provider, { value: { value: currentValue, orientation }, children: (0, jsx_runtime_1.jsx)("div", { ref: ref, "data-orientation": orientation, className: (0, utils_1.cn)("group/stepper flex w-full", orientation === "horizontal" ? "flex-row items-start" : "flex-col", className), ...props, children: children }) }));
52
- });
53
- exports.Stepper = Stepper;
54
- Stepper.displayName = "Stepper";
55
- const StepperItemContext = React.createContext(null);
56
- const useStepperItem = () => {
57
- const context = React.useContext(StepperItemContext);
58
- if (!context) {
59
- throw new Error("StepperItem components must be used within a StepperItem");
60
- }
61
- return context;
62
- };
63
- const StepperItem = React.forwardRef(({ className, step, children, ...props }, ref) => {
64
- const { value } = useStepper();
65
- const isActive = step === value;
66
- const isCompleted = step < value;
67
- return ((0, jsx_runtime_1.jsx)(StepperItemContext.Provider, { value: { step, isActive, isCompleted }, children: (0, jsx_runtime_1.jsx)("div", { ref: ref, "data-state": isActive ? "active" : isCompleted ? "completed" : "inactive", className: (0, utils_1.cn)("relative flex items-center", className), ...props, children: children }) }));
68
- });
69
- exports.StepperItem = StepperItem;
70
- StepperItem.displayName = "StepperItem";
71
- const StepperTrigger = React.forwardRef(({ className, children, ...props }, ref) => {
72
- return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: (0, utils_1.cn)("flex items-center gap-2", className), ...props, children: children }));
73
- });
74
- exports.StepperTrigger = StepperTrigger;
75
- StepperTrigger.displayName = "StepperTrigger";
76
- const StepperIndicator = React.forwardRef(({ className, children, ...props }, ref) => {
77
- const { isActive, isCompleted, step } = useStepperItem();
78
- return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: (0, utils_1.cn)("flex shrink-0 items-center justify-center rounded-full text-fds-xs transition-colors relative z-10", "h-[18px] w-[18px] font-fds-extrabold", isCompleted && "bg-fds-blue-20 text-white", isActive && "bg-fds-blue-20 text-white border-[0.5px] border-white shadow-[0_0_0_2px] shadow-fds-blue-20", !isActive && !isCompleted && "bg-fds-gray-10 text-fds-gray-60", className), ...props, children: (isActive || isCompleted) && (children || step) }));
79
- });
80
- exports.StepperIndicator = StepperIndicator;
81
- StepperIndicator.displayName = "StepperIndicator";
82
- const StepperTitle = React.forwardRef(({ className, ...props }, ref) => {
83
- const { isActive, isCompleted } = useStepperItem();
84
- return ((0, jsx_runtime_1.jsx)("p", { ref: ref, className: (0, utils_1.cn)("!text-fds-xs transition-colors", isActive && "font-fds-semibold text-foreground", isCompleted && "font-fds-regular text-foreground", !isActive && !isCompleted && "text-fds-gray-50", className), ...props }));
85
- });
86
- exports.StepperTitle = StepperTitle;
87
- StepperTitle.displayName = "StepperTitle";
88
- const StepperDescription = React.forwardRef(({ className, ...props }, ref) => {
89
- return ((0, jsx_runtime_1.jsx)("p", { ref: ref, className: (0, utils_1.cn)("text-muted-foreground text-sm", className), ...props }));
90
- });
91
- exports.StepperDescription = StepperDescription;
92
- StepperDescription.displayName = "StepperDescription";
93
- const StepperSeparator = React.forwardRef(({ className, ...props }, ref) => {
94
- const { orientation } = useStepper();
95
- const { isCompleted } = useStepperItem();
96
- return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: (0, utils_1.cn)("shrink-0 transition-colors", isCompleted ? "bg-fds-blue-20" : "bg-fds-gray-10", orientation === "horizontal" ? "h-[2px] w-full" : "h-full w-[2px]", className), ...props }));
97
- });
98
- exports.StepperSeparator = StepperSeparator;
99
- StepperSeparator.displayName = "StepperSeparator";
@@ -1,127 +0,0 @@
1
- "use strict";
2
- 'use client';
3
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
4
- if (k2 === undefined) k2 = k;
5
- var desc = Object.getOwnPropertyDescriptor(m, k);
6
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
7
- desc = { enumerable: true, get: function() { return m[k]; } };
8
- }
9
- Object.defineProperty(o, k2, desc);
10
- }) : (function(o, m, k, k2) {
11
- if (k2 === undefined) k2 = k;
12
- o[k2] = m[k];
13
- }));
14
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
15
- Object.defineProperty(o, "default", { enumerable: true, value: v });
16
- }) : function(o, v) {
17
- o["default"] = v;
18
- });
19
- var __importStar = (this && this.__importStar) || (function () {
20
- var ownKeys = function(o) {
21
- ownKeys = Object.getOwnPropertyNames || function (o) {
22
- var ar = [];
23
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
24
- return ar;
25
- };
26
- return ownKeys(o);
27
- };
28
- return function (mod) {
29
- if (mod && mod.__esModule) return mod;
30
- var result = {};
31
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
32
- __setModuleDefault(result, mod);
33
- return result;
34
- };
35
- })();
36
- Object.defineProperty(exports, "__esModule", { value: true });
37
- exports.StepTitle = exports.StepSubGroup = exports.StepsContainer = exports.StepsAccordion = exports.Steps = exports.StepMeta = exports.stepIndicatorVariants = exports.StepIndicator = exports.StepGroup = exports.StepDescription = exports.StepContent = exports.Step = void 0;
38
- const jsx_runtime_1 = require("react/jsx-runtime");
39
- const utils_1 = require("../lib/utils");
40
- const icons_1 = require("@freightos/icons");
41
- const class_variance_authority_1 = require("class-variance-authority");
42
- const React = __importStar(require("react"));
43
- const StepGroupContext = React.createContext({
44
- isInsideGroup: false,
45
- });
46
- const StepsContainer = ({ children, className, }) => {
47
- return (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex flex-col', className), children: children });
48
- };
49
- exports.StepsContainer = StepsContainer;
50
- StepsContainer.displayName = 'StepsContainer';
51
- const StepGroup = ({ icon, title, children, className, showLineAbove = false, showLineBelow = false, lineAboveCompleted = false, lineBelowCompleted = false, defaultOpen = true, }) => {
52
- const [isOpen, setIsOpen] = React.useState(defaultOpen);
53
- const hasChildren = React.Children.count(children) > 0;
54
- return ((0, jsx_runtime_1.jsx)(StepGroupContext.Provider, { value: { isInsideGroup: true }, children: (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('flex flex-col', className), children: [showLineAbove && ((0, jsx_runtime_1.jsx)("div", { className: "relative flex h-4 gap-fds-md overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-4 flex-shrink-0 justify-center", children: (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-0 left-[7px] top-0 w-0 border-l-2', lineAboveCompleted
55
- ? 'border-fds-blue-20'
56
- : 'border-fds-gray-10') }) }) })), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex items-center gap-fds-md", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-4 flex-shrink-0 flex-col items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative z-10 flex h-6 w-6 items-center justify-center rounded-full bg-fds-blue-10 text-fds-gray-50 ring-4 ring-white dark:ring-transparent", children: icon }), hasChildren && isOpen && ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-[-8px] left-[7px] top-6 w-0 border-l-2', lineBelowCompleted
57
- ? 'border-fds-blue-20'
58
- : 'border-fds-gray-10') })), !isOpen && showLineBelow && ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-[-24px] left-[7px] top-6 w-0 border-l-2', lineBelowCompleted
59
- ? 'border-fds-blue-20'
60
- : 'border-fds-gray-10') }))] }), (0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: () => setIsOpen(!isOpen), className: "flex flex-1 items-center justify-between py-fds-xs", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-fds-h6 font-fds-bold", children: title }), hasChildren && ((0, jsx_runtime_1.jsx)(icons_1.IconCaretDown, { size: 18, className: (0, utils_1.cn)('text-fds-gray-50 transition-transform duration-200', isOpen && 'rotate-180') }))] })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('grid transition-[grid-template-rows] duration-300 ease-in-out', isOpen ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'), children: (0, jsx_runtime_1.jsx)("div", { className: "overflow-hidden", children: children }) })] }) }));
61
- };
62
- exports.StepGroup = StepGroup;
63
- StepGroup.displayName = 'StepGroup';
64
- const StepSubGroup = ({ children, label, className, lineColor = 'gray', }) => {
65
- const borderClass = lineColor === 'blue' ? 'border-fds-blue-20' : 'border-fds-gray-10';
66
- return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('relative', className), children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative flex gap-fds-md", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative w-4 flex-shrink-0", children: (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-0 left-[7px] top-0 w-0 border-l-2', borderClass) }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1 border-t border-dashed border-border" })] }), children, (0, jsx_runtime_1.jsxs)("div", { className: "relative flex gap-fds-md", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative w-4 flex-shrink-0", children: (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-0 left-[7px] top-0 w-0 border-l-2', borderClass) }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1 border-t border-dashed border-border" })] }), label && ((0, jsx_runtime_1.jsx)("div", { className: "absolute right-0 top-1/2 -translate-y-1/2", children: label }))] }));
67
- };
68
- exports.StepSubGroup = StepSubGroup;
69
- StepSubGroup.displayName = 'StepSubGroup';
70
- /* -----------------------------------------------------------------------------
71
- * Step - Individual step item
72
- * -------------------------------------------------------------------------- */
73
- const stepIndicatorVariants = (0, class_variance_authority_1.cva)('flex items-center justify-center rounded-full', {
74
- variants: {
75
- status: {
76
- completed: 'h-[16px] w-[16px] bg-fds-blue text-white',
77
- active: 'h-[16px] w-[16px] border-2 border-fds-blue bg-white dark:bg-transparent',
78
- pending: 'h-[16px] w-[16px] border-2 border-dashed border-fds-gray-30 bg-white dark:bg-transparent',
79
- },
80
- },
81
- defaultVariants: {
82
- status: 'pending',
83
- },
84
- });
85
- exports.stepIndicatorVariants = stepIndicatorVariants;
86
- const Step = ({ status = 'pending', showLine = true, progressReached = false, nextStepCompleted = false, children, className, meta, }) => {
87
- const isCompleted = status === 'completed';
88
- const { isInsideGroup } = React.useContext(StepGroupContext);
89
- // Visual status: show as completed if progress has reached this step
90
- const visuallyCompleted = isCompleted || progressReached;
91
- const visualStatus = visuallyCompleted ? 'completed' : status;
92
- // Line colors: blue if progress has reached this step or beyond
93
- const lineAboveColor = visuallyCompleted
94
- ? 'border-fds-blue-20'
95
- : 'border-fds-gray-10';
96
- const lineBelowColor = nextStepCompleted
97
- ? 'border-fds-blue-20'
98
- : 'border-fds-gray-10';
99
- return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('flex flex-col', className), children: [isInsideGroup && ((0, jsx_runtime_1.jsxs)("div", { className: "relative flex h-3 gap-fds-md", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-0 left-[7px] top-0 w-0 border-l-2', lineAboveColor) }), (0, jsx_runtime_1.jsx)("div", { className: "w-4 flex-shrink-0" }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1" })] })), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex items-center gap-fds-md", children: [isInsideGroup && ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-1/2 left-[7px] top-0 w-0 border-l-2', lineAboveColor) })), showLine && ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-0 left-[7px] top-1/2 w-0 border-l-2', lineBelowColor) })), (0, jsx_runtime_1.jsx)("div", { className: "relative z-10 flex w-4 flex-shrink-0 justify-center bg-white py-2 dark:bg-transparent", children: visualStatus === 'pending' ? ((0, jsx_runtime_1.jsx)("div", { className: "h-[11px] w-[11px] rounded-full border-[1.5px] border-dashed border-fds-gray-30 bg-card" })) : ((0, jsx_runtime_1.jsx)("div", { className: stepIndicatorVariants({ status: visualStatus }), children: visuallyCompleted && (0, jsx_runtime_1.jsx)(icons_1.IconCheck, { size: 10 }) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 justify-between", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex-1", children: children }), meta && (0, jsx_runtime_1.jsx)("div", { className: "ml-fds-sm", children: meta })] })] }), showLine && ((0, jsx_runtime_1.jsxs)("div", { className: "relative flex gap-fds-md pb-1", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('absolute bottom-0 left-[7px] top-0 w-0 border-l-2', lineBelowColor) }), (0, jsx_runtime_1.jsx)("div", { className: "w-4 flex-shrink-0" }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1" })] }))] }));
100
- };
101
- exports.Step = Step;
102
- Step.displayName = 'Step';
103
- const StepTitle = ({ children, className }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('font-fds-semibold', className), children: children }));
104
- exports.StepTitle = StepTitle;
105
- StepTitle.displayName = 'StepTitle';
106
- const StepDescription = ({ location, estimatedDate, actualDate, children, className, }) => {
107
- if (children) {
108
- return (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('', className), children: children });
109
- }
110
- return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('flex items-center gap-fds-xs', className), children: [location && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "font-fds-semibold", children: location }), (0, jsx_runtime_1.jsx)("span", { className: "h-[4px] w-[4px] rounded-full bg-fds-gray-20" })] })), actualDate ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [estimatedDate && ((0, jsx_runtime_1.jsx)("span", { className: "line-through", children: estimatedDate })), (0, jsx_runtime_1.jsx)("span", { className: "text-fds-red", children: actualDate })] })) : estimatedDate ? ((0, jsx_runtime_1.jsx)("span", { children: estimatedDate })) : ((0, jsx_runtime_1.jsx)("span", { children: "TBD" }))] }));
111
- };
112
- exports.StepDescription = StepDescription;
113
- StepDescription.displayName = 'StepDescription';
114
- const StepMeta = ({ children, className }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex items-center gap-fds-xs font-fds-semibold text-fds-gray-60', className), children: children }));
115
- exports.StepMeta = StepMeta;
116
- StepMeta.displayName = 'StepMeta';
117
- /* -----------------------------------------------------------------------------
118
- * Legacy exports for compatibility
119
- * -------------------------------------------------------------------------- */
120
- const Steps = StepsContainer;
121
- exports.Steps = Steps;
122
- const StepsAccordion = StepsContainer;
123
- exports.StepsAccordion = StepsAccordion;
124
- const StepIndicator = () => null; // No longer needed - indicator is built into Step
125
- exports.StepIndicator = StepIndicator;
126
- const StepContent = ({ children, className }) => (0, jsx_runtime_1.jsx)("div", { className: className, children: children });
127
- exports.StepContent = StepContent;
@@ -1,66 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.TableRow = exports.TableHeader = exports.TableHead = exports.TableFooter = exports.TableEmpty = exports.TableCell = exports.TableCaption = exports.TableBody = exports.Table = void 0;
37
- const jsx_runtime_1 = require("react/jsx-runtime");
38
- const React = __importStar(require("react"));
39
- const utils_1 = require("../lib/utils");
40
- const Table = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("div", { className: "relative w-full overflow-auto", children: (0, jsx_runtime_1.jsx)("table", { ref: ref, className: (0, utils_1.cn)('w-full caption-bottom text-sm', className), ...props }) })));
41
- exports.Table = Table;
42
- Table.displayName = 'Table';
43
- const TableHeader = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("thead", { ref: ref, className: (0, utils_1.cn)('[&_tr]:border-b [&_tr]:border-fds-gray-20', className), ...props })));
44
- exports.TableHeader = TableHeader;
45
- TableHeader.displayName = 'TableHeader';
46
- const TableBody = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("tbody", { ref: ref, className: (0, utils_1.cn)('[&_tr:last-child]:border-0', className), ...props })));
47
- exports.TableBody = TableBody;
48
- TableBody.displayName = 'TableBody';
49
- const TableFooter = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("tfoot", { ref: ref, className: (0, utils_1.cn)('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className), ...props })));
50
- exports.TableFooter = TableFooter;
51
- TableFooter.displayName = 'TableFooter';
52
- const TableRow = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("tr", { ref: ref, className: (0, utils_1.cn)('border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted', className), ...props })));
53
- exports.TableRow = TableRow;
54
- TableRow.displayName = 'TableRow';
55
- const TableHead = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("th", { ref: ref, className: (0, utils_1.cn)('px-fds-md text-left align-middle font-fds-semibold text-foreground [&:has([role=checkbox])]:pr-0', className), ...props })));
56
- exports.TableHead = TableHead;
57
- TableHead.displayName = 'TableHead';
58
- const TableCell = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("td", { ref: ref, className: (0, utils_1.cn)('px-4 align-middle [&:has([role=checkbox])]:pr-0', className), ...props })));
59
- exports.TableCell = TableCell;
60
- TableCell.displayName = 'TableCell';
61
- const TableCaption = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("caption", { ref: ref, className: (0, utils_1.cn)('mt-4 text-sm text-muted-foreground', className), ...props })));
62
- exports.TableCaption = TableCaption;
63
- TableCaption.displayName = 'TableCaption';
64
- const TableEmpty = React.forwardRef(({ className, colSpan, message = 'No data', ...props }, ref) => ((0, jsx_runtime_1.jsx)("tr", { ref: ref, className: className, ...props, children: (0, jsx_runtime_1.jsx)("td", { colSpan: colSpan, className: "text-center", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center justify-center py-fds-xxl", children: [(0, jsx_runtime_1.jsx)("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsxs)("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [(0, jsx_runtime_1.jsx)("ellipse", { className: "fill-fds-gray-10 dark:fill-fds-gray-80", cx: "32", cy: "33", rx: "32", ry: "7" }), (0, jsx_runtime_1.jsxs)("g", { fillRule: "nonzero", className: "stroke-fds-gray-30 dark:stroke-fds-gray-60", children: [(0, jsx_runtime_1.jsx)("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }), (0, jsx_runtime_1.jsx)("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", className: "fill-fds-gray-5 dark:fill-fds-gray-90" })] })] }) }), (0, jsx_runtime_1.jsx)("span", { className: "mt-fds-sm text-fds-sm text-fds-gray-50", children: message })] }) }) })));
65
- exports.TableEmpty = TableEmpty;
66
- TableEmpty.displayName = 'TableEmpty';
@@ -1,51 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.TabsContent = exports.TabsTrigger = exports.TabsList = exports.Tabs = void 0;
37
- const jsx_runtime_1 = require("react/jsx-runtime");
38
- const React = __importStar(require("react"));
39
- const TabsPrimitive = __importStar(require("@radix-ui/react-tabs"));
40
- const utils_1 = require("../lib/utils");
41
- const Tabs = TabsPrimitive.Root;
42
- exports.Tabs = Tabs;
43
- const TabsList = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(TabsPrimitive.List, { ref: ref, className: (0, utils_1.cn)('inline-flex h-auto w-full items-center justify-start overflow-x-auto border-b border-fds-gray-20 dark:border-fds-gray-80', className), ...props })));
44
- exports.TabsList = TabsList;
45
- TabsList.displayName = TabsPrimitive.List.displayName;
46
- const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(TabsPrimitive.Trigger, { ref: ref, className: (0, utils_1.cn)('inline-flex items-center justify-center whitespace-nowrap border-b-2 border-transparent px-fds-lg py-fds-xs text-[16px] text-foreground transition-all focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50', 'hover:text-fds-gray-80 dark:hover:text-fds-gray-20', 'data-[state=active]:border-fds-blue data-[state=active]:text-fds-blue', 'dark:data-[state=active]:border-fds-blue-20 dark:data-[state=active]:text-fds-blue-20', className), ...props })));
47
- exports.TabsTrigger = TabsTrigger;
48
- TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
49
- const TabsContent = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(TabsPrimitive.Content, { ref: ref, className: (0, utils_1.cn)('mt-fds-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fds-blue focus-visible:ring-offset-2', className), ...props })));
50
- exports.TabsContent = TabsContent;
51
- TabsContent.displayName = TabsPrimitive.Content.displayName;
@@ -1,44 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.Textarea = void 0;
37
- const jsx_runtime_1 = require("react/jsx-runtime");
38
- const React = __importStar(require("react"));
39
- const utils_1 = require("../lib/utils");
40
- const Textarea = React.forwardRef(({ className, ...props }, ref) => {
41
- return ((0, jsx_runtime_1.jsx)("textarea", { className: (0, utils_1.cn)("flex min-h-[80px] w-full rounded-md border border-input-border bg-input px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", className), ref: ref, ...props }));
42
- });
43
- exports.Textarea = Textarea;
44
- Textarea.displayName = "Textarea";
@@ -1,110 +0,0 @@
1
- "use strict";
2
- 'use client';
3
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
4
- if (k2 === undefined) k2 = k;
5
- var desc = Object.getOwnPropertyDescriptor(m, k);
6
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
7
- desc = { enumerable: true, get: function() { return m[k]; } };
8
- }
9
- Object.defineProperty(o, k2, desc);
10
- }) : (function(o, m, k, k2) {
11
- if (k2 === undefined) k2 = k;
12
- o[k2] = m[k];
13
- }));
14
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
15
- Object.defineProperty(o, "default", { enumerable: true, value: v });
16
- }) : function(o, v) {
17
- o["default"] = v;
18
- });
19
- var __importStar = (this && this.__importStar) || (function () {
20
- var ownKeys = function(o) {
21
- ownKeys = Object.getOwnPropertyNames || function (o) {
22
- var ar = [];
23
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
24
- return ar;
25
- };
26
- return ownKeys(o);
27
- };
28
- return function (mod) {
29
- if (mod && mod.__esModule) return mod;
30
- var result = {};
31
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
32
- __setModuleDefault(result, mod);
33
- return result;
34
- };
35
- })();
36
- Object.defineProperty(exports, "__esModule", { value: true });
37
- exports.TimePicker = TimePicker;
38
- const jsx_runtime_1 = require("react/jsx-runtime");
39
- const React = __importStar(require("react"));
40
- const icons_1 = require("@freightos/icons");
41
- const utils_1 = require("../lib/utils");
42
- const button_1 = require("./button");
43
- const popover_1 = require("./popover");
44
- const scroll_area_1 = require("./scroll-area");
45
- function TimePicker({ value, onChange, placeholder = 'Select time', disabled = false, className, use24Hour = true, }) {
46
- const [open, setOpen] = React.useState(false);
47
- const [isHovered, setIsHovered] = React.useState(false);
48
- const hours = use24Hour
49
- ? Array.from({ length: 24 }, (_, i) => i)
50
- : Array.from({ length: 12 }, (_, i) => i + 1);
51
- // Parse value to get hour and minute
52
- const parsedHour = value ? parseInt(value.split(':')[0], 10) : undefined;
53
- const parsedMinute = value ? parseInt(value.split(':')[1], 10) : undefined;
54
- const handleTimeChange = (type, val) => {
55
- const currentHour = parsedHour ?? 0;
56
- const currentMinute = parsedMinute ?? 0;
57
- let newHour = currentHour;
58
- let newMinute = currentMinute;
59
- if (type === 'hour') {
60
- if (use24Hour) {
61
- newHour = parseInt(val);
62
- }
63
- else {
64
- const isPM = currentHour >= 12;
65
- newHour = (parseInt(val) % 12) + (isPM ? 12 : 0);
66
- }
67
- }
68
- else if (type === 'minute') {
69
- newMinute = parseInt(val);
70
- }
71
- else if (type === 'ampm') {
72
- if (val === 'PM' && currentHour < 12) {
73
- newHour = currentHour + 12;
74
- }
75
- else if (val === 'AM' && currentHour >= 12) {
76
- newHour = currentHour - 12;
77
- }
78
- }
79
- const timeString = `${newHour.toString().padStart(2, '0')}:${newMinute.toString().padStart(2, '0')}`;
80
- onChange?.(timeString);
81
- };
82
- const handleClear = (e) => {
83
- e.stopPropagation();
84
- onChange?.(undefined);
85
- };
86
- const formatDisplayTime = (timeValue) => {
87
- if (!timeValue)
88
- return undefined;
89
- const [h, m] = timeValue.split(':').map(Number);
90
- if (use24Hour) {
91
- return `${h.toString().padStart(2, '0')}:${m.toString().padStart(2, '0')}`;
92
- }
93
- const hour12 = h % 12 || 12;
94
- const ampm = h >= 12 ? 'PM' : 'AM';
95
- return `${hour12}:${m.toString().padStart(2, '0')} ${ampm}`;
96
- };
97
- const showClearIcon = isHovered && value;
98
- return ((0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: open, onOpenChange: setOpen, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)("button", { type: "button", disabled: disabled, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), className: (0, utils_1.cn)('flex h-[32px] w-full items-center justify-between gap-2 rounded-fds-md border border-input-border bg-input py-2 pl-3 pr-2 text-sm transition-[color,box-shadow]', 'focus:outline-none focus:border-[#2075bd] focus:shadow-[0_0_0_2px_var(--fds-color-primary-blue-20)]', 'disabled:cursor-not-allowed disabled:opacity-50', open && 'border-[#2075bd] shadow-[0_0_0_2px_var(--fds-color-primary-blue-20)]', !value && 'text-muted-foreground', className), children: [(0, jsx_runtime_1.jsx)("span", { className: "truncate", children: value ? formatDisplayTime(value) : placeholder }), showClearIcon ? ((0, jsx_runtime_1.jsx)(icons_1.IconClearCircledSolid, { size: 16, className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground", onClick: handleClear })) : ((0, jsx_runtime_1.jsx)(icons_1.IconClock, { size: 16, className: "shrink-0 text-muted-foreground" }))] }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-auto p-0", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex divide-x sm:h-[300px]", children: [(0, jsx_runtime_1.jsxs)(scroll_area_1.ScrollArea, { className: "w-auto", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex flex-col p-2", children: hours.map((hour) => ((0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", htmlType: "button", type: parsedHour !== undefined &&
99
- (use24Hour
100
- ? parsedHour === hour
101
- : parsedHour % 12 === hour % 12)
102
- ? 'default'
103
- : 'text', className: "aspect-square shrink-0 sm:w-full", onClick: () => handleTimeChange('hour', hour.toString()), children: use24Hour ? hour.toString().padStart(2, '0') : hour }, hour))) }), (0, jsx_runtime_1.jsx)(scroll_area_1.ScrollBar, { orientation: "horizontal", className: "sm:hidden" })] }), (0, jsx_runtime_1.jsxs)(scroll_area_1.ScrollArea, { className: "w-auto", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex flex-col p-2", children: Array.from({ length: 12 }, (_, i) => i * 5).map((minute) => ((0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", htmlType: "button", type: parsedMinute !== undefined && parsedMinute === minute
104
- ? 'default'
105
- : 'text', className: "aspect-square shrink-0 sm:w-full", onClick: () => handleTimeChange('minute', minute.toString()), children: minute.toString().padStart(2, '0') }, minute))) }), (0, jsx_runtime_1.jsx)(scroll_area_1.ScrollBar, { orientation: "horizontal", className: "sm:hidden" })] }), !use24Hour && ((0, jsx_runtime_1.jsx)(scroll_area_1.ScrollArea, { className: "", children: (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col p-2", children: ['AM', 'PM'].map((ampm) => ((0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", htmlType: "button", type: parsedHour !== undefined &&
106
- ((ampm === 'AM' && parsedHour < 12) ||
107
- (ampm === 'PM' && parsedHour >= 12))
108
- ? 'default'
109
- : 'text', className: "aspect-square shrink-0 sm:w-full", onClick: () => handleTimeChange('ampm', ampm), children: ampm }, ampm))) }) }))] }) })] }));
110
- }