@sikka/hawa 0.48.0-next → 0.49.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/accordion/index.js +3 -28
- package/dist/accordion/index.js.map +1 -1
- package/dist/accordion/index.mjs +3 -28
- package/dist/accordion/index.mjs.map +1 -1
- package/dist/alert/index.js +53 -98
- package/dist/alert/index.js.map +1 -1
- package/dist/alert/index.mjs +53 -98
- package/dist/alert/index.mjs.map +1 -1
- package/dist/appLayout/index.d.mts +2 -0
- package/dist/appLayout/index.d.ts +2 -0
- package/dist/appLayout/index.js +263 -409
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +263 -409
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/appMenubar/index.js +15 -20
- package/dist/appMenubar/index.js.map +1 -1
- package/dist/appMenubar/index.mjs +15 -20
- package/dist/appMenubar/index.mjs.map +1 -1
- package/dist/appTabs/index.js +28 -37
- package/dist/appTabs/index.js.map +1 -1
- package/dist/appTabs/index.mjs +28 -37
- package/dist/appTabs/index.mjs.map +1 -1
- package/dist/appTopbar/index.js +125 -173
- package/dist/appTopbar/index.js.map +1 -1
- package/dist/appTopbar/index.mjs +125 -173
- package/dist/appTopbar/index.mjs.map +1 -1
- package/dist/avatar/index.js.map +1 -1
- package/dist/avatar/index.mjs.map +1 -1
- package/dist/backToTop/index.js +50 -82
- package/dist/backToTop/index.js.map +1 -1
- package/dist/backToTop/index.mjs +50 -82
- package/dist/backToTop/index.mjs.map +1 -1
- package/dist/badge/index.d.mts +1 -1
- package/dist/badge/index.d.ts +1 -1
- package/dist/badge/index.js +2 -18
- package/dist/badge/index.js.map +1 -1
- package/dist/badge/index.mjs +2 -18
- package/dist/badge/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 +539 -792
- package/dist/blocks/auth/index.mjs +433 -604
- package/dist/blocks/feedback/index.js +214 -375
- package/dist/blocks/feedback/index.mjs +12 -25
- package/dist/blocks/index.d.mts +1 -0
- package/dist/blocks/index.d.ts +1 -0
- package/dist/blocks/index.js +940 -1445
- package/dist/blocks/index.mjs +469 -615
- package/dist/blocks/misc/index.js +136 -251
- package/dist/blocks/misc/index.mjs +29 -54
- package/dist/blocks/pricing/index.js +220 -397
- package/dist/blocks/pricing/index.mjs +63 -134
- package/dist/breadcrumb/index.js +1 -5
- package/dist/breadcrumb/index.js.map +1 -1
- package/dist/breadcrumb/index.mjs +1 -5
- package/dist/breadcrumb/index.mjs.map +1 -1
- package/dist/button/index.js +50 -82
- package/dist/button/index.js.map +1 -1
- package/dist/button/index.mjs +50 -82
- package/dist/button/index.mjs.map +1 -1
- package/dist/calendar/index.js +50 -82
- package/dist/calendar/index.js.map +1 -1
- package/dist/calendar/index.mjs +50 -82
- package/dist/calendar/index.mjs.map +1 -1
- package/dist/card/index.js +7 -35
- package/dist/card/index.js.map +1 -1
- package/dist/card/index.mjs +7 -35
- package/dist/card/index.mjs.map +1 -1
- package/dist/carousel/index.js +15 -27
- package/dist/carousel/index.js.map +1 -1
- package/dist/carousel/index.mjs +15 -27
- package/dist/carousel/index.mjs.map +1 -1
- package/dist/checkbox/index.js +2 -13
- package/dist/checkbox/index.js.map +1 -1
- package/dist/checkbox/index.mjs +2 -13
- package/dist/checkbox/index.mjs.map +1 -1
- package/dist/chip/index.js +2 -16
- package/dist/chip/index.js.map +1 -1
- package/dist/chip/index.mjs +2 -16
- package/dist/chip/index.mjs.map +1 -1
- package/dist/{chunk-WUMDFBEK.mjs → chunk-3CHFVHTW.mjs} +43 -54
- package/dist/{chunk-2LUXOXAL.mjs → chunk-5SQBJRWE.mjs} +3 -9
- package/dist/{chunk-C2UOOH4X.mjs → chunk-B53SP2WZ.mjs} +3 -17
- package/dist/chunk-GHGWQVTM.mjs +150 -0
- package/dist/{chunk-5S5DR7KF.mjs → chunk-I23ONEDJ.mjs} +2 -10
- package/dist/{chunk-JFWD2ICY.mjs → chunk-JT7R3L5O.mjs} +54 -62
- package/dist/{chunk-6SJUUJOV.mjs → chunk-KDGJZPWK.mjs} +295 -574
- package/dist/{chunk-AWJSHOYU.mjs → chunk-KSJGXQTE.mjs} +1 -1
- package/dist/{chunk-NMW4GM4G.mjs → chunk-SE2JMXYG.mjs} +104 -144
- package/dist/{chunk-GBLWUEYN.mjs → chunk-ULRL4WI6.mjs} +176 -256
- package/dist/{chunk-IFWYR5W2.mjs → chunk-VUELRPUL.mjs} +57 -117
- package/dist/{chunk-WL7C2A5D.mjs → chunk-WQR4XZGL.mjs} +8 -15
- package/dist/codeBlock/index.js +50 -82
- package/dist/codeBlock/index.js.map +1 -1
- package/dist/codeBlock/index.mjs +50 -82
- package/dist/codeBlock/index.mjs.map +1 -1
- package/dist/colorPicker/index.js +21 -33
- package/dist/colorPicker/index.js.map +1 -1
- package/dist/colorPicker/index.mjs +22 -37
- 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 +141 -223
- package/dist/combobox/index.js.map +1 -1
- package/dist/combobox/index.mjs +141 -223
- package/dist/combobox/index.mjs.map +1 -1
- package/dist/command/index.d.mts +1 -1
- package/dist/command/index.d.ts +1 -1
- package/dist/command/index.js +129 -212
- package/dist/command/index.js.map +1 -1
- package/dist/command/index.mjs +129 -212
- package/dist/command/index.mjs.map +1 -1
- package/dist/dataTable/index.js +254 -394
- package/dist/dataTable/index.js.map +1 -1
- package/dist/dataTable/index.mjs +254 -394
- package/dist/dataTable/index.mjs.map +1 -1
- package/dist/datePicker/index.js +64 -105
- package/dist/datePicker/index.js.map +1 -1
- package/dist/datePicker/index.mjs +64 -105
- package/dist/datePicker/index.mjs.map +1 -1
- package/dist/destroyableCard/index.js +8 -39
- package/dist/destroyableCard/index.js.map +1 -1
- package/dist/destroyableCard/index.mjs +8 -39
- package/dist/destroyableCard/index.mjs.map +1 -1
- package/dist/dialog/index.js +70 -122
- package/dist/dialog/index.js.map +1 -1
- package/dist/dialog/index.mjs +70 -122
- package/dist/dialog/index.mjs.map +1 -1
- package/dist/docsLayout/index.js +169 -358
- package/dist/docsLayout/index.js.map +1 -1
- package/dist/docsLayout/index.mjs +169 -358
- package/dist/docsLayout/index.mjs.map +1 -1
- package/dist/docsSidebar/index.js +9 -16
- package/dist/docsSidebar/index.js.map +1 -1
- package/dist/docsSidebar/index.mjs +9 -16
- package/dist/docsSidebar/index.mjs.map +1 -1
- package/dist/dropdownMenu/index.js +124 -164
- package/dist/dropdownMenu/index.js.map +1 -1
- package/dist/dropdownMenu/index.mjs +124 -164
- package/dist/dropdownMenu/index.mjs.map +1 -1
- package/dist/elements/index.d.mts +3 -3
- package/dist/elements/index.d.ts +3 -3
- package/dist/elements/index.js +841 -1505
- package/dist/elements/index.mjs +381 -718
- package/dist/fileDropzone/index.js +60 -159
- package/dist/fileDropzone/index.js.map +1 -1
- package/dist/fileDropzone/index.mjs +60 -159
- package/dist/fileDropzone/index.mjs.map +1 -1
- package/dist/glow/index.js +4 -16
- package/dist/glow/index.js.map +1 -1
- package/dist/glow/index.mjs +4 -16
- package/dist/glow/index.mjs.map +1 -1
- package/dist/hooks/index.d.mts +1 -5
- package/dist/hooks/index.d.ts +1 -5
- package/dist/hooks/index.js +11 -24
- package/dist/hooks/index.mjs +2 -2
- package/dist/{index-B0aJcA6d.d.ts → index-BgNycocQ.d.mts} +2 -2
- package/dist/{index-B0aJcA6d.d.mts → index-BgNycocQ.d.ts} +2 -2
- package/dist/index.css +1 -6
- package/dist/index.d.mts +7 -8
- package/dist/index.d.ts +7 -8
- package/dist/index.js +1549 -2512
- package/dist/index.mjs +1550 -2516
- package/dist/input/index.js +20 -29
- package/dist/input/index.js.map +1 -1
- package/dist/input/index.mjs +20 -29
- package/dist/input/index.mjs.map +1 -1
- package/dist/interfaceSettings/index.js +122 -163
- package/dist/interfaceSettings/index.js.map +1 -1
- package/dist/interfaceSettings/index.mjs +122 -163
- package/dist/interfaceSettings/index.mjs.map +1 -1
- package/dist/label/index.js +19 -26
- package/dist/label/index.js.map +1 -1
- package/dist/label/index.mjs +19 -26
- package/dist/label/index.mjs.map +1 -1
- package/dist/layout/index.d.mts +2 -0
- package/dist/layout/index.d.ts +2 -0
- package/dist/layout/index.js +434 -790
- package/dist/layout/index.mjs +143 -243
- package/dist/loading/index.js +30 -53
- package/dist/loading/index.js.map +1 -1
- package/dist/loading/index.mjs +30 -53
- package/dist/loading/index.mjs.map +1 -1
- package/dist/logos/index.js +66 -191
- package/dist/logos/index.js.map +1 -1
- package/dist/logos/index.mjs +66 -191
- package/dist/logos/index.mjs.map +1 -1
- package/dist/navbar/index.js +1 -4
- package/dist/navbar/index.js.map +1 -1
- package/dist/navbar/index.mjs +1 -4
- package/dist/navbar/index.mjs.map +1 -1
- package/dist/navigationMenu/index.js +14 -22
- package/dist/navigationMenu/index.js.map +1 -1
- package/dist/navigationMenu/index.mjs +14 -22
- package/dist/navigationMenu/index.mjs.map +1 -1
- package/dist/pagination/index.js +1 -5
- package/dist/pagination/index.js.map +1 -1
- package/dist/pagination/index.mjs +1 -5
- package/dist/pagination/index.mjs.map +1 -1
- package/dist/passwordInput/index.js +36 -65
- package/dist/passwordInput/index.js.map +1 -1
- package/dist/passwordInput/index.mjs +36 -65
- package/dist/passwordInput/index.mjs.map +1 -1
- package/dist/phoneInput/index.js +20 -29
- package/dist/phoneInput/index.js.map +1 -1
- package/dist/phoneInput/index.mjs +20 -29
- package/dist/phoneInput/index.mjs.map +1 -1
- package/dist/pinInput/index.js +14 -16
- package/dist/pinInput/index.js.map +1 -1
- package/dist/pinInput/index.mjs +14 -16
- package/dist/pinInput/index.mjs.map +1 -1
- package/dist/popover/index.js +14 -24
- package/dist/popover/index.js.map +1 -1
- package/dist/popover/index.mjs +14 -24
- package/dist/popover/index.mjs.map +1 -1
- package/dist/progress/index.js +19 -26
- package/dist/progress/index.js.map +1 -1
- package/dist/progress/index.mjs +19 -26
- package/dist/progress/index.mjs.map +1 -1
- package/dist/progressCircle/index.js +67 -71
- package/dist/progressCircle/index.js.map +1 -1
- package/dist/progressCircle/index.mjs +67 -71
- package/dist/progressCircle/index.mjs.map +1 -1
- package/dist/radio/index.js +122 -163
- package/dist/radio/index.js.map +1 -1
- package/dist/radio/index.mjs +122 -163
- package/dist/radio/index.mjs.map +1 -1
- package/dist/scrollArea/index.js.map +1 -1
- package/dist/scrollArea/index.mjs.map +1 -1
- package/dist/scrollIndicator/index.js +1 -4
- package/dist/scrollIndicator/index.js.map +1 -1
- package/dist/scrollIndicator/index.mjs +1 -4
- package/dist/scrollIndicator/index.mjs.map +1 -1
- package/dist/select/index.js +20 -29
- package/dist/select/index.js.map +1 -1
- package/dist/select/index.mjs +20 -29
- package/dist/select/index.mjs.map +1 -1
- package/dist/separator/index.js.map +1 -1
- package/dist/separator/index.mjs.map +1 -1
- package/dist/sheet/index.js +42 -53
- package/dist/sheet/index.js.map +1 -1
- package/dist/sheet/index.mjs +42 -53
- package/dist/sheet/index.mjs.map +1 -1
- package/dist/sidebar/index.js +66 -133
- package/dist/sidebar/index.js.map +1 -1
- package/dist/sidebar/index.mjs +66 -133
- package/dist/sidebar/index.mjs.map +1 -1
- package/dist/signature/index.js +19 -26
- package/dist/signature/index.js.map +1 -1
- package/dist/signature/index.mjs +19 -26
- package/dist/signature/index.mjs.map +1 -1
- package/dist/simpleTable/index.js +50 -81
- package/dist/simpleTable/index.js.map +1 -1
- package/dist/simpleTable/index.mjs +50 -81
- package/dist/simpleTable/index.mjs.map +1 -1
- package/dist/skeleton/index.js.map +1 -1
- package/dist/skeleton/index.mjs.map +1 -1
- package/dist/slider/index.js.map +1 -1
- package/dist/slider/index.mjs.map +1 -1
- package/dist/sonner/index.js.map +1 -1
- package/dist/sonner/index.mjs.map +1 -1
- package/dist/sortButton/index.js +50 -82
- package/dist/sortButton/index.js.map +1 -1
- package/dist/sortButton/index.mjs +50 -82
- package/dist/sortButton/index.mjs.map +1 -1
- package/dist/splitButton/index.js +214 -294
- package/dist/splitButton/index.js.map +1 -1
- package/dist/splitButton/index.mjs +214 -294
- package/dist/splitButton/index.mjs.map +1 -1
- package/dist/stats/index.js +7 -35
- package/dist/stats/index.js.map +1 -1
- package/dist/stats/index.mjs +7 -35
- package/dist/stats/index.mjs.map +1 -1
- package/dist/switch/index.js +24 -34
- package/dist/switch/index.js.map +1 -1
- package/dist/switch/index.mjs +24 -34
- package/dist/switch/index.mjs.map +1 -1
- package/dist/table/index.js +27 -29
- package/dist/table/index.js.map +1 -1
- package/dist/table/index.mjs +27 -29
- package/dist/table/index.mjs.map +1 -1
- package/dist/tabs/index.js +54 -76
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +54 -76
- package/dist/tabs/index.mjs.map +1 -1
- package/dist/textarea/index.js +21 -38
- package/dist/textarea/index.js.map +1 -1
- package/dist/textarea/index.mjs +21 -38
- package/dist/textarea/index.mjs.map +1 -1
- package/dist/toast/index.js +2 -10
- package/dist/toast/index.js.map +1 -1
- package/dist/toast/index.mjs +2 -10
- package/dist/toast/index.mjs.map +1 -1
- package/dist/toaster/index.js +3 -16
- package/dist/toaster/index.js.map +1 -1
- package/dist/toaster/index.mjs +3 -16
- package/dist/toaster/index.mjs.map +1 -1
- package/dist/tooltip/index.js +19 -26
- package/dist/tooltip/index.js.map +1 -1
- package/dist/tooltip/index.mjs +19 -26
- package/dist/tooltip/index.mjs.map +1 -1
- package/package.json +12 -12
- package/dist/chunk-JP2N5WKD.mjs +0 -190
@@ -107,9 +107,7 @@ function Skeleton({
|
|
107
107
|
|
108
108
|
// elements/helperText/HelperText.tsx
|
109
109
|
var import_react2 = __toESM(require("react"));
|
110
|
-
var HelperText = ({
|
111
|
-
helperText
|
112
|
-
}) => /* @__PURE__ */ import_react2.default.createElement(
|
110
|
+
var HelperText = ({ helperText }) => /* @__PURE__ */ import_react2.default.createElement(
|
113
111
|
"p",
|
114
112
|
{
|
115
113
|
className: cn(
|
@@ -160,38 +158,31 @@ var Tooltip = ({
|
|
160
158
|
delayDuration = 300,
|
161
159
|
...props
|
162
160
|
}) => {
|
163
|
-
return /* @__PURE__ */ import_react3.default.createElement(
|
164
|
-
TooltipPrimitive.
|
161
|
+
return /* @__PURE__ */ import_react3.default.createElement(TooltipPrimitive.TooltipProvider, { delayDuration, ...providerProps }, /* @__PURE__ */ import_react3.default.createElement(
|
162
|
+
TooltipPrimitive.Root,
|
165
163
|
{
|
166
|
-
|
167
|
-
|
164
|
+
open: !disabled && open,
|
165
|
+
defaultOpen,
|
166
|
+
onOpenChange,
|
167
|
+
...props
|
168
168
|
},
|
169
|
+
/* @__PURE__ */ import_react3.default.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
|
169
170
|
/* @__PURE__ */ import_react3.default.createElement(
|
170
|
-
|
171
|
+
TooltipContent,
|
171
172
|
{
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
...
|
173
|
+
size,
|
174
|
+
side,
|
175
|
+
align: "center",
|
176
|
+
...contentProps,
|
177
|
+
style: {
|
178
|
+
...contentProps == null ? void 0 : contentProps.style,
|
179
|
+
maxWidth: "var(--radix-tooltip-content-available-width)",
|
180
|
+
maxHeight: "var(--radix-tooltip-content-available-height)"
|
181
|
+
}
|
176
182
|
},
|
177
|
-
|
178
|
-
/* @__PURE__ */ import_react3.default.createElement(
|
179
|
-
TooltipContent,
|
180
|
-
{
|
181
|
-
size,
|
182
|
-
side,
|
183
|
-
align: "center",
|
184
|
-
...contentProps,
|
185
|
-
style: {
|
186
|
-
...contentProps == null ? void 0 : contentProps.style,
|
187
|
-
maxWidth: "var(--radix-tooltip-content-available-width)",
|
188
|
-
maxHeight: "var(--radix-tooltip-content-available-height)"
|
189
|
-
}
|
190
|
-
},
|
191
|
-
content
|
192
|
-
)
|
183
|
+
content
|
193
184
|
)
|
194
|
-
);
|
185
|
+
));
|
195
186
|
};
|
196
187
|
|
197
188
|
// elements/label/Label.tsx
|
@@ -283,10 +274,7 @@ var ColorPicker = ({
|
|
283
274
|
props.handleChange(e);
|
284
275
|
}
|
285
276
|
},
|
286
|
-
className: cn(
|
287
|
-
"hawa-mt-0 hawa-h-[38px] hawa-opacity-0",
|
288
|
-
props.colorPickerClassNames
|
289
|
-
),
|
277
|
+
className: cn("hawa-mt-0 hawa-h-[38px] hawa-opacity-0", props.colorPickerClassNames),
|
290
278
|
...colorPickerProps
|
291
279
|
}
|
292
280
|
)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/colorPicker/index.ts","../../elements/colorPicker/ColorPicker.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["export * from \"./ColorPicker\";","import React, {\n useState,\n FC,\n ChangeEvent,\n InputHTMLAttributes,\n useEffect,\n FormEvent,\n} from \"react\";\n\nimport { calculateLuminance, cn, getTextColor } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\ntype ColorPickerTypes = {\n label?: string;\n id?: string;\n isLoading?: boolean;\n labelProps?: LabelProps;\n helperText?: any;\n forceHideHelperText?: boolean;\n /** Boolean to enable/disable editing the input field and using it as a text field */\n preview?: boolean;\n /** The hex code for the color */\n color?: any;\n /** Fires everytime the color changes */\n handleChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n colorPickerClassNames?: string;\n colorTextClassNames?: string;\n colorPickerProps?: InputHTMLAttributes<HTMLInputElement>;\n textInputProps?: InputHTMLAttributes<HTMLInputElement>;\n containerProps?: InputHTMLAttributes<HTMLDivElement>;\n};\n\nexport const ColorPicker: FC<ColorPickerTypes> = ({\n containerProps,\n colorPickerProps,\n textInputProps,\n labelProps,\n forceHideHelperText,\n isLoading,\n preview = false,\n ...props\n}) => {\n const [selectedColor, setSelectedColor] = useState(props.color);\n\n useEffect(() => {\n if (selectedColor && selectedColor[0] !== \"#\") {\n setSelectedColor(`#${selectedColor}`);\n }\n }, [selectedColor]);\n\n const handleTextInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputElement = e.target as HTMLInputElement;\n let inputColor = inputElement.value;\n\n if (inputColor[0] !== \"#\") {\n // Prepend a hash (#) to the input value\n inputColor = `#${inputColor}`;\n // inputElement.value = inputColor;\n }\n // Remove any non-alphanumeric characters except the hash (#)\n const sanitizedInput = inputColor.replace(/[^a-fA-F0-9#]/g, \"\");\n\n setSelectedColor(sanitizedInput);\n\n if (props.handleChange) {\n props.handleChange(e); // Pass the original event\n }\n };\n\n return (\n <div className=\"hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {isLoading ? (\n <Skeleton style={{ height: 40, width: 148 }} />\n ) : (\n <div dir=\"ltr\" className=\"hawa-flex hawa-w-full hawa-flex-row\">\n <div\n style={{ height: 40, backgroundColor: selectedColor }}\n className=\"hawa-rounded-bl-lg hawa-rounded-tl-lg hawa-border\"\n >\n <input\n disabled={preview}\n type=\"color\"\n value={selectedColor}\n onChange={(e) => {\n setSelectedColor(e.target.value);\n if (props.handleChange) {\n props.handleChange(e); //TODO: perhaps change this to onChange\n }\n }}\n className={cn(\n \"hawa-mt-0 hawa-h-[38px] hawa-opacity-0\",\n props.colorPickerClassNames,\n )}\n {...colorPickerProps}\n />\n </div>\n <div className=\"hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0\">\n <input\n disabled={preview}\n maxLength={7}\n type=\"text\"\n onInput={handleTextInputChange}\n value={selectedColor}\n className={cn(\n \"hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all\",\n \"hawa-border hawa-border-l-0 hawa-border-l-transparent placeholder:hawa-text-muted-foreground\",\n // \"hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none\"\n )}\n style={{\n backgroundColor: preview\n ? selectedColor\n : \"hsl(var(--background))\",\n color: preview\n ? calculateLuminance(selectedColor) > 0.5\n ? \"black\"\n : \"white\"\n : \"\",\n }}\n // 0.179\n {...textInputProps}\n />\n </div>\n </div>\n )}\n\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n </div>\n );\n};\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 as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\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 const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\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 = ({\n helperText,\n}: {\n helperText?: string | React.ReactNode;\n}) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\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.TooltipProps;\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":["import_react","React","import_react","React","React","import_react","React","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/colorPicker/index.ts","../../elements/colorPicker/ColorPicker.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["export * from \"./ColorPicker\";\n","import React, { useState, FC, ChangeEvent, InputHTMLAttributes, useEffect, FormEvent } from \"react\";\n\nimport { calculateLuminance, cn, getTextColor } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\ntype ColorPickerTypes = {\n label?: string;\n id?: string;\n isLoading?: boolean;\n labelProps?: LabelProps;\n helperText?: any;\n forceHideHelperText?: boolean;\n /** Boolean to enable/disable editing the input field and using it as a text field */\n preview?: boolean;\n /** The hex code for the color */\n color?: any;\n /** Fires everytime the color changes */\n handleChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n colorPickerClassNames?: string;\n colorTextClassNames?: string;\n colorPickerProps?: InputHTMLAttributes<HTMLInputElement>;\n textInputProps?: InputHTMLAttributes<HTMLInputElement>;\n containerProps?: InputHTMLAttributes<HTMLDivElement>;\n};\n\nexport const ColorPicker: FC<ColorPickerTypes> = ({\n containerProps,\n colorPickerProps,\n textInputProps,\n labelProps,\n forceHideHelperText,\n isLoading,\n preview = false,\n ...props\n}) => {\n const [selectedColor, setSelectedColor] = useState(props.color);\n\n useEffect(() => {\n if (selectedColor && selectedColor[0] !== \"#\") {\n setSelectedColor(`#${selectedColor}`);\n }\n }, [selectedColor]);\n\n const handleTextInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputElement = e.target as HTMLInputElement;\n let inputColor = inputElement.value;\n\n if (inputColor[0] !== \"#\") {\n // Prepend a hash (#) to the input value\n inputColor = `#${inputColor}`;\n // inputElement.value = inputColor;\n }\n // Remove any non-alphanumeric characters except the hash (#)\n const sanitizedInput = inputColor.replace(/[^a-fA-F0-9#]/g, \"\");\n\n setSelectedColor(sanitizedInput);\n\n if (props.handleChange) {\n props.handleChange(e); // Pass the original event\n }\n };\n\n return (\n <div className=\"hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {isLoading ? (\n <Skeleton style={{ height: 40, width: 148 }} />\n ) : (\n <div dir=\"ltr\" className=\"hawa-flex hawa-w-full hawa-flex-row\">\n <div\n style={{ height: 40, backgroundColor: selectedColor }}\n className=\"hawa-rounded-bl-lg hawa-rounded-tl-lg hawa-border\"\n >\n <input\n disabled={preview}\n type=\"color\"\n value={selectedColor}\n onChange={(e) => {\n setSelectedColor(e.target.value);\n if (props.handleChange) {\n props.handleChange(e); //TODO: perhaps change this to onChange\n }\n }}\n className={cn(\"hawa-mt-0 hawa-h-[38px] hawa-opacity-0\", props.colorPickerClassNames)}\n {...colorPickerProps}\n />\n </div>\n <div className=\"hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0\">\n <input\n disabled={preview}\n maxLength={7}\n type=\"text\"\n onInput={handleTextInputChange}\n value={selectedColor}\n className={cn(\n \"hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all\",\n \"hawa-border hawa-border-l-0 hawa-border-l-transparent placeholder:hawa-text-muted-foreground\",\n // \"hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none\"\n )}\n style={{\n backgroundColor: preview ? selectedColor : \"hsl(var(--background))\",\n color: preview ? (calculateLuminance(selectedColor) > 0.5 ? \"black\" : \"white\") : \"\",\n }}\n // 0.179\n {...textInputProps}\n />\n </div>\n </div>\n )}\n\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n </div>\n );\n};\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(sanitizedHex);\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 as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\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 const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\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?: string | React.ReactNode }) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\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.TooltipProps;\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 delayDuration={delayDuration} {...providerProps}>\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>{children}</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":["import_react","React","import_react","React","React","import_react","React","React"]}
|
@@ -1,10 +1,7 @@
|
|
1
1
|
"use client";
|
2
2
|
|
3
3
|
// elements/colorPicker/ColorPicker.tsx
|
4
|
-
import React5, {
|
5
|
-
useState,
|
6
|
-
useEffect
|
7
|
-
} from "react";
|
4
|
+
import React5, { useState, useEffect } from "react";
|
8
5
|
|
9
6
|
// util/index.ts
|
10
7
|
import { clsx } from "clsx";
|
@@ -75,9 +72,7 @@ function Skeleton({
|
|
75
72
|
|
76
73
|
// elements/helperText/HelperText.tsx
|
77
74
|
import React2 from "react";
|
78
|
-
var HelperText = ({
|
79
|
-
helperText
|
80
|
-
}) => /* @__PURE__ */ React2.createElement(
|
75
|
+
var HelperText = ({ helperText }) => /* @__PURE__ */ React2.createElement(
|
81
76
|
"p",
|
82
77
|
{
|
83
78
|
className: cn(
|
@@ -128,38 +123,31 @@ var Tooltip = ({
|
|
128
123
|
delayDuration = 300,
|
129
124
|
...props
|
130
125
|
}) => {
|
131
|
-
return /* @__PURE__ */ React3.createElement(
|
132
|
-
TooltipPrimitive.
|
126
|
+
return /* @__PURE__ */ React3.createElement(TooltipPrimitive.TooltipProvider, { delayDuration, ...providerProps }, /* @__PURE__ */ React3.createElement(
|
127
|
+
TooltipPrimitive.Root,
|
133
128
|
{
|
134
|
-
|
135
|
-
|
129
|
+
open: !disabled && open,
|
130
|
+
defaultOpen,
|
131
|
+
onOpenChange,
|
132
|
+
...props
|
136
133
|
},
|
134
|
+
/* @__PURE__ */ React3.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
|
137
135
|
/* @__PURE__ */ React3.createElement(
|
138
|
-
|
136
|
+
TooltipContent,
|
139
137
|
{
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
...
|
138
|
+
size,
|
139
|
+
side,
|
140
|
+
align: "center",
|
141
|
+
...contentProps,
|
142
|
+
style: {
|
143
|
+
...contentProps == null ? void 0 : contentProps.style,
|
144
|
+
maxWidth: "var(--radix-tooltip-content-available-width)",
|
145
|
+
maxHeight: "var(--radix-tooltip-content-available-height)"
|
146
|
+
}
|
144
147
|
},
|
145
|
-
|
146
|
-
/* @__PURE__ */ React3.createElement(
|
147
|
-
TooltipContent,
|
148
|
-
{
|
149
|
-
size,
|
150
|
-
side,
|
151
|
-
align: "center",
|
152
|
-
...contentProps,
|
153
|
-
style: {
|
154
|
-
...contentProps == null ? void 0 : contentProps.style,
|
155
|
-
maxWidth: "var(--radix-tooltip-content-available-width)",
|
156
|
-
maxHeight: "var(--radix-tooltip-content-available-height)"
|
157
|
-
}
|
158
|
-
},
|
159
|
-
content
|
160
|
-
)
|
148
|
+
content
|
161
149
|
)
|
162
|
-
);
|
150
|
+
));
|
163
151
|
};
|
164
152
|
|
165
153
|
// elements/label/Label.tsx
|
@@ -251,10 +239,7 @@ var ColorPicker = ({
|
|
251
239
|
props.handleChange(e);
|
252
240
|
}
|
253
241
|
},
|
254
|
-
className: cn(
|
255
|
-
"hawa-mt-0 hawa-h-[38px] hawa-opacity-0",
|
256
|
-
props.colorPickerClassNames
|
257
|
-
),
|
242
|
+
className: cn("hawa-mt-0 hawa-h-[38px] hawa-opacity-0", props.colorPickerClassNames),
|
258
243
|
...colorPickerProps
|
259
244
|
}
|
260
245
|
)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/colorPicker/ColorPicker.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n useState,\n FC,\n ChangeEvent,\n InputHTMLAttributes,\n useEffect,\n FormEvent,\n} from \"react\";\n\nimport { calculateLuminance, cn, getTextColor } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\ntype ColorPickerTypes = {\n label?: string;\n id?: string;\n isLoading?: boolean;\n labelProps?: LabelProps;\n helperText?: any;\n forceHideHelperText?: boolean;\n /** Boolean to enable/disable editing the input field and using it as a text field */\n preview?: boolean;\n /** The hex code for the color */\n color?: any;\n /** Fires everytime the color changes */\n handleChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n colorPickerClassNames?: string;\n colorTextClassNames?: string;\n colorPickerProps?: InputHTMLAttributes<HTMLInputElement>;\n textInputProps?: InputHTMLAttributes<HTMLInputElement>;\n containerProps?: InputHTMLAttributes<HTMLDivElement>;\n};\n\nexport const ColorPicker: FC<ColorPickerTypes> = ({\n containerProps,\n colorPickerProps,\n textInputProps,\n labelProps,\n forceHideHelperText,\n isLoading,\n preview = false,\n ...props\n}) => {\n const [selectedColor, setSelectedColor] = useState(props.color);\n\n useEffect(() => {\n if (selectedColor && selectedColor[0] !== \"#\") {\n setSelectedColor(`#${selectedColor}`);\n }\n }, [selectedColor]);\n\n const handleTextInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputElement = e.target as HTMLInputElement;\n let inputColor = inputElement.value;\n\n if (inputColor[0] !== \"#\") {\n // Prepend a hash (#) to the input value\n inputColor = `#${inputColor}`;\n // inputElement.value = inputColor;\n }\n // Remove any non-alphanumeric characters except the hash (#)\n const sanitizedInput = inputColor.replace(/[^a-fA-F0-9#]/g, \"\");\n\n setSelectedColor(sanitizedInput);\n\n if (props.handleChange) {\n props.handleChange(e); // Pass the original event\n }\n };\n\n return (\n <div className=\"hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {isLoading ? (\n <Skeleton style={{ height: 40, width: 148 }} />\n ) : (\n <div dir=\"ltr\" className=\"hawa-flex hawa-w-full hawa-flex-row\">\n <div\n style={{ height: 40, backgroundColor: selectedColor }}\n className=\"hawa-rounded-bl-lg hawa-rounded-tl-lg hawa-border\"\n >\n <input\n disabled={preview}\n type=\"color\"\n value={selectedColor}\n onChange={(e) => {\n setSelectedColor(e.target.value);\n if (props.handleChange) {\n props.handleChange(e); //TODO: perhaps change this to onChange\n }\n }}\n className={cn(\n \"hawa-mt-0 hawa-h-[38px] hawa-opacity-0\",\n props.colorPickerClassNames,\n )}\n {...colorPickerProps}\n />\n </div>\n <div className=\"hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0\">\n <input\n disabled={preview}\n maxLength={7}\n type=\"text\"\n onInput={handleTextInputChange}\n value={selectedColor}\n className={cn(\n \"hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all\",\n \"hawa-border hawa-border-l-0 hawa-border-l-transparent placeholder:hawa-text-muted-foreground\",\n // \"hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none\"\n )}\n style={{\n backgroundColor: preview\n ? selectedColor\n : \"hsl(var(--background))\",\n color: preview\n ? calculateLuminance(selectedColor) > 0.5\n ? \"black\"\n : \"white\"\n : \"\",\n }}\n // 0.179\n {...textInputProps}\n />\n </div>\n </div>\n )}\n\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n </div>\n );\n};\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 as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\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 const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\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 = ({\n helperText,\n}: {\n helperText?: string | React.ReactNode;\n}) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\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.TooltipProps;\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":";;;AAAA,OAAOA;AAAA,EACL;AAAA,EAIA;AAAA,OAEK;;;ACPP,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;AA6EA,IAAM,aAAa,CAAC,UAAe;AACjC,MAAI,MAAM,WAAW,GAAG,GAAG;AAEzB,QAAI,IAAI,SAAS,MAAM,MAAM,GAAG,CAAC,GAAG,EAAE;AACtC,QAAI,IAAI,SAAS,MAAM,MAAM,GAAG,CAAC,GAAG,EAAE;AACtC,QAAI,IAAI,SAAS,MAAM,MAAM,GAAG,CAAC,GAAG,EAAE;AACtC,WAAO,CAAC,GAAG,GAAG,CAAC;AAAA,EACjB,WAAW,MAAM,WAAW,KAAK,GAAG;AAElC,WAAO,MAAM,MAAM,MAAM,EAAE,IAAI,MAAM;AAAA,EACvC;AAEA,SAAO,CAAC,KAAK,KAAK,GAAG;AACvB;AACO,IAAM,qBAAqB,CAAC,UAAe;AAhGlD;AAiGE,QAAM,CAAC,GAAG,GAAG,CAAC,KAAI,gBAAW,KAAK,MAAhB,mBAAmB,IAAI,CAAC,MAAW;AACnD,SAAK;AACL,WAAO,KAAK,UAAU,IAAI,UAAU,IAAI,SAAS,UAAU;AAAA,EAC7D;AACA,SAAO,SAAS,IAAI,SAAS,IAAI,SAAS;AAC5C;;;ACtGA,OAAO,WAAW;AAYlB,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,KAAK;AAAA,EACL,GAAG;AACL,GAAkB;AAChB,QAAM,kBAAkB;AAAA,IACtB,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SACE;AAAA,EACJ;AACA,QAAM,YAAY;AAAA,IAChB,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAEA,QAAM,WAAW;AAAA,IACf,KAAK;AAAA,IACL,OAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,gBAAgB,SAAS;AAAA,QACzB,WAAW;AAAA,QACX,QAAQ,UAAU,IAAI;AAAA,QACtB,SAAS,EAAE;AAAA,QACX;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,IAEH,WAAW;AAAA,EACd;AAEJ;;;ACpDA,OAAOC,YAAW;AAIX,IAAM,aAAa,CAAC;AAAA,EACzB;AACF,MAGE,gBAAAC,OAAA;AAAA,EAAC;AAAA;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA,aAAa,8BAA8B;AAAA,IAC7C;AAAA;AAAA,EAEC;AACH;;;AChBF,YAAYC,YAAW;;;ACAvB,OAAOC,YAAW;AAElB,YAAY,sBAAsB;AAKlC,IAAM,iBAAiBC,OAAM,WAK3B,CAAC,EAAE,WAAW,aAAa,GAAG,OAAO,WAAW,GAAG,MAAM,GAAG,QAC5D,gBAAAA,OAAA;AAAA,EAAkB;AAAA,EAAjB;AAAA,IACC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,QACE,gBAAgB,SAAS;AAAA,QACzB,gBAAgB,SAAS;AAAA,MAC3B;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,eAAe,cAA+B,yBAAQ;AAEtD,IAAM,eAAeA,OAAM,WAGzB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B,gBAAAA,OAAA,cAAkB,wBAAjB,EAAuB,KAAU,WAAW,GAAG,SAAS,GAAI,GAAG,OAAO,CACxE;AACD,aAAa,cAA+B,uBAAM;AA0BlD,IAAM,UAAiD,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,GAAG;AACL,MAAM;AACJ,SACE,gBAAAA,OAAA;AAAA,IAAkB;AAAA,IAAjB;AAAA,MACC;AAAA,MACC,GAAG;AAAA;AAAA,IAEJ,gBAAAA,OAAA;AAAA,MAAkB;AAAA,MAAjB;AAAA,QACC,MAAM,CAAC,YAAY;AAAA,QACnB;AAAA,QACA;AAAA,QACC,GAAG;AAAA;AAAA,MAEJ,gBAAAA,OAAA,cAAkB,0BAAjB,EAA0B,GAAG,gBAC3B,QACH;AAAA,MACA,gBAAAA,OAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,OAAM;AAAA,UACL,GAAG;AAAA,UACJ,OAAO;AAAA,YACL,GAAG,6CAAc;AAAA,YACjB,UAAU;AAAA,YACV,WAAW;AAAA,UACb;AAAA;AAAA,QAEC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAEJ;;;AD3FA,IAAM,QAAc,kBAGlB,CAAC,EAAE,WAAW,MAAM,UAAU,UAAU,UAAU,GAAG,MAAM,GAAG,QAC9D,qCAAC,SAAI,WAAU,8EACb;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AAAA,EAEH;AAAA,EACA,YAAY,qCAAC,UAAK,WAAU,mCAAgC,GAAC;AAChE,GACC,QACC;AAAA,EAAC;AAAA;AAAA,IACC,SAAS;AAAA,IACT,MAAM;AAAA,IACN,cAAc;AAAA,MACZ,UAAU;AAAA,MACV,SAAS,CAAC,UAAU,MAAM,eAAe;AAAA,IAC3C;AAAA;AAAA,EAEA,qCAAC,aACC;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,gBAAe;AAAA;AAAA,IAEf,qCAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK;AAAA,IAC/B,qCAAC,UAAK,GAAE,wCAAuC;AAAA,IAC/C,qCAAC,UAAK,GAAE,cAAa;AAAA,EACvB,CACF;AACF,CAEJ,CACD;AAED,MAAM,cAAc;;;AJzBb,IAAM,cAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,MAAM,KAAK;AAE9D,YAAU,MAAM;AACd,QAAI,iBAAiB,cAAc,CAAC,MAAM,KAAK;AAC7C,uBAAiB,IAAI,aAAa,EAAE;AAAA,IACtC;AAAA,EACF,GAAG,CAAC,aAAa,CAAC;AAElB,QAAM,wBAAwB,CAAC,MAAqC;AAClE,UAAM,eAAe,EAAE;AACvB,QAAI,aAAa,aAAa;AAE9B,QAAI,WAAW,CAAC,MAAM,KAAK;AAEzB,mBAAa,IAAI,UAAU;AAAA,IAE7B;AAEA,UAAM,iBAAiB,WAAW,QAAQ,kBAAkB,EAAE;AAE9D,qBAAiB,cAAc;AAE/B,QAAI,MAAM,cAAc;AACtB,YAAM,aAAa,CAAC;AAAA,IACtB;AAAA,EACF;AAEA,SACE,gBAAAC,OAAA,cAAC,SAAI,WAAU,mDACZ,MAAM,SAAS,gBAAAA,OAAA,cAAC,SAAO,GAAG,cAAa,MAAM,KAAM,GACnD,YACC,gBAAAA,OAAA,cAAC,YAAS,OAAO,EAAE,QAAQ,IAAI,OAAO,IAAI,GAAG,IAE7C,gBAAAA,OAAA,cAAC,SAAI,KAAI,OAAM,WAAU,yCACvB,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,EAAE,QAAQ,IAAI,iBAAiB,cAAc;AAAA,MACpD,WAAU;AAAA;AAAA,IAEV,gBAAAA,OAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,MAAM;AACf,2BAAiB,EAAE,OAAO,KAAK;AAC/B,cAAI,MAAM,cAAc;AACtB,kBAAM,aAAa,CAAC;AAAA,UACtB;AAAA,QACF;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,MAAM;AAAA,QACR;AAAA,QACC,GAAG;AAAA;AAAA,IACN;AAAA,EACF,GACA,gBAAAA,OAAA,cAAC,SAAI,WAAU,qGACb,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAW;AAAA,MACX,MAAK;AAAA,MACL,SAAS;AAAA,MACT,OAAO;AAAA,MACP,WAAW;AAAA,QACT;AAAA,QACA;AAAA;AAAA,MAEF;AAAA,MACA,OAAO;AAAA,QACL,iBAAiB,UACb,gBACA;AAAA,QACJ,OAAO,UACH,mBAAmB,aAAa,IAAI,MAClC,UACA,UACF;AAAA,MACN;AAAA,MAEC,GAAG;AAAA;AAAA,EACN,CACF,CACF,GAGD,CAAC,uBAAuB,gBAAAA,OAAA,cAAC,cAAW,YAAY,MAAM,YAAY,CACrE;AAEJ;","names":["React","React","React","React","React","React","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/colorPicker/ColorPicker.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { useState, FC, ChangeEvent, InputHTMLAttributes, useEffect, FormEvent } from \"react\";\n\nimport { calculateLuminance, cn, getTextColor } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\ntype ColorPickerTypes = {\n label?: string;\n id?: string;\n isLoading?: boolean;\n labelProps?: LabelProps;\n helperText?: any;\n forceHideHelperText?: boolean;\n /** Boolean to enable/disable editing the input field and using it as a text field */\n preview?: boolean;\n /** The hex code for the color */\n color?: any;\n /** Fires everytime the color changes */\n handleChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n colorPickerClassNames?: string;\n colorTextClassNames?: string;\n colorPickerProps?: InputHTMLAttributes<HTMLInputElement>;\n textInputProps?: InputHTMLAttributes<HTMLInputElement>;\n containerProps?: InputHTMLAttributes<HTMLDivElement>;\n};\n\nexport const ColorPicker: FC<ColorPickerTypes> = ({\n containerProps,\n colorPickerProps,\n textInputProps,\n labelProps,\n forceHideHelperText,\n isLoading,\n preview = false,\n ...props\n}) => {\n const [selectedColor, setSelectedColor] = useState(props.color);\n\n useEffect(() => {\n if (selectedColor && selectedColor[0] !== \"#\") {\n setSelectedColor(`#${selectedColor}`);\n }\n }, [selectedColor]);\n\n const handleTextInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputElement = e.target as HTMLInputElement;\n let inputColor = inputElement.value;\n\n if (inputColor[0] !== \"#\") {\n // Prepend a hash (#) to the input value\n inputColor = `#${inputColor}`;\n // inputElement.value = inputColor;\n }\n // Remove any non-alphanumeric characters except the hash (#)\n const sanitizedInput = inputColor.replace(/[^a-fA-F0-9#]/g, \"\");\n\n setSelectedColor(sanitizedInput);\n\n if (props.handleChange) {\n props.handleChange(e); // Pass the original event\n }\n };\n\n return (\n <div className=\"hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {isLoading ? (\n <Skeleton style={{ height: 40, width: 148 }} />\n ) : (\n <div dir=\"ltr\" className=\"hawa-flex hawa-w-full hawa-flex-row\">\n <div\n style={{ height: 40, backgroundColor: selectedColor }}\n className=\"hawa-rounded-bl-lg hawa-rounded-tl-lg hawa-border\"\n >\n <input\n disabled={preview}\n type=\"color\"\n value={selectedColor}\n onChange={(e) => {\n setSelectedColor(e.target.value);\n if (props.handleChange) {\n props.handleChange(e); //TODO: perhaps change this to onChange\n }\n }}\n className={cn(\"hawa-mt-0 hawa-h-[38px] hawa-opacity-0\", props.colorPickerClassNames)}\n {...colorPickerProps}\n />\n </div>\n <div className=\"hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0\">\n <input\n disabled={preview}\n maxLength={7}\n type=\"text\"\n onInput={handleTextInputChange}\n value={selectedColor}\n className={cn(\n \"hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all\",\n \"hawa-border hawa-border-l-0 hawa-border-l-transparent placeholder:hawa-text-muted-foreground\",\n // \"hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none\"\n )}\n style={{\n backgroundColor: preview ? selectedColor : \"hsl(var(--background))\",\n color: preview ? (calculateLuminance(selectedColor) > 0.5 ? \"black\" : \"white\") : \"\",\n }}\n // 0.179\n {...textInputProps}\n />\n </div>\n </div>\n )}\n\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n </div>\n );\n};\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(sanitizedHex);\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 as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\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 const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\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?: string | React.ReactNode }) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\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.TooltipProps;\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 delayDuration={delayDuration} {...providerProps}>\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>{children}</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","React"]}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { P as PositionType, D as DirectionType, C as CommandInputProps } from '../index-
|
2
|
+
import { P as PositionType, D as DirectionType, C as CommandInputProps } from '../index-BgNycocQ.mjs';
|
3
3
|
import '@radix-ui/react-dialog';
|
4
4
|
import 'cmdk';
|
5
5
|
|
package/dist/combobox/index.d.ts
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { P as PositionType, D as DirectionType, C as CommandInputProps } from '../index-
|
2
|
+
import { P as PositionType, D as DirectionType, C as CommandInputProps } from '../index-BgNycocQ.js';
|
3
3
|
import '@radix-ui/react-dialog';
|
4
4
|
import 'cmdk';
|
5
5
|
|