@sikka/hawa 0.37.2-next → 0.38.0-next
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.
- package/dist/{Radio-y9uhxitu.d.ts → Radio-lgoClQrv.d.ts} +2 -2
- package/dist/{Radio-BCD7k628.d.mts → Radio-uQ7DtzcI.d.mts} +2 -2
- package/dist/alert/index.js.map +1 -1
- package/dist/alert/index.mjs.map +1 -1
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/backToTop/index.js.map +1 -1
- package/dist/backToTop/index.mjs.map +1 -1
- package/dist/blocks/auth/index.d.mts +1 -0
- package/dist/blocks/auth/index.d.ts +1 -0
- package/dist/blocks/auth/index.js +207 -123
- package/dist/blocks/auth/index.mjs +204 -101
- package/dist/blocks/feedback/index.js +4 -40
- package/dist/blocks/feedback/index.mjs +5 -5
- package/dist/blocks/index.d.mts +2 -1
- package/dist/blocks/index.d.ts +2 -1
- package/dist/blocks/index.js +457 -400
- package/dist/blocks/index.mjs +10 -8
- package/dist/blocks/misc/index.js +5 -32
- package/dist/blocks/misc/index.mjs +5 -5
- package/dist/blocks/pricing/index.js +4 -22
- package/dist/blocks/pricing/index.mjs +4 -4
- package/dist/button/index.js.map +1 -1
- package/dist/button/index.mjs.map +1 -1
- package/dist/calendar/index.js.map +1 -1
- package/dist/calendar/index.mjs.map +1 -1
- package/dist/checkbox/index.d.mts +1 -1
- package/dist/checkbox/index.d.ts +1 -1
- package/dist/checkbox/index.js.map +1 -1
- package/dist/checkbox/index.mjs.map +1 -1
- package/dist/{chunk-BPHQFAWM.mjs → chunk-4EZL2A64.mjs} +3 -11
- package/dist/{chunk-DS3AACQJ.mjs → chunk-E6C3LDHD.mjs} +1 -1
- package/dist/{chunk-ODOCZAWC.mjs → chunk-E77TUADR.mjs} +1 -1
- package/dist/{chunk-QXH7ZDMN.mjs → chunk-IA5FLRFL.mjs} +3 -11
- package/dist/{chunk-ZTUWU652.mjs → chunk-JJMRBD3S.mjs} +3 -3
- package/dist/{chunk-RNFJAEEU.mjs → chunk-LDJD5ITW.mjs} +1 -0
- package/dist/{chunk-QYWOI3DO.mjs → chunk-MHSSZ6XE.mjs} +204 -144
- package/dist/{chunk-BTDR3VAG.mjs → chunk-Q3HJI7ZE.mjs} +4 -21
- package/dist/{chunk-MDHDHEPZ.mjs → chunk-TMUQCNLO.mjs} +3 -11
- package/dist/{chunk-PXGL7ZXQ.mjs → chunk-V4SUYEVH.mjs} +1 -0
- package/dist/codeBlock/index.js.map +1 -1
- package/dist/codeBlock/index.mjs.map +1 -1
- package/dist/colorPicker/index.d.mts +1 -1
- package/dist/colorPicker/index.d.ts +1 -1
- package/dist/colorPicker/index.js +35 -31
- package/dist/colorPicker/index.js.map +1 -1
- package/dist/colorPicker/index.mjs +33 -29
- package/dist/colorPicker/index.mjs.map +1 -1
- package/dist/combobox/index.d.mts +1 -1
- package/dist/combobox/index.d.ts +1 -1
- package/dist/combobox/index.js +52 -48
- package/dist/combobox/index.js.map +1 -1
- package/dist/combobox/index.mjs +52 -48
- package/dist/combobox/index.mjs.map +1 -1
- package/dist/dataTable/index.js +1 -10
- package/dist/dataTable/index.js.map +1 -1
- package/dist/dataTable/index.mjs +1 -10
- package/dist/dataTable/index.mjs.map +1 -1
- package/dist/datePicker/index.js.map +1 -1
- package/dist/datePicker/index.mjs.map +1 -1
- package/dist/docsLayout/index.js.map +1 -1
- package/dist/docsLayout/index.mjs.map +1 -1
- package/dist/elements/index.d.mts +42 -21
- package/dist/elements/index.d.ts +42 -21
- package/dist/elements/index.js +335 -290
- package/dist/elements/index.mjs +14 -23
- package/dist/fileDropzone/index.js.map +1 -1
- package/dist/fileDropzone/index.mjs.map +1 -1
- package/dist/index.css +29 -3
- package/dist/index.d.mts +44 -22
- package/dist/index.d.ts +44 -22
- package/dist/index.js +764 -717
- package/dist/index.mjs +287 -244
- package/dist/input/index.d.mts +1 -1
- package/dist/input/index.d.ts +1 -1
- package/dist/input/index.js +46 -42
- package/dist/input/index.js.map +1 -1
- package/dist/input/index.mjs +45 -41
- package/dist/input/index.mjs.map +1 -1
- package/dist/interfaceSettings/index.js +64 -69
- package/dist/interfaceSettings/index.js.map +1 -1
- package/dist/interfaceSettings/index.mjs +57 -62
- package/dist/interfaceSettings/index.mjs.map +1 -1
- package/dist/layout/index.d.mts +1 -1
- package/dist/layout/index.d.ts +1 -1
- package/dist/layout/index.mjs +2 -2
- package/dist/passwordInput/index.js +70 -66
- package/dist/passwordInput/index.js.map +1 -1
- package/dist/passwordInput/index.mjs +59 -55
- package/dist/passwordInput/index.mjs.map +1 -1
- package/dist/phoneInput/index.js +50 -55
- package/dist/phoneInput/index.js.map +1 -1
- package/dist/phoneInput/index.mjs +47 -52
- package/dist/phoneInput/index.mjs.map +1 -1
- package/dist/pinInput/index.d.mts +37 -16
- package/dist/pinInput/index.d.ts +37 -16
- package/dist/pinInput/index.js +208 -78
- package/dist/pinInput/index.js.map +1 -1
- package/dist/pinInput/index.mjs +203 -77
- package/dist/pinInput/index.mjs.map +1 -1
- package/dist/radio/index.d.mts +1 -1
- package/dist/radio/index.d.ts +1 -1
- package/dist/radio/index.js +55 -60
- package/dist/radio/index.js.map +1 -1
- package/dist/radio/index.mjs +50 -55
- package/dist/radio/index.mjs.map +1 -1
- package/dist/scrollArea/index.js +2 -2
- package/dist/scrollArea/index.js.map +1 -1
- package/dist/scrollArea/index.mjs +2 -2
- package/dist/scrollArea/index.mjs.map +1 -1
- package/dist/select/index.d.mts +1 -1
- package/dist/select/index.d.ts +1 -1
- package/dist/select/index.js +43 -39
- package/dist/select/index.js.map +1 -1
- package/dist/select/index.mjs +43 -39
- package/dist/select/index.mjs.map +1 -1
- package/dist/signature/index.d.mts +1 -1
- package/dist/signature/index.d.ts +1 -1
- package/dist/signature/index.js.map +1 -1
- package/dist/signature/index.mjs.map +1 -1
- package/dist/sortButton/index.js.map +1 -1
- package/dist/sortButton/index.mjs.map +1 -1
- package/dist/splitButton/index.js.map +1 -1
- package/dist/splitButton/index.mjs.map +1 -1
- package/dist/stats/index.d.mts +1 -1
- package/dist/stats/index.d.ts +1 -1
- package/dist/stats/index.js.map +1 -1
- package/dist/stats/index.mjs.map +1 -1
- package/dist/tabs/index.js +2 -2
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +2 -2
- package/dist/tabs/index.mjs.map +1 -1
- package/dist/textarea/index.d.mts +1 -1
- package/dist/textarea/index.d.ts +1 -1
- package/dist/textarea/index.js +34 -30
- package/dist/textarea/index.js.map +1 -1
- package/dist/textarea/index.mjs +34 -30
- package/dist/textarea/index.mjs.map +1 -1
- package/package.json +2 -1
package/dist/textarea/index.mjs
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
"use client";
|
2
2
|
|
3
3
|
// elements/textarea/Textarea.tsx
|
4
|
-
import * as
|
4
|
+
import * as React5 from "react";
|
5
5
|
|
6
6
|
// util/index.ts
|
7
7
|
import { clsx } from "clsx";
|
@@ -45,13 +45,26 @@ function Skeleton({
|
|
45
45
|
);
|
46
46
|
}
|
47
47
|
|
48
|
+
// elements/helperText/HelperText.tsx
|
49
|
+
import React2 from "react";
|
50
|
+
var HelperText = ({ helperText }) => /* @__PURE__ */ React2.createElement(
|
51
|
+
"p",
|
52
|
+
{
|
53
|
+
className: cn(
|
54
|
+
"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all",
|
55
|
+
helperText ? "hawa-h-4 hawa-opacity-100" : "hawa-h-0 hawa-opacity-0"
|
56
|
+
)
|
57
|
+
},
|
58
|
+
helperText
|
59
|
+
);
|
60
|
+
|
48
61
|
// elements/label/Label.tsx
|
49
|
-
import * as
|
62
|
+
import * as React4 from "react";
|
50
63
|
|
51
64
|
// elements/tooltip/Tooltip.tsx
|
52
|
-
import
|
65
|
+
import React3 from "react";
|
53
66
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
54
|
-
var TooltipContent =
|
67
|
+
var TooltipContent = React3.forwardRef(({ className, sideOffset = 4, size = "default", ...props }, ref) => /* @__PURE__ */ React3.createElement(
|
55
68
|
TooltipPrimitive.Content,
|
56
69
|
{
|
57
70
|
ref,
|
@@ -68,7 +81,7 @@ var TooltipContent = React2.forwardRef(({ className, sideOffset = 4, size = "def
|
|
68
81
|
}
|
69
82
|
));
|
70
83
|
TooltipContent.displayName = TooltipPrimitive.Content.displayName;
|
71
|
-
var TooltipArrow =
|
84
|
+
var TooltipArrow = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React3.createElement(TooltipPrimitive.Arrow, { ref, className: cn(className), ...props }));
|
72
85
|
TooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;
|
73
86
|
var Tooltip = ({
|
74
87
|
side,
|
@@ -85,13 +98,13 @@ var Tooltip = ({
|
|
85
98
|
delayDuration = 300,
|
86
99
|
...props
|
87
100
|
}) => {
|
88
|
-
return /* @__PURE__ */
|
101
|
+
return /* @__PURE__ */ React3.createElement(
|
89
102
|
TooltipPrimitive.TooltipProvider,
|
90
103
|
{
|
91
104
|
delayDuration,
|
92
105
|
...providerProps
|
93
106
|
},
|
94
|
-
/* @__PURE__ */
|
107
|
+
/* @__PURE__ */ React3.createElement(
|
95
108
|
TooltipPrimitive.Root,
|
96
109
|
{
|
97
110
|
open: !disabled && open,
|
@@ -99,8 +112,8 @@ var Tooltip = ({
|
|
99
112
|
onOpenChange,
|
100
113
|
...props
|
101
114
|
},
|
102
|
-
/* @__PURE__ */
|
103
|
-
/* @__PURE__ */
|
115
|
+
/* @__PURE__ */ React3.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
|
116
|
+
/* @__PURE__ */ React3.createElement(
|
104
117
|
TooltipContent,
|
105
118
|
{
|
106
119
|
size,
|
@@ -120,7 +133,7 @@ var Tooltip = ({
|
|
120
133
|
};
|
121
134
|
|
122
135
|
// elements/label/Label.tsx
|
123
|
-
var Label =
|
136
|
+
var Label = React4.forwardRef(({ className, hint, hintSide, required, children, ...props }, ref) => /* @__PURE__ */ React4.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all" }, /* @__PURE__ */ React4.createElement(
|
124
137
|
"label",
|
125
138
|
{
|
126
139
|
ref,
|
@@ -131,8 +144,8 @@ var Label = React3.forwardRef(({ className, hint, hintSide, required, children,
|
|
131
144
|
...props
|
132
145
|
},
|
133
146
|
children,
|
134
|
-
required && /* @__PURE__ */
|
135
|
-
), hint && /* @__PURE__ */
|
147
|
+
required && /* @__PURE__ */ React4.createElement("span", { className: "hawa-mx-0.5 hawa-text-red-500" }, "*")
|
148
|
+
), hint && /* @__PURE__ */ React4.createElement(
|
136
149
|
Tooltip,
|
137
150
|
{
|
138
151
|
content: hint,
|
@@ -142,7 +155,7 @@ var Label = React3.forwardRef(({ className, hint, hintSide, required, children,
|
|
142
155
|
onClick: (event) => event.preventDefault()
|
143
156
|
}
|
144
157
|
},
|
145
|
-
/* @__PURE__ */
|
158
|
+
/* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement(
|
146
159
|
"svg",
|
147
160
|
{
|
148
161
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -154,15 +167,15 @@ var Label = React3.forwardRef(({ className, hint, hintSide, required, children,
|
|
154
167
|
strokeLinecap: "round",
|
155
168
|
strokeLinejoin: "round"
|
156
169
|
},
|
157
|
-
/* @__PURE__ */
|
158
|
-
/* @__PURE__ */
|
159
|
-
/* @__PURE__ */
|
170
|
+
/* @__PURE__ */ React4.createElement("circle", { cx: "12", cy: "12", r: "10" }),
|
171
|
+
/* @__PURE__ */ React4.createElement("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
|
172
|
+
/* @__PURE__ */ React4.createElement("path", { d: "M12 17h.01" })
|
160
173
|
))
|
161
174
|
)));
|
162
175
|
Label.displayName = "Label";
|
163
176
|
|
164
177
|
// elements/textarea/Textarea.tsx
|
165
|
-
var Textarea =
|
178
|
+
var Textarea = React5.forwardRef(
|
166
179
|
({
|
167
180
|
className,
|
168
181
|
classNames,
|
@@ -174,7 +187,7 @@ var Textarea = React4.forwardRef(
|
|
174
187
|
isLoading,
|
175
188
|
...props
|
176
189
|
}, ref) => {
|
177
|
-
return /* @__PURE__ */
|
190
|
+
return /* @__PURE__ */ React5.createElement(
|
178
191
|
"div",
|
179
192
|
{
|
180
193
|
className: cn(
|
@@ -183,7 +196,7 @@ var Textarea = React4.forwardRef(
|
|
183
196
|
className
|
184
197
|
)
|
185
198
|
},
|
186
|
-
/* @__PURE__ */
|
199
|
+
/* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React5.createElement(
|
187
200
|
"div",
|
188
201
|
{
|
189
202
|
className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
|
@@ -192,7 +205,7 @@ var Textarea = React4.forwardRef(
|
|
192
205
|
"/",
|
193
206
|
textareaProps == null ? void 0 : textareaProps.maxLength
|
194
207
|
)),
|
195
|
-
isLoading ? /* @__PURE__ */
|
208
|
+
isLoading ? /* @__PURE__ */ React5.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React5.createElement(
|
196
209
|
"textarea",
|
197
210
|
{
|
198
211
|
...textareaProps,
|
@@ -203,16 +216,7 @@ var Textarea = React4.forwardRef(
|
|
203
216
|
ref
|
204
217
|
}
|
205
218
|
),
|
206
|
-
/* @__PURE__ */
|
207
|
-
"p",
|
208
|
-
{
|
209
|
-
className: cn(
|
210
|
-
"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all",
|
211
|
-
props.helperText ? "hawa-h-4 hawa-opacity-100" : "hawa-h-0 hawa-opacity-0"
|
212
|
-
)
|
213
|
-
},
|
214
|
-
props.helperText
|
215
|
-
), showCount && countPosition === "bottom" && /* @__PURE__ */ React4.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength))
|
219
|
+
/* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, !forceHideHelperText && /* @__PURE__ */ React5.createElement(HelperText, { helperText: props.helperText }), showCount && countPosition === "bottom" && /* @__PURE__ */ React5.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength))
|
216
220
|
);
|
217
221
|
}
|
218
222
|
);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/textarea/Textarea.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { Label, LabelProps } from \"../label\";\n\nexport interface TextareaProps\n extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n helperText?: string;\n isLoading?: boolean;\n /** The label of the input field */\n label?: any;\n labelProps?: LabelProps;\n forceHideHelperText?: boolean;\n textareaProps?: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n showCount?: boolean;\n countPosition?: \"top\" | \"bottom\";\n classNames?: {\n textarea?: string;\n };\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n classNames,\n labelProps,\n showCount,\n forceHideHelperText,\n textareaProps,\n countPosition = \"bottom\",\n isLoading,\n ...props\n },\n ref\n ) => {\n return (\n <div\n className={cn(\n \"textarea-main hawa-relative hawa-flex hawa-h-full hawa-w-full hawa-flex-col\",\n !forceHideHelperText && \"hawa-gap-2\",\n className\n )}\n >\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {showCount && countPosition === \"top\" && (\n <div\n className={\n \"hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none\"\n }\n >\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n {isLoading ? (\n <Skeleton style={{ height: 40 }} />\n ) : (\n <textarea\n {...textareaProps}\n className={cn(\n \"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n classNames?.textarea\n )}\n ref={ref}\n />\n )}\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {!forceHideHelperText && (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n props.helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\"\n )}\n >\n {props.helperText}\n </p>\n )}\n\n {/* Character Counter */}\n {showCount && countPosition === \"bottom\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n </div>\n );\n }\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n className?: string;\n animation?: \"none\" | \"pulse\" | \"shimmer\";\n content?: any;\n fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n ...props\n}: SkeletonProps) {\n const animationStyles = {\n none: \"hawa-rounded hawa-bg-muted\",\n pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n shimmer:\n \"hawa-space-y-5 hawa-rounded hawa-bg-muted hawa-p-4 hawa-relative before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden before:hawa-border-t before:hawa-border-rose-100/10\",\n };\n const fadeStyle = {\n bottom: \"hawa-mask-fade-bottom\",\n top: \"hawa-mask-fade-top\",\n right: \"hawa-mask-fade-right\",\n left: \"hawa-mask-fade-left \",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n hint?: React.ReactNode;\n hintSide?: PositionType;\n htmlFor?: string;\n required?: boolean;\n};\n\nconst Label = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n <label\n ref={ref}\n className={cn(\n \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n className\n )}\n {...props}\n >\n {children}\n {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n </label>\n {hint && (\n <Tooltip\n content={hint}\n side={hintSide}\n triggerProps={{\n tabIndex: -1,\n onClick: (event) => event.preventDefault()\n }}\n >\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n <path d=\"M12 17h.01\" />\n </svg>\n </div>\n </Tooltip>\n )}\n </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n size?: \"default\" | \"small\" | \"large\";\n }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n \"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n {\n \"hawa-text-xs\": size === \"small\",\n \"hawa-text-xl\": size === \"large\"\n },\n className\n )}\n {...props}\n />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n /** Controls the open state of the tooltip. */\n open?: any;\n /** Specifies the side where the tooltip will appear. */\n side?: PositionType;\n /** Content to be displayed within the tooltip. */\n content?: any;\n /** Elements to which the tooltip is anchored. */\n children?: any;\n /** Sets the default open state of the tooltip. */\n defaultOpen?: any;\n /** Event handler for open state changes. */\n onOpenChange?: any;\n /** Duration of the delay before the tooltip appears. */\n delayDuration?: any;\n /** Size of the tooltip. */\n size?: \"default\" | \"small\" | \"large\";\n /** Disables the tooltip. */\n disabled?: boolean;\n triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n size,\n open,\n content,\n children,\n disabled,\n defaultOpen,\n onOpenChange,\n triggerProps,\n contentProps,\n providerProps,\n delayDuration = 300,\n ...props\n}) => {\n return (\n <TooltipPrimitive.TooltipProvider\n delayDuration={delayDuration}\n {...providerProps}\n >\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipContent\n size={size}\n side={side}\n align=\"center\"\n {...contentProps}\n style={{\n ...contentProps?.style,\n maxWidth: \"var(--radix-tooltip-content-available-width)\",\n maxHeight: \"var(--radix-tooltip-content-available-height)\"\n }}\n >\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","React","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/textarea/Textarea.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\nexport interface TextareaProps\n extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n helperText?: any;\n isLoading?: boolean;\n /** The label of the input field */\n label?: any;\n labelProps?: LabelProps;\n forceHideHelperText?: boolean;\n textareaProps?: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n showCount?: boolean;\n countPosition?: \"top\" | \"bottom\";\n classNames?: {\n textarea?: string;\n };\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n classNames,\n labelProps,\n showCount,\n forceHideHelperText,\n textareaProps,\n countPosition = \"bottom\",\n isLoading,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n className={cn(\n \"textarea-main hawa-relative hawa-flex hawa-h-full hawa-w-full hawa-flex-col\",\n !forceHideHelperText && \"hawa-gap-2\",\n className,\n )}\n >\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {showCount && countPosition === \"top\" && (\n <div\n className={\n \"hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none\"\n }\n >\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n {isLoading ? (\n <Skeleton style={{ height: 40 }} />\n ) : (\n <textarea\n {...textareaProps}\n className={cn(\n \"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n classNames?.textarea,\n )}\n ref={ref}\n />\n )}\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n\n {/* Character Counter */}\n {showCount && countPosition === \"bottom\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n </div>\n );\n },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n className?: string;\n animation?: \"none\" | \"pulse\" | \"shimmer\";\n content?: any;\n fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n ...props\n}: SkeletonProps) {\n const animationStyles = {\n none: \"hawa-rounded hawa-bg-muted\",\n pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n shimmer:\n \"hawa-space-y-5 hawa-rounded hawa-bg-muted hawa-p-4 hawa-relative before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden before:hawa-border-t before:hawa-border-rose-100/10\",\n };\n const fadeStyle = {\n bottom: \"hawa-mask-fade-bottom\",\n top: \"hawa-mask-fade-top\",\n right: \"hawa-mask-fade-right\",\n left: \"hawa-mask-fade-left \",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nexport const HelperText = ({ helperText }: { helperText?: any }) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n helperText ? \"hawa-h-4 hawa-opacity-100\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n hint?: React.ReactNode;\n hintSide?: PositionType;\n htmlFor?: string;\n required?: boolean;\n};\n\nconst Label = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n <label\n ref={ref}\n className={cn(\n \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n className\n )}\n {...props}\n >\n {children}\n {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n </label>\n {hint && (\n <Tooltip\n content={hint}\n side={hintSide}\n triggerProps={{\n tabIndex: -1,\n onClick: (event) => event.preventDefault()\n }}\n >\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n <path d=\"M12 17h.01\" />\n </svg>\n </div>\n </Tooltip>\n )}\n </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n size?: \"default\" | \"small\" | \"large\";\n }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n \"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n {\n \"hawa-text-xs\": size === \"small\",\n \"hawa-text-xl\": size === \"large\"\n },\n className\n )}\n {...props}\n />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n /** Controls the open state of the tooltip. */\n open?: any;\n /** Specifies the side where the tooltip will appear. */\n side?: PositionType;\n /** Content to be displayed within the tooltip. */\n content?: any;\n /** Elements to which the tooltip is anchored. */\n children?: any;\n /** Sets the default open state of the tooltip. */\n defaultOpen?: any;\n /** Event handler for open state changes. */\n onOpenChange?: any;\n /** Duration of the delay before the tooltip appears. */\n delayDuration?: any;\n /** Size of the tooltip. */\n size?: \"default\" | \"small\" | \"large\";\n /** Disables the tooltip. */\n disabled?: boolean;\n triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n size,\n open,\n content,\n children,\n disabled,\n defaultOpen,\n onOpenChange,\n triggerProps,\n contentProps,\n providerProps,\n delayDuration = 300,\n ...props\n}) => {\n return (\n <TooltipPrimitive.TooltipProvider\n delayDuration={delayDuration}\n {...providerProps}\n >\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipContent\n size={size}\n side={side}\n align=\"center\"\n {...contentProps}\n style={{\n ...contentProps?.style,\n maxWidth: \"var(--radix-tooltip-content-available-width)\",\n maxHeight: \"var(--radix-tooltip-content-available-height)\"\n }}\n >\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","React","React","React","React"]}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@sikka/hawa",
|
3
|
-
"version": "0.
|
3
|
+
"version": "0.38.0-next",
|
4
4
|
"description": "Modern UI Kit made with Tailwind",
|
5
5
|
"author": {
|
6
6
|
"name": "Sikka Software",
|
@@ -74,6 +74,7 @@
|
|
74
74
|
"embla-carousel-react": "^8.1.3",
|
75
75
|
"eslint": "^9.3.0",
|
76
76
|
"eslint-config-next": "^14.2.3",
|
77
|
+
"input-otp": "^1.2.4",
|
77
78
|
"libphonenumber-js": "^1.11.1",
|
78
79
|
"prism-react-renderer": "^2.3.1",
|
79
80
|
"prismjs": "^1.29.0",
|