@next-degree/pickle-shared-js 0.5.31 → 0.6.44

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 (239) hide show
  1. package/dist/company_service_latest-DQ5joNqO.d.cts +4243 -0
  2. package/dist/company_service_latest-DQ5joNqO.d.ts +4243 -0
  3. package/dist/components/buttons/BackButton.cjs +161 -0
  4. package/dist/components/buttons/BackButton.cjs.map +1 -0
  5. package/dist/components/buttons/BackButton.d.cts +9 -0
  6. package/dist/components/buttons/BackButton.d.ts +9 -0
  7. package/dist/components/buttons/BackButton.js +137 -0
  8. package/dist/components/buttons/BackButton.js.map +1 -0
  9. package/dist/components/company/CompanyBenefits.cjs +38 -0
  10. package/dist/components/company/CompanyBenefits.cjs.map +1 -0
  11. package/dist/components/company/CompanyBenefits.d.cts +8 -0
  12. package/dist/components/company/CompanyBenefits.d.ts +8 -0
  13. package/dist/components/company/CompanyBenefits.js +13 -0
  14. package/dist/components/company/CompanyBenefits.js.map +1 -0
  15. package/dist/components/company/CompanyInformation.cjs +112 -0
  16. package/dist/components/company/CompanyInformation.cjs.map +1 -0
  17. package/dist/components/company/CompanyInformation.d.cts +12 -0
  18. package/dist/components/company/CompanyInformation.d.ts +12 -0
  19. package/dist/components/company/CompanyInformation.js +75 -0
  20. package/dist/components/company/CompanyInformation.js.map +1 -0
  21. package/dist/components/company/CompanyTake.cjs +140 -0
  22. package/dist/components/company/CompanyTake.cjs.map +1 -0
  23. package/dist/components/company/CompanyTake.d.cts +9 -0
  24. package/dist/components/company/CompanyTake.d.ts +9 -0
  25. package/dist/components/company/CompanyTake.js +104 -0
  26. package/dist/components/company/CompanyTake.js.map +1 -0
  27. package/dist/components/jobPost/JobDescription.cjs +205 -0
  28. package/dist/components/jobPost/JobDescription.cjs.map +1 -0
  29. package/dist/components/jobPost/JobDescription.d.cts +8 -0
  30. package/dist/components/jobPost/JobDescription.d.ts +8 -0
  31. package/dist/components/jobPost/JobDescription.js +168 -0
  32. package/dist/components/jobPost/JobDescription.js.map +1 -0
  33. package/dist/components/jobPost/JobHeader.cjs +436 -0
  34. package/dist/components/jobPost/JobHeader.cjs.map +1 -0
  35. package/dist/components/jobPost/JobHeader.d.cts +26 -0
  36. package/dist/components/jobPost/JobHeader.d.ts +26 -0
  37. package/dist/components/jobPost/JobHeader.js +423 -0
  38. package/dist/components/jobPost/JobHeader.js.map +1 -0
  39. package/dist/components/jobPost/JobPost.cjs +1371 -0
  40. package/dist/components/jobPost/JobPost.cjs.map +1 -0
  41. package/dist/components/jobPost/JobPost.d.cts +16 -0
  42. package/dist/components/jobPost/JobPost.d.ts +16 -0
  43. package/dist/components/jobPost/JobPost.js +1358 -0
  44. package/dist/components/jobPost/JobPost.js.map +1 -0
  45. package/dist/components/primitives/avatar.cjs +88 -0
  46. package/dist/components/primitives/avatar.cjs.map +1 -0
  47. package/dist/components/primitives/avatar.d.cts +13 -0
  48. package/dist/components/primitives/avatar.d.ts +13 -0
  49. package/dist/components/primitives/avatar.js +52 -0
  50. package/dist/components/primitives/avatar.js.map +1 -0
  51. package/dist/components/primitives/command.d.cts +3 -3
  52. package/dist/components/primitives/command.d.ts +3 -3
  53. package/dist/components/ui/Avatar.cjs +117 -0
  54. package/dist/components/ui/Avatar.cjs.map +1 -0
  55. package/dist/components/ui/Avatar.d.cts +16 -0
  56. package/dist/components/ui/Avatar.d.ts +16 -0
  57. package/dist/components/ui/Avatar.js +79 -0
  58. package/dist/components/ui/Avatar.js.map +1 -0
  59. package/dist/components/ui/Icon.cjs +114 -0
  60. package/dist/components/ui/Icon.cjs.map +1 -0
  61. package/dist/components/ui/Icon.d.cts +15 -0
  62. package/dist/components/ui/Icon.d.ts +15 -0
  63. package/dist/components/ui/Icon.js +89 -0
  64. package/dist/components/ui/Icon.js.map +1 -0
  65. package/dist/{app/layout.cjs → components/ui/LinkButton.cjs} +25 -35
  66. package/dist/components/ui/LinkButton.cjs.map +1 -0
  67. package/dist/components/ui/LinkButton.d.cts +29 -0
  68. package/dist/components/ui/LinkButton.d.ts +29 -0
  69. package/dist/components/ui/LinkButton.js +26 -0
  70. package/dist/components/ui/LinkButton.js.map +1 -0
  71. package/dist/components/ui/ReadMore.cjs +194 -0
  72. package/dist/components/ui/ReadMore.cjs.map +1 -0
  73. package/dist/components/ui/ReadMore.d.cts +9 -0
  74. package/dist/components/ui/ReadMore.d.ts +9 -0
  75. package/dist/components/ui/ReadMore.js +160 -0
  76. package/dist/components/ui/ReadMore.js.map +1 -0
  77. package/dist/contexts/WindowHistoryProvider.cjs +48 -0
  78. package/dist/contexts/WindowHistoryProvider.cjs.map +1 -0
  79. package/dist/contexts/WindowHistoryProvider.d.cts +11 -0
  80. package/dist/contexts/WindowHistoryProvider.d.ts +11 -0
  81. package/dist/contexts/WindowHistoryProvider.js +23 -0
  82. package/dist/contexts/WindowHistoryProvider.js.map +1 -0
  83. package/dist/displayText-BvUjsvAx.d.cts +48 -0
  84. package/dist/displayText-CDK-QDbc.d.ts +48 -0
  85. package/dist/hooks/useDisplayText.cjs +502 -0
  86. package/dist/hooks/useDisplayText.cjs.map +1 -0
  87. package/dist/hooks/useDisplayText.d.cts +8 -0
  88. package/dist/hooks/useDisplayText.d.ts +8 -0
  89. package/dist/hooks/useDisplayText.js +477 -0
  90. package/dist/hooks/useDisplayText.js.map +1 -0
  91. package/dist/hooks/useWindowHistory.cjs +46 -0
  92. package/dist/hooks/useWindowHistory.cjs.map +1 -0
  93. package/dist/hooks/useWindowHistory.d.cts +7 -0
  94. package/dist/hooks/useWindowHistory.d.ts +7 -0
  95. package/dist/hooks/useWindowHistory.js +21 -0
  96. package/dist/hooks/useWindowHistory.js.map +1 -0
  97. package/dist/index.cjs +1459 -2
  98. package/dist/index.cjs.map +1 -1
  99. package/dist/index.d.cts +21 -0
  100. package/dist/index.d.ts +21 -0
  101. package/dist/index.js +1468 -1
  102. package/dist/index.js.map +1 -1
  103. package/dist/job_posting_service_latest-Uc2AcDWn.d.cts +4109 -0
  104. package/dist/job_posting_service_latest-Uc2AcDWn.d.ts +4109 -0
  105. package/dist/lib/icons.cjs +53 -0
  106. package/dist/lib/icons.cjs.map +1 -0
  107. package/dist/lib/icons.d.cts +27 -0
  108. package/dist/lib/icons.d.ts +27 -0
  109. package/dist/lib/icons.js +49 -0
  110. package/dist/lib/icons.js.map +1 -0
  111. package/dist/lib/locations.cjs +45 -0
  112. package/dist/lib/locations.cjs.map +1 -0
  113. package/dist/lib/locations.d.cts +8 -0
  114. package/dist/lib/locations.d.ts +8 -0
  115. package/dist/lib/locations.js +19 -0
  116. package/dist/lib/locations.js.map +1 -0
  117. package/dist/lib/mappings.cjs +443 -0
  118. package/dist/lib/mappings.cjs.map +1 -0
  119. package/dist/lib/mappings.d.cts +4 -0
  120. package/dist/lib/mappings.d.ts +4 -0
  121. package/dist/lib/mappings.js +409 -0
  122. package/dist/lib/mappings.js.map +1 -0
  123. package/dist/lib/salaryRange.cjs +111 -0
  124. package/dist/lib/salaryRange.cjs.map +1 -0
  125. package/dist/lib/salaryRange.d.cts +6 -0
  126. package/dist/lib/salaryRange.d.ts +6 -0
  127. package/dist/lib/salaryRange.js +84 -0
  128. package/dist/lib/salaryRange.js.map +1 -0
  129. package/dist/services/displayText.cjs +470 -0
  130. package/dist/services/displayText.cjs.map +1 -0
  131. package/dist/services/displayText.d.cts +4 -0
  132. package/dist/services/displayText.d.ts +4 -0
  133. package/dist/services/displayText.js +443 -0
  134. package/dist/services/displayText.js.map +1 -0
  135. package/dist/shared_pickle_output_latest-DUO_efBh.d.cts +334 -0
  136. package/dist/shared_pickle_output_latest-DUO_efBh.d.ts +334 -0
  137. package/dist/styles/globals.css +817 -0
  138. package/dist/styles/globals.css.map +1 -1
  139. package/dist/types/data/company_service_latest.cjs +249 -0
  140. package/dist/types/data/company_service_latest.cjs.map +1 -0
  141. package/dist/types/data/company_service_latest.d.cts +2 -0
  142. package/dist/types/data/company_service_latest.d.ts +2 -0
  143. package/dist/types/data/company_service_latest.js +208 -0
  144. package/dist/types/data/company_service_latest.js.map +1 -0
  145. package/dist/types/data/job_posting_service_latest.cjs +289 -0
  146. package/dist/types/data/job_posting_service_latest.cjs.map +1 -0
  147. package/dist/types/data/job_posting_service_latest.d.cts +2 -0
  148. package/dist/types/data/job_posting_service_latest.d.ts +2 -0
  149. package/dist/types/data/job_posting_service_latest.js +253 -0
  150. package/dist/types/data/job_posting_service_latest.js.map +1 -0
  151. package/dist/types/data/shared_pickle_output_latest.cjs +107 -0
  152. package/dist/types/data/shared_pickle_output_latest.cjs.map +1 -0
  153. package/dist/types/data/shared_pickle_output_latest.d.cts +2 -0
  154. package/dist/types/data/shared_pickle_output_latest.d.ts +2 -0
  155. package/dist/types/data/shared_pickle_output_latest.js +73 -0
  156. package/dist/types/data/shared_pickle_output_latest.js.map +1 -0
  157. package/dist/types/displayText.errors.cjs +44 -0
  158. package/dist/types/displayText.errors.cjs.map +1 -0
  159. package/dist/types/displayText.errors.d.cts +8 -0
  160. package/dist/types/displayText.errors.d.ts +8 -0
  161. package/dist/types/displayText.errors.js +18 -0
  162. package/dist/types/displayText.errors.js.map +1 -0
  163. package/package.json +19 -7
  164. package/dist/AmbitBold-3SZZPYLH.otf +0 -0
  165. package/dist/AmbitBoldItalic-JSHFTN4A.otf +0 -0
  166. package/dist/AmbitRegular-MB5U7O3L.otf +0 -0
  167. package/dist/app/layout.cjs.map +0 -1
  168. package/dist/app/layout.css +0 -1423
  169. package/dist/app/layout.css.map +0 -1
  170. package/dist/app/layout.d.cts +0 -11
  171. package/dist/app/layout.d.ts +0 -11
  172. package/dist/app/layout.js +0 -36
  173. package/dist/app/layout.js.map +0 -1
  174. package/dist/app/page.cjs +0 -1607
  175. package/dist/app/page.cjs.map +0 -1
  176. package/dist/app/page.d.cts +0 -5
  177. package/dist/app/page.d.ts +0 -5
  178. package/dist/app/page.js +0 -1581
  179. package/dist/app/page.js.map +0 -1
  180. package/dist/assets/fonts/AmbitBold.cjs +0 -3
  181. package/dist/assets/fonts/AmbitBold.cjs.map +0 -1
  182. package/dist/assets/fonts/AmbitBold.d.cts +0 -2
  183. package/dist/assets/fonts/AmbitBold.d.ts +0 -2
  184. package/dist/assets/fonts/AmbitBold.js +0 -6
  185. package/dist/assets/fonts/AmbitBold.js.map +0 -1
  186. package/dist/assets/fonts/AmbitBoldItalic.cjs +0 -3
  187. package/dist/assets/fonts/AmbitBoldItalic.cjs.map +0 -1
  188. package/dist/assets/fonts/AmbitBoldItalic.d.cts +0 -2
  189. package/dist/assets/fonts/AmbitBoldItalic.d.ts +0 -2
  190. package/dist/assets/fonts/AmbitBoldItalic.js +0 -6
  191. package/dist/assets/fonts/AmbitBoldItalic.js.map +0 -1
  192. package/dist/assets/fonts/AmbitRegular.cjs +0 -3
  193. package/dist/assets/fonts/AmbitRegular.cjs.map +0 -1
  194. package/dist/assets/fonts/AmbitRegular.d.cts +0 -2
  195. package/dist/assets/fonts/AmbitRegular.d.ts +0 -2
  196. package/dist/assets/fonts/AmbitRegular.js +0 -6
  197. package/dist/assets/fonts/AmbitRegular.js.map +0 -1
  198. package/dist/components/demos/ComboboxDemo.cjs +0 -814
  199. package/dist/components/demos/ComboboxDemo.cjs.map +0 -1
  200. package/dist/components/demos/ComboboxDemo.d.cts +0 -5
  201. package/dist/components/demos/ComboboxDemo.d.ts +0 -5
  202. package/dist/components/demos/ComboboxDemo.js +0 -786
  203. package/dist/components/demos/ComboboxDemo.js.map +0 -1
  204. package/dist/components/demos/CounterDemo.cjs +0 -270
  205. package/dist/components/demos/CounterDemo.cjs.map +0 -1
  206. package/dist/components/demos/CounterDemo.d.cts +0 -5
  207. package/dist/components/demos/CounterDemo.d.ts +0 -5
  208. package/dist/components/demos/CounterDemo.js +0 -238
  209. package/dist/components/demos/CounterDemo.js.map +0 -1
  210. package/dist/components/demos/InputDemo.cjs +0 -225
  211. package/dist/components/demos/InputDemo.cjs.map +0 -1
  212. package/dist/components/demos/InputDemo.d.cts +0 -5
  213. package/dist/components/demos/InputDemo.d.ts +0 -5
  214. package/dist/components/demos/InputDemo.js +0 -192
  215. package/dist/components/demos/InputDemo.js.map +0 -1
  216. package/dist/components/demos/MapComponentDemo.cjs +0 -129
  217. package/dist/components/demos/MapComponentDemo.cjs.map +0 -1
  218. package/dist/components/demos/MapComponentDemo.d.cts +0 -5
  219. package/dist/components/demos/MapComponentDemo.d.ts +0 -5
  220. package/dist/components/demos/MapComponentDemo.js +0 -107
  221. package/dist/components/demos/MapComponentDemo.js.map +0 -1
  222. package/dist/components/demos/PlacesQueryInputDemo.cjs +0 -341
  223. package/dist/components/demos/PlacesQueryInputDemo.cjs.map +0 -1
  224. package/dist/components/demos/PlacesQueryInputDemo.d.cts +0 -5
  225. package/dist/components/demos/PlacesQueryInputDemo.d.ts +0 -5
  226. package/dist/components/demos/PlacesQueryInputDemo.js +0 -309
  227. package/dist/components/demos/PlacesQueryInputDemo.js.map +0 -1
  228. package/dist/components/demos/SelectDemo.cjs +0 -365
  229. package/dist/components/demos/SelectDemo.cjs.map +0 -1
  230. package/dist/components/demos/SelectDemo.d.cts +0 -5
  231. package/dist/components/demos/SelectDemo.d.ts +0 -5
  232. package/dist/components/demos/SelectDemo.js +0 -337
  233. package/dist/components/demos/SelectDemo.js.map +0 -1
  234. package/dist/components/demos/index.cjs +0 -1600
  235. package/dist/components/demos/index.cjs.map +0 -1
  236. package/dist/components/demos/index.d.cts +0 -5
  237. package/dist/components/demos/index.d.ts +0 -5
  238. package/dist/components/demos/index.js +0 -1574
  239. package/dist/components/demos/index.js.map +0 -1
@@ -1,238 +0,0 @@
1
- "use client";
2
-
3
- // src/components/ui/Counter.tsx
4
- import { cva } from "cva";
5
- import { Minus, Plus } from "lucide-react";
6
- import { forwardRef as forwardRef2, useEffect, useState } from "react";
7
-
8
- // src/lib/utils.ts
9
- import { clsx } from "clsx";
10
- import { twMerge } from "tailwind-merge";
11
- function cn(...inputs) {
12
- return twMerge(clsx(inputs));
13
- }
14
-
15
- // src/components/ui/ErrorMessage.tsx
16
- import { jsx } from "react/jsx-runtime";
17
- function ErrorMessage({ message, className, ...props }) {
18
- if (!message) return null;
19
- return /* @__PURE__ */ jsx("p", { className: cn("px-1 text-xs text-red-600", className), ...props, children: message });
20
- }
21
- var ErrorMessage_default = ErrorMessage;
22
-
23
- // src/components/primitives/tooltip.tsx
24
- import * as TooltipPrimitive from "@radix-ui/react-tooltip";
25
- import * as React from "react";
26
- import { jsx as jsx2 } from "react/jsx-runtime";
27
- var TooltipProvider = TooltipPrimitive.Provider;
28
- var Tooltip = TooltipPrimitive.Root;
29
- var TooltipTrigger = TooltipPrimitive.Trigger;
30
- var TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx2(
31
- TooltipPrimitive.Content,
32
- {
33
- ref,
34
- sideOffset,
35
- className: cn(
36
- "z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
37
- className
38
- ),
39
- ...props
40
- }
41
- ));
42
- TooltipContent.displayName = TooltipPrimitive.Content.displayName;
43
-
44
- // src/components/ui/Label.tsx
45
- import { InfoIcon } from "lucide-react";
46
- import { jsx as jsx3, jsxs } from "react/jsx-runtime";
47
- function Label({ text, required, description, className, ...props }) {
48
- if (!text) return null;
49
- return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-row gap-1", children: [
50
- /* @__PURE__ */ jsxs(
51
- "label",
52
- {
53
- className: cn(
54
- "text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
55
- className
56
- ),
57
- ...props,
58
- children: [
59
- text,
60
- required && /* @__PURE__ */ jsx3("span", { className: "text-red-600", children: "\xA0*" })
61
- ]
62
- }
63
- ),
64
- !!description && /* @__PURE__ */ jsx3(TooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip, { children: [
65
- /* @__PURE__ */ jsx3(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx3(InfoIcon, { className: "h-4 w-4" }) }),
66
- /* @__PURE__ */ jsx3(TooltipContent, { className: "max-w-48", children: description })
67
- ] }) })
68
- ] });
69
- }
70
- var Label_default = Label;
71
-
72
- // src/components/ui/Counter.tsx
73
- import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
74
- var Counter = forwardRef2(
75
- ({ label, error, min, max, step = 1, description, theme, value, classNames, onChange, ...props }, ref) => {
76
- const [count, setCount] = useState(0);
77
- useEffect(() => {
78
- setCount(value ?? 0);
79
- }, [value]);
80
- const handleChange = (e) => {
81
- const newValue = parseInt(e.target.value.replace(/\D/g, ""), 10);
82
- if (isNaN(newValue)) return;
83
- if (min && newValue < min) {
84
- onChange?.(min);
85
- setCount(min);
86
- return;
87
- }
88
- if (max && newValue > max) {
89
- onChange?.(max);
90
- setCount(max);
91
- return;
92
- }
93
- onChange?.(newValue);
94
- setCount(newValue);
95
- };
96
- const decrement = () => {
97
- const proposedValue = count - step;
98
- const newValue = Math.max(min ?? -Infinity, proposedValue);
99
- onChange?.(newValue);
100
- setCount(newValue);
101
- };
102
- const increment = () => {
103
- const proposedValue = count + step;
104
- const newValue = Math.min(max ?? Infinity, proposedValue);
105
- onChange?.(newValue);
106
- setCount(newValue);
107
- };
108
- return /* @__PURE__ */ jsxs2(
109
- "div",
110
- {
111
- className: cn("flex w-auto flex-col gap-1", classNames?.root),
112
- "data-testid": `counter-wrapper-${props.id}`,
113
- children: [
114
- label && /* @__PURE__ */ jsx4(
115
- Label_default,
116
- {
117
- text: label,
118
- htmlFor: props.name,
119
- required: props.required,
120
- description,
121
- className: classNames?.label
122
- }
123
- ),
124
- /* @__PURE__ */ jsxs2("div", { className: "relative flex w-[122px] flex-row items-center", children: [
125
- /* @__PURE__ */ jsx4(
126
- "button",
127
- {
128
- type: "button",
129
- className: "absolute inset-y-0 left-1 my-auto flex h-8 w-8 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20",
130
- onClick: decrement,
131
- children: /* @__PURE__ */ jsx4(Minus, { className: "h-4 w-4 text-green-100" })
132
- }
133
- ),
134
- /* @__PURE__ */ jsx4(
135
- "input",
136
- {
137
- className: cn(counterVariants({ theme }), classNames?.input),
138
- ref,
139
- value: count,
140
- onChange: handleChange,
141
- "data-testid": `counter-element-${props.id}`,
142
- ...props
143
- }
144
- ),
145
- /* @__PURE__ */ jsx4(
146
- "button",
147
- {
148
- type: "button",
149
- className: "absolute inset-y-0 right-1 my-auto flex h-8 w-8 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20",
150
- onClick: increment,
151
- children: /* @__PURE__ */ jsx4(Plus, { className: "h-4 w-4 text-green-100" })
152
- }
153
- )
154
- ] }),
155
- /* @__PURE__ */ jsx4(ErrorMessage_default, { message: error })
156
- ]
157
- }
158
- );
159
- }
160
- );
161
- Counter.displayName = "Counter";
162
- var counterVariants = cva(
163
- [
164
- "border-input",
165
- "placeholder:text-muted-foreground",
166
- "focus-visible:ring-ring",
167
- "inline-flex",
168
- "w-[122px]",
169
- "h-11",
170
- "items-center",
171
- "justify-start",
172
- "gap-3",
173
- "rounded-lg",
174
- "bg-transparent",
175
- "px-3",
176
- "pt-0.5",
177
- "text-sm",
178
- "text-center",
179
- "shadow-sm",
180
- "ring-grey-50",
181
- "transition-colors",
182
- "focus-visible:outline-none",
183
- "focus-visible:ring-1",
184
- "disabled:cursor-not-allowed",
185
- "disabled:opacity-50",
186
- "appearance-none",
187
- "[&::-webkit-search-cancel-button]:appearance-none",
188
- "[&::-webkit-search-decoration]:appearance-none",
189
- "[&::-webkit-search-results-button]:appearance-none",
190
- "[&::-webkit-search-results-decoration]:appearance-none",
191
- "[&::-ms-clear]:display-none",
192
- "[&::-ms-reveal]:display-none"
193
- ],
194
- {
195
- variants: {
196
- theme: {
197
- light: "text-grey-80 border",
198
- dark: "text-white"
199
- },
200
- hasIcon: {
201
- false: "pl-3",
202
- true: "pl-8"
203
- }
204
- },
205
- defaultVariants: {
206
- theme: "light",
207
- hasIcon: false
208
- }
209
- }
210
- );
211
-
212
- // src/components/demos/CounterDemo.tsx
213
- import { useState as useState2 } from "react";
214
- import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
215
- function CounterDemo() {
216
- const [count, setCount] = useState2(0);
217
- return /* @__PURE__ */ jsxs3("div", { className: "m-4", children: [
218
- /* @__PURE__ */ jsx5("h3", { children: "Counter" }),
219
- /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-2 md:flex-row", children: [
220
- /* @__PURE__ */ jsx5("div", { className: "p-2", children: /* @__PURE__ */ jsx5(
221
- Counter,
222
- {
223
- label: "Required Counter",
224
- required: true,
225
- value: count,
226
- onChange: setCount,
227
- description: "This is a tooltip"
228
- }
229
- ) }),
230
- /* @__PURE__ */ jsx5("div", { className: "p-2", children: /* @__PURE__ */ jsx5(Counter, { min: 0, max: 10, step: 2 }) })
231
- ] })
232
- ] });
233
- }
234
- var CounterDemo_default = CounterDemo;
235
- export {
236
- CounterDemo_default as default
237
- };
238
- //# sourceMappingURL=CounterDemo.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/ui/Counter.tsx","../../../src/lib/utils.ts","../../../src/components/ui/ErrorMessage.tsx","../../../src/components/primitives/tooltip.tsx","../../../src/components/ui/Label.tsx","../../../src/components/demos/CounterDemo.tsx"],"sourcesContent":["'use client'\n\nimport { cva, type VariantProps } from 'cva'\nimport { Minus, Plus } from 'lucide-react'\nimport { ChangeEvent, forwardRef, useEffect, useState, type InputHTMLAttributes } from 'react'\n\nimport ErrorMessage from '@/components/ui/ErrorMessage'\nimport Label from '@/components/ui/Label'\nimport { cn } from '@/lib/utils'\n\ntype InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'>\ntype CounterVariants = VariantProps<typeof counterVariants>\ntype Props = InputProps &\n CounterVariants & {\n label?: string\n value?: number\n error?: string\n min?: number\n max?: number\n step?: number\n description?: string\n classNames?: { root?: string; input?: string; label?: string }\n onChange?: (n: number) => void\n }\n\nexport const Counter = forwardRef<HTMLInputElement, Props>(\n (\n { label, error, min, max, step = 1, description, theme, value, classNames, onChange, ...props },\n ref\n ) => {\n const [count, setCount] = useState(0)\n\n useEffect(() => {\n setCount(value ?? 0)\n }, [value])\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n const newValue = parseInt(e.target.value.replace(/\\D/g, ''), 10)\n if (isNaN(newValue)) return\n if (min && newValue < min) {\n onChange?.(min)\n setCount(min)\n return\n }\n if (max && newValue > max) {\n onChange?.(max)\n setCount(max)\n return\n }\n onChange?.(newValue)\n setCount(newValue)\n }\n\n const decrement = () => {\n const proposedValue = count - step\n const newValue = Math.max(min ?? -Infinity, proposedValue)\n onChange?.(newValue)\n setCount(newValue)\n }\n\n const increment = () => {\n const proposedValue = count + step\n const newValue = Math.min(max ?? Infinity, proposedValue)\n onChange?.(newValue)\n setCount(newValue)\n }\n\n return (\n <div\n className={cn('flex w-auto flex-col gap-1', classNames?.root)}\n data-testid={`counter-wrapper-${props.id}`}\n >\n {label && (\n <Label\n text={label}\n htmlFor={props.name}\n required={props.required}\n description={description}\n className={classNames?.label}\n />\n )}\n\n <div className=\"relative flex w-[122px] flex-row items-center\">\n <button\n type=\"button\"\n className=\"absolute inset-y-0 left-1 my-auto flex h-8 w-8 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20\"\n onClick={decrement}\n >\n <Minus className=\"h-4 w-4 text-green-100\" />\n </button>\n\n <input\n className={cn(counterVariants({ theme }), classNames?.input)}\n ref={ref}\n value={count}\n onChange={handleChange}\n data-testid={`counter-element-${props.id}`}\n {...props}\n />\n\n <button\n type=\"button\"\n className=\"absolute inset-y-0 right-1 my-auto flex h-8 w-8 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20\"\n onClick={increment}\n >\n <Plus className=\"h-4 w-4 text-green-100\" />\n </button>\n </div>\n\n <ErrorMessage message={error} />\n </div>\n )\n }\n)\nCounter.displayName = 'Counter'\n\nconst counterVariants = cva(\n [\n 'border-input',\n 'placeholder:text-muted-foreground',\n 'focus-visible:ring-ring',\n 'inline-flex',\n 'w-[122px]',\n 'h-11',\n 'items-center',\n 'justify-start',\n 'gap-3',\n 'rounded-lg',\n 'bg-transparent',\n 'px-3',\n 'pt-0.5',\n 'text-sm',\n 'text-center',\n 'shadow-sm',\n 'ring-grey-50',\n 'transition-colors',\n 'focus-visible:outline-none',\n 'focus-visible:ring-1',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'appearance-none',\n '[&::-webkit-search-cancel-button]:appearance-none',\n '[&::-webkit-search-decoration]:appearance-none',\n '[&::-webkit-search-results-button]:appearance-none',\n '[&::-webkit-search-results-decoration]:appearance-none',\n '[&::-ms-clear]:display-none',\n '[&::-ms-reveal]:display-none',\n ],\n {\n variants: {\n theme: {\n light: 'text-grey-80 border',\n dark: 'text-white',\n },\n hasIcon: {\n false: 'pl-3',\n true: 'pl-8',\n },\n },\n defaultVariants: {\n theme: 'light',\n hasIcon: false,\n },\n }\n)\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'p'> {\n message?: string\n}\n\nfunction ErrorMessage({ message, className, ...props }: Readonly<Props>) {\n if (!message) return null\n\n return (\n <p className={cn('px-1 text-xs text-red-600', className)} {...props}>\n {message}\n </p>\n )\n}\n\nexport default ErrorMessage\n","'use client'\n\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst TooltipProvider = TooltipPrimitive.Provider\n\nconst Tooltip = TooltipPrimitive.Root\n\nconst TooltipTrigger = TooltipPrimitive.Trigger\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n 'z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50',\n className\n )}\n {...props}\n />\n))\nTooltipContent.displayName = TooltipPrimitive.Content.displayName\n\nexport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\nimport {\n Tooltip,\n TooltipContent,\n TooltipProvider,\n TooltipTrigger,\n} from '@/components/primitives/tooltip'\nimport { InfoIcon } from 'lucide-react'\n\ninterface Props extends ComponentPropsWithoutRef<'label'> {\n text?: string\n required?: boolean\n description?: string\n}\n\nfunction Label({ text, required, description, className, ...props }: Readonly<Props>) {\n if (!text) return null\n\n return (\n <div className=\"flex w-full flex-row gap-1\">\n <label\n className={cn(\n 'text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n className\n )}\n {...props}\n >\n {text}\n {required && <span className=\"text-red-600\">&nbsp;*</span>}\n </label>\n\n {!!description && (\n <TooltipProvider>\n <Tooltip>\n <TooltipTrigger asChild>\n <InfoIcon className=\"h-4 w-4\" />\n </TooltipTrigger>\n <TooltipContent className=\"max-w-48\">{description}</TooltipContent>\n </Tooltip>\n </TooltipProvider>\n )}\n </div>\n )\n}\n\nexport default Label\n","'use client'\n\nimport { Counter } from '@/components/ui/Counter'\nimport { useState } from 'react'\n\nfunction CounterDemo() {\n const [count, setCount] = useState(0)\n\n return (\n <div className=\"m-4\">\n <h3>Counter</h3>\n <div className=\"flex flex-col gap-2 md:flex-row\">\n <div className=\"p-2\">\n <Counter\n label=\"Required Counter\"\n required\n value={count}\n onChange={setCount}\n description=\"This is a tooltip\"\n />\n </div>\n <div className=\"p-2\">\n <Counter min={0} max={10} step={2} />\n </div>\n </div>\n </div>\n )\n}\n\nexport default CounterDemo\n"],"mappings":"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","names":["forwardRef","jsx","jsx","jsx","jsxs","forwardRef","useState","jsx","jsxs"]}
@@ -1,225 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
-
30
- // src/components/demos/InputDemo.tsx
31
- var InputDemo_exports = {};
32
- __export(InputDemo_exports, {
33
- default: () => InputDemo_default
34
- });
35
- module.exports = __toCommonJS(InputDemo_exports);
36
-
37
- // src/components/ui/Input.tsx
38
- var import_cva = require("cva");
39
- var import_lucide_react2 = require("lucide-react");
40
- var import_react = require("react");
41
-
42
- // src/lib/utils.ts
43
- var import_clsx = require("clsx");
44
- var import_tailwind_merge = require("tailwind-merge");
45
- function cn(...inputs) {
46
- return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
47
- }
48
-
49
- // src/components/ui/ErrorMessage.tsx
50
- var import_jsx_runtime = require("react/jsx-runtime");
51
- function ErrorMessage({ message, className, ...props }) {
52
- if (!message) return null;
53
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: cn("px-1 text-xs text-red-600", className), ...props, children: message });
54
- }
55
- var ErrorMessage_default = ErrorMessage;
56
-
57
- // src/components/primitives/tooltip.tsx
58
- var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
59
- var React = __toESM(require("react"), 1);
60
- var import_jsx_runtime2 = require("react/jsx-runtime");
61
- var TooltipProvider = TooltipPrimitive.Provider;
62
- var Tooltip = TooltipPrimitive.Root;
63
- var TooltipTrigger = TooltipPrimitive.Trigger;
64
- var TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
65
- TooltipPrimitive.Content,
66
- {
67
- ref,
68
- sideOffset,
69
- className: cn(
70
- "z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
71
- className
72
- ),
73
- ...props
74
- }
75
- ));
76
- TooltipContent.displayName = TooltipPrimitive.Content.displayName;
77
-
78
- // src/components/ui/Label.tsx
79
- var import_lucide_react = require("lucide-react");
80
- var import_jsx_runtime3 = require("react/jsx-runtime");
81
- function Label({ text, required, description, className, ...props }) {
82
- if (!text) return null;
83
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex w-full flex-row gap-1", children: [
84
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
85
- "label",
86
- {
87
- className: cn(
88
- "text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
89
- className
90
- ),
91
- ...props,
92
- children: [
93
- text,
94
- required && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-red-600", children: "\xA0*" })
95
- ]
96
- }
97
- ),
98
- !!description && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Tooltip, { children: [
99
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.InfoIcon, { className: "h-4 w-4" }) }),
100
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TooltipContent, { className: "max-w-48", children: description })
101
- ] }) })
102
- ] });
103
- }
104
- var Label_default = Label;
105
-
106
- // src/components/ui/Input.tsx
107
- var import_jsx_runtime4 = require("react/jsx-runtime");
108
- var Input = (0, import_react.forwardRef)(
109
- ({ label, error, description, theme, icon, onClear, value, onChange, classNames, ...props }, ref) => {
110
- const handleClear = () => {
111
- onChange?.({ target: { value: "" } });
112
- onClear?.();
113
- };
114
- const IconComponent = icon && import_lucide_react2.icons[icon];
115
- const placeholder = props.placeholder ?? (icon === "Search" ? "Search..." : "");
116
- const hasIcon = !!icon;
117
- const iconColor = theme === "dark" ? "text-white" : "text-grey-80";
118
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "group flex w-full flex-col gap-1", "data-testid": `input-wrapper-${props.id}`, children: [
119
- label && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
120
- Label_default,
121
- {
122
- text: label,
123
- htmlFor: props.name,
124
- required: props.required,
125
- description,
126
- className: classNames?.label
127
- }
128
- ),
129
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "relative flex flex-row items-center", children: [
130
- IconComponent && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
131
- IconComponent,
132
- {
133
- className: `absolute left-3 h-4 w-4 ${iconColor} opacity-50 group-hover:opacity-100`
134
- }
135
- ),
136
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
137
- "input",
138
- {
139
- className: cn(inputVariants({ theme, hasIcon })),
140
- ref,
141
- placeholder,
142
- value,
143
- onChange,
144
- "data-testid": `input-element-${props.id}`,
145
- ...props
146
- }
147
- ),
148
- hasIcon && value && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
149
- import_lucide_react2.X,
150
- {
151
- className: `absolute right-3 h-4 w-4 cursor-pointer ${iconColor}`,
152
- onClick: handleClear,
153
- "data-testid": "clear-button"
154
- }
155
- )
156
- ] }),
157
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ErrorMessage_default, { message: error })
158
- ] });
159
- }
160
- );
161
- Input.displayName = "Input";
162
- var inputVariants = (0, import_cva.cva)(
163
- [
164
- "border-input",
165
- "placeholder:text-muted-foreground",
166
- "focus-visible:ring-ring",
167
- "inline-flex",
168
- "w-full",
169
- "h-11",
170
- "items-center",
171
- "justify-start",
172
- "gap-3",
173
- "rounded-lg",
174
- "bg-transparent",
175
- "px-3",
176
- "pt-0.5",
177
- "text-sm",
178
- "shadow-sm",
179
- "ring-grey-50",
180
- "transition-colors",
181
- "focus-visible:outline-none",
182
- "focus-visible:ring-1",
183
- "disabled:cursor-not-allowed",
184
- "disabled:opacity-50",
185
- "appearance-none",
186
- "[&::-webkit-search-cancel-button]:appearance-none",
187
- "[&::-webkit-search-decoration]:appearance-none",
188
- "[&::-webkit-search-results-button]:appearance-none",
189
- "[&::-webkit-search-results-decoration]:appearance-none",
190
- "[&::-ms-clear]:display-none",
191
- "[&::-ms-reveal]:display-none"
192
- ],
193
- {
194
- variants: {
195
- theme: {
196
- light: "text-grey-80 border",
197
- dark: "text-white"
198
- },
199
- hasIcon: {
200
- false: "pl-3",
201
- true: "pl-8"
202
- }
203
- },
204
- defaultVariants: {
205
- theme: "light",
206
- hasIcon: false
207
- }
208
- }
209
- );
210
- var Input_default = Input;
211
-
212
- // src/components/demos/InputDemo.tsx
213
- var import_jsx_runtime5 = require("react/jsx-runtime");
214
- function InputDemo() {
215
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "m-4", children: [
216
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h3", { children: "Input" }),
217
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-col gap-2 md:flex-row", children: [
218
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "bg-green-80 p-2", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Input_default, { theme: "dark", icon: "Search" }) }),
219
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "p-2", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Input_default, { label: "Required input", required: true, description: "This is a tooltip" }) }),
220
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "p-2", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Input_default, { icon: "MapPin" }) })
221
- ] })
222
- ] });
223
- }
224
- var InputDemo_default = InputDemo;
225
- //# sourceMappingURL=InputDemo.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/demos/InputDemo.tsx","../../../src/components/ui/Input.tsx","../../../src/lib/utils.ts","../../../src/components/ui/ErrorMessage.tsx","../../../src/components/primitives/tooltip.tsx","../../../src/components/ui/Label.tsx"],"sourcesContent":["import Input from '@/components/ui/Input'\n\nfunction InputDemo() {\n return (\n <div className=\"m-4\">\n <h3>Input</h3>\n <div className=\"flex flex-col gap-2 md:flex-row\">\n <div className=\"bg-green-80 p-2\">\n <Input theme=\"dark\" icon=\"Search\" />\n </div>\n <div className=\"p-2\">\n <Input label=\"Required input\" required description=\"This is a tooltip\" />\n </div>\n <div className=\"p-2\">\n <Input icon=\"MapPin\" />\n </div>\n </div>\n </div>\n )\n}\n\nexport default InputDemo\n","import { cva, type VariantProps } from 'cva'\nimport { icons, X } from 'lucide-react'\nimport { type ChangeEvent, forwardRef, type InputHTMLAttributes } from 'react'\n\nimport ErrorMessage from '@/components/ui/ErrorMessage'\nimport Label from '@/components/ui/Label'\nimport { cn } from '@/lib/utils'\n\ninterface Props extends InputHTMLAttributes<HTMLInputElement>, VariantProps<typeof inputVariants> {\n label?: string\n error?: string\n icon?: keyof typeof icons\n description?: string\n classNames?: { label?: string }\n onClear?: () => void\n}\n\nconst Input = forwardRef<HTMLInputElement, Props>(\n (\n { label, error, description, theme, icon, onClear, value, onChange, classNames, ...props },\n ref\n ) => {\n const handleClear = () => {\n onChange?.({ target: { value: '' } } as ChangeEvent<HTMLInputElement>)\n onClear?.()\n }\n\n const IconComponent = icon && icons[icon]\n\n const placeholder = props.placeholder ?? (icon === 'Search' ? 'Search...' : '')\n const hasIcon = !!icon\n\n const iconColor = theme === 'dark' ? 'text-white' : 'text-grey-80'\n\n return (\n <div className=\"group flex w-full flex-col gap-1\" data-testid={`input-wrapper-${props.id}`}>\n {label && (\n <Label\n text={label}\n htmlFor={props.name}\n required={props.required}\n description={description}\n className={classNames?.label}\n />\n )}\n <div className=\"relative flex flex-row items-center\">\n {IconComponent && (\n <IconComponent\n className={`absolute left-3 h-4 w-4 ${iconColor} opacity-50 group-hover:opacity-100`}\n />\n )}\n <input\n className={cn(inputVariants({ theme, hasIcon }))}\n ref={ref}\n placeholder={placeholder}\n value={value}\n onChange={onChange}\n data-testid={`input-element-${props.id}`}\n {...props}\n />\n {hasIcon && value && (\n <X\n className={`absolute right-3 h-4 w-4 cursor-pointer ${iconColor}`}\n onClick={handleClear}\n data-testid=\"clear-button\"\n />\n )}\n </div>\n\n <ErrorMessage message={error} />\n </div>\n )\n }\n)\nInput.displayName = 'Input'\n\nconst inputVariants = cva(\n [\n 'border-input',\n 'placeholder:text-muted-foreground',\n 'focus-visible:ring-ring',\n 'inline-flex',\n 'w-full',\n 'h-11',\n 'items-center',\n 'justify-start',\n 'gap-3',\n 'rounded-lg',\n 'bg-transparent',\n 'px-3',\n 'pt-0.5',\n 'text-sm',\n 'shadow-sm',\n 'ring-grey-50',\n 'transition-colors',\n 'focus-visible:outline-none',\n 'focus-visible:ring-1',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'appearance-none',\n '[&::-webkit-search-cancel-button]:appearance-none',\n '[&::-webkit-search-decoration]:appearance-none',\n '[&::-webkit-search-results-button]:appearance-none',\n '[&::-webkit-search-results-decoration]:appearance-none',\n '[&::-ms-clear]:display-none',\n '[&::-ms-reveal]:display-none',\n ],\n {\n variants: {\n theme: {\n light: 'text-grey-80 border',\n dark: 'text-white',\n },\n hasIcon: {\n false: 'pl-3',\n true: 'pl-8',\n },\n },\n defaultVariants: {\n theme: 'light',\n hasIcon: false,\n },\n }\n)\n\nexport default Input\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'p'> {\n message?: string\n}\n\nfunction ErrorMessage({ message, className, ...props }: Readonly<Props>) {\n if (!message) return null\n\n return (\n <p className={cn('px-1 text-xs text-red-600', className)} {...props}>\n {message}\n </p>\n )\n}\n\nexport default ErrorMessage\n","'use client'\n\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst TooltipProvider = TooltipPrimitive.Provider\n\nconst Tooltip = TooltipPrimitive.Root\n\nconst TooltipTrigger = TooltipPrimitive.Trigger\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n 'z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50',\n className\n )}\n {...props}\n />\n))\nTooltipContent.displayName = TooltipPrimitive.Content.displayName\n\nexport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\nimport {\n Tooltip,\n TooltipContent,\n TooltipProvider,\n TooltipTrigger,\n} from '@/components/primitives/tooltip'\nimport { InfoIcon } from 'lucide-react'\n\ninterface Props extends ComponentPropsWithoutRef<'label'> {\n text?: string\n required?: boolean\n description?: string\n}\n\nfunction Label({ text, required, description, className, ...props }: Readonly<Props>) {\n if (!text) return null\n\n return (\n <div className=\"flex w-full flex-row gap-1\">\n <label\n className={cn(\n 'text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n className\n )}\n {...props}\n >\n {text}\n {required && <span className=\"text-red-600\">&nbsp;*</span>}\n </label>\n\n {!!description && (\n <TooltipProvider>\n <Tooltip>\n <TooltipTrigger asChild>\n <InfoIcon className=\"h-4 w-4\" />\n </TooltipTrigger>\n <TooltipContent className=\"max-w-48\">{description}</TooltipContent>\n </Tooltip>\n </TooltipProvider>\n )}\n </div>\n )\n}\n\nexport default Label\n"],"mappings":"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","names":["import_lucide_react","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}
@@ -1,5 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
-
3
- declare function InputDemo(): react_jsx_runtime.JSX.Element;
4
-
5
- export { InputDemo as default };
@@ -1,5 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
-
3
- declare function InputDemo(): react_jsx_runtime.JSX.Element;
4
-
5
- export { InputDemo as default };