@sikka/hawa 0.1.90 → 0.1.92
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/index.d.mts +30 -6
- package/dist/index.d.ts +30 -6
- package/dist/index.js +407 -263
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +82 -27
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +31 -0
- package/package.json +1 -1
- package/src/blocks/AuthForms/AppLanding.tsx +99 -51
- package/src/blocks/AuthForms/ResetPasswordForm.tsx +13 -9
- package/src/elements/Button.tsx +10 -1
- package/src/elements/DropdownMenu.tsx +9 -3
- package/src/elements/Icons.tsx +24 -0
- package/src/elements/Toaster.tsx +1 -3
- package/src/styles.css +31 -0
- package/src/tailwind.css +10 -0
- package/src/translations/ar.json +9 -0
- package/src/translations/en.json +9 -0
package/dist/index.mjs
CHANGED
|
@@ -724,7 +724,8 @@ var buttonVariants = cva2(
|
|
|
724
724
|
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
|
|
725
725
|
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
726
726
|
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
727
|
-
link: "text-primary underline-offset-4 hover:underline"
|
|
727
|
+
link: "text-primary underline-offset-4 hover:underline",
|
|
728
|
+
neoBrutalism: "cursor-pointer transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms] active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active"
|
|
728
729
|
},
|
|
729
730
|
size: {
|
|
730
731
|
default: "h-10 px-4 py-2",
|
|
@@ -754,6 +755,7 @@ var Button = React16.forwardRef(
|
|
|
754
755
|
...props
|
|
755
756
|
}, ref) => {
|
|
756
757
|
const Comp = "button";
|
|
758
|
+
const loadingColor = variant === "outline" || variant === "ghost" || variant === "neoBrutalism" ? "bg-primary" : "bg-primary-foreground";
|
|
757
759
|
return /* @__PURE__ */ React16.createElement(
|
|
758
760
|
Comp,
|
|
759
761
|
{
|
|
@@ -765,7 +767,7 @@ var Button = React16.forwardRef(
|
|
|
765
767
|
HawaLoading,
|
|
766
768
|
{
|
|
767
769
|
design: "dots-pulse",
|
|
768
|
-
color:
|
|
770
|
+
color: loadingColor,
|
|
769
771
|
size: "button"
|
|
770
772
|
}
|
|
771
773
|
) : children
|
|
@@ -1184,7 +1186,9 @@ var DropdownMenu = ({
|
|
|
1184
1186
|
className: "flex flex-row gap-2",
|
|
1185
1187
|
onSelect: () => {
|
|
1186
1188
|
subitem.action();
|
|
1187
|
-
selectCallback
|
|
1189
|
+
if (selectCallback) {
|
|
1190
|
+
selectCallback(subitem.value);
|
|
1191
|
+
}
|
|
1188
1192
|
},
|
|
1189
1193
|
key: subIndex
|
|
1190
1194
|
},
|
|
@@ -1202,9 +1206,13 @@ var DropdownMenu = ({
|
|
|
1202
1206
|
}
|
|
1203
1207
|
if (item.action) {
|
|
1204
1208
|
item.action();
|
|
1205
|
-
selectCallback
|
|
1209
|
+
if (selectCallback) {
|
|
1210
|
+
selectCallback(item.value);
|
|
1211
|
+
}
|
|
1206
1212
|
} else {
|
|
1207
|
-
selectCallback
|
|
1213
|
+
if (selectCallback) {
|
|
1214
|
+
selectCallback(item.value);
|
|
1215
|
+
}
|
|
1208
1216
|
}
|
|
1209
1217
|
},
|
|
1210
1218
|
end: item.end
|
|
@@ -7039,14 +7047,7 @@ function Toaster(props) {
|
|
|
7039
7047
|
const { toasts } = useToast();
|
|
7040
7048
|
let isRTL = props.direction === "rtl";
|
|
7041
7049
|
return /* @__PURE__ */ React68.createElement(ToastProvider, { swipeDirection: isRTL ? "left" : "right" }, toasts.map(function({ id, title, description, action, ...toastProps }) {
|
|
7042
|
-
return /* @__PURE__ */ React68.createElement(Toast, { direction: props.direction, key: id, ...toastProps }, /* @__PURE__ */ React68.createElement(
|
|
7043
|
-
"div",
|
|
7044
|
-
{
|
|
7045
|
-
className: cn("grid gap-1", isRTL ? "text-right" : "text-left")
|
|
7046
|
-
},
|
|
7047
|
-
title && /* @__PURE__ */ React68.createElement(ToastTitle, null, title),
|
|
7048
|
-
description && /* @__PURE__ */ React68.createElement(ToastDescription, null, description)
|
|
7049
|
-
), action, /* @__PURE__ */ React68.createElement(ToastClose, null));
|
|
7050
|
+
return /* @__PURE__ */ React68.createElement(Toast, { direction: props.direction, key: id, ...toastProps }, /* @__PURE__ */ React68.createElement("div", { className: "grid gap-1 text-start" }, title && /* @__PURE__ */ React68.createElement(ToastTitle, null, title), description && /* @__PURE__ */ React68.createElement(ToastDescription, null, description)), action, /* @__PURE__ */ React68.createElement(ToastClose, null));
|
|
7050
7051
|
}), /* @__PURE__ */ React68.createElement(ToastViewport, { className: cn("gap-2", isRTL && "fixed left-0") }));
|
|
7051
7052
|
}
|
|
7052
7053
|
|
|
@@ -9029,6 +9030,28 @@ var Icons = {
|
|
|
9029
9030
|
/* @__PURE__ */ React.createElement("path", { d: "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" }),
|
|
9030
9031
|
/* @__PURE__ */ React.createElement("polyline", { points: "22,6 12,13 2,6" })
|
|
9031
9032
|
),
|
|
9033
|
+
phone: (props) => /* @__PURE__ */ React.createElement(
|
|
9034
|
+
"svg",
|
|
9035
|
+
{
|
|
9036
|
+
stroke: "currentColor",
|
|
9037
|
+
fill: "none",
|
|
9038
|
+
"stroke-width": "2",
|
|
9039
|
+
viewBox: "0 0 24 24",
|
|
9040
|
+
"aria-hidden": "true",
|
|
9041
|
+
height: "1em",
|
|
9042
|
+
width: "1em",
|
|
9043
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
9044
|
+
...props
|
|
9045
|
+
},
|
|
9046
|
+
/* @__PURE__ */ React.createElement(
|
|
9047
|
+
"path",
|
|
9048
|
+
{
|
|
9049
|
+
"stroke-linecap": "round",
|
|
9050
|
+
"stroke-linejoin": "round",
|
|
9051
|
+
d: "M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"
|
|
9052
|
+
}
|
|
9053
|
+
)
|
|
9054
|
+
),
|
|
9032
9055
|
twitter: (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement(
|
|
9033
9056
|
"path",
|
|
9034
9057
|
{
|
|
@@ -9036,6 +9059,7 @@ var Icons = {
|
|
|
9036
9059
|
d: "M21.543 7.104c.015.211.015.423.015.636 0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041 4.93 4.93 0 0 1-4.6-3.42 4.916 4.916 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.887 4.887 0 0 0 2.235.616A4.928 4.928 0 0 1 1.67 3.148a13.98 13.98 0 0 0 10.15 5.144 4.929 4.929 0 0 1 8.39-4.49 9.868 9.868 0 0 0 3.128-1.196 4.941 4.941 0 0 1-2.165 2.724A9.828 9.828 0 0 0 24 4.555a10.019 10.019 0 0 1-2.457 2.549z"
|
|
9037
9060
|
}
|
|
9038
9061
|
)),
|
|
9062
|
+
microsoft: (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M7.462 0H0v7.19h7.462V0zM16 0H8.538v7.19H16V0zM7.462 8.211H0V16h7.462V8.211zm8.538 0H8.538V16H16V8.211z" })),
|
|
9039
9063
|
gitHub: (props) => /* @__PURE__ */ React.createElement("svg", { viewBox: "0 0 438.549 438.549", ...props }, /* @__PURE__ */ React.createElement(
|
|
9040
9064
|
"path",
|
|
9041
9065
|
{
|
|
@@ -9133,38 +9157,69 @@ var Icons = {
|
|
|
9133
9157
|
|
|
9134
9158
|
// src/blocks/AuthForms/AppLanding.tsx
|
|
9135
9159
|
var AppLanding = (props) => {
|
|
9136
|
-
return /* @__PURE__ */ React85.createElement("div",
|
|
9160
|
+
return /* @__PURE__ */ React85.createElement("div", { dir: props.direction }, /* @__PURE__ */ React85.createElement(Card, null, /* @__PURE__ */ React85.createElement(CardContent, { headless: true, className: "flex flex-col gap-6" }, props.viaGoogle && /* @__PURE__ */ React85.createElement(
|
|
9137
9161
|
Button,
|
|
9138
9162
|
{
|
|
9139
9163
|
className: "flex flex-row items-center gap-2",
|
|
9140
|
-
variant: "outline"
|
|
9164
|
+
variant: "outline",
|
|
9165
|
+
onClick: props.handleGoogle
|
|
9141
9166
|
},
|
|
9142
9167
|
/* @__PURE__ */ React85.createElement(Icons.google, { className: "h-4 w-4" }),
|
|
9143
|
-
"Continue With Google"
|
|
9144
|
-
), /* @__PURE__ */ React85.createElement(
|
|
9168
|
+
props.texts?.continueWithGoogle ?? "Continue With Google"
|
|
9169
|
+
), props.viaGithub && /* @__PURE__ */ React85.createElement(
|
|
9145
9170
|
Button,
|
|
9146
9171
|
{
|
|
9147
9172
|
className: "flex flex-row items-center gap-2",
|
|
9148
|
-
variant: "outline"
|
|
9173
|
+
variant: "outline",
|
|
9174
|
+
onClick: props.handleGithub
|
|
9175
|
+
},
|
|
9176
|
+
/* @__PURE__ */ React85.createElement(Icons.gitHub, { className: "h-4 w-4" }),
|
|
9177
|
+
props.texts?.continueWithGithub ?? "Continue With Github"
|
|
9178
|
+
), props.viaTwitter && /* @__PURE__ */ React85.createElement(
|
|
9179
|
+
Button,
|
|
9180
|
+
{
|
|
9181
|
+
className: "flex flex-row items-center gap-2",
|
|
9182
|
+
variant: "outline",
|
|
9183
|
+
onClick: props.handleTwitter
|
|
9149
9184
|
},
|
|
9150
9185
|
/* @__PURE__ */ React85.createElement(Icons.twitter, { className: "h-4 w-4" }),
|
|
9151
|
-
"Continue With Twitter"
|
|
9152
|
-
), /* @__PURE__ */ React85.createElement(
|
|
9186
|
+
props.texts?.continueWithTwitter ?? "Continue With Twitter"
|
|
9187
|
+
), props.viaApple && /* @__PURE__ */ React85.createElement(
|
|
9153
9188
|
Button,
|
|
9154
9189
|
{
|
|
9155
9190
|
className: "flex flex-row items-center gap-2",
|
|
9156
|
-
variant: "outline"
|
|
9191
|
+
variant: "outline",
|
|
9192
|
+
onClick: props.handleApple
|
|
9157
9193
|
},
|
|
9158
9194
|
/* @__PURE__ */ React85.createElement(Icons.apple, { className: "h-4 w-4" }),
|
|
9159
|
-
"Continue With Apple"
|
|
9160
|
-
), /* @__PURE__ */ React85.createElement(
|
|
9195
|
+
props.texts?.continueWithApple ?? "Continue With Apple"
|
|
9196
|
+
), props.viaMicrosoft && /* @__PURE__ */ React85.createElement(
|
|
9161
9197
|
Button,
|
|
9162
9198
|
{
|
|
9163
9199
|
className: "flex flex-row items-center gap-2",
|
|
9164
|
-
variant: "outline"
|
|
9200
|
+
variant: "outline",
|
|
9201
|
+
onClick: props.handleMicrosoft
|
|
9202
|
+
},
|
|
9203
|
+
/* @__PURE__ */ React85.createElement(Icons.microsoft, { className: "h-4 w-4" }),
|
|
9204
|
+
props.texts?.continueWithMicrosoft ?? "Continue With Microsoft"
|
|
9205
|
+
), props.viaEmail && /* @__PURE__ */ React85.createElement(
|
|
9206
|
+
Button,
|
|
9207
|
+
{
|
|
9208
|
+
className: "flex flex-row items-center gap-2",
|
|
9209
|
+
variant: "outline",
|
|
9210
|
+
onClick: props.handleEmail
|
|
9165
9211
|
},
|
|
9166
9212
|
/* @__PURE__ */ React85.createElement(Icons.mail, { className: "h-4 w-4" }),
|
|
9167
|
-
"Continue With Email"
|
|
9213
|
+
props.texts?.continueWithEmail ?? "Continue With Email"
|
|
9214
|
+
), props.viaPhone && /* @__PURE__ */ React85.createElement(
|
|
9215
|
+
Button,
|
|
9216
|
+
{
|
|
9217
|
+
className: "flex flex-row items-center gap-2",
|
|
9218
|
+
variant: "outline",
|
|
9219
|
+
onClick: props.handlePhone
|
|
9220
|
+
},
|
|
9221
|
+
/* @__PURE__ */ React85.createElement(Icons.phone, { className: "h-4 w-4" }),
|
|
9222
|
+
props.texts?.continueWithPhone ?? "Continue With Phone"
|
|
9168
9223
|
), !props.withoutSignUp && /* @__PURE__ */ React85.createElement("div", { className: "p-3 text-center text-sm font-normal dark:text-gray-300" }, props.texts.newUserText, " ", /* @__PURE__ */ React85.createElement(
|
|
9169
9224
|
"span",
|
|
9170
9225
|
{
|
|
@@ -9791,7 +9846,7 @@ var ResetPasswordForm = (props) => {
|
|
|
9791
9846
|
register,
|
|
9792
9847
|
control
|
|
9793
9848
|
} = methods;
|
|
9794
|
-
return /* @__PURE__ */ React90.createElement(Card,
|
|
9849
|
+
return /* @__PURE__ */ React90.createElement(Card, { dir: props.direction }, !props.sent ? /* @__PURE__ */ React90.createElement(React90.Fragment, null, !props.headless && /* @__PURE__ */ React90.createElement(CardHeader, null, /* @__PURE__ */ React90.createElement(CardTitle, null, "Reset Password"), /* @__PURE__ */ React90.createElement(CardDescription, null, "Enter your email to reset your account password")), /* @__PURE__ */ React90.createElement("form", { onSubmit: handleSubmit(props.handleResetPassword) }, /* @__PURE__ */ React90.createElement(CardContent, { headless: props.headless }, /* @__PURE__ */ React90.createElement(
|
|
9795
9850
|
Controller6,
|
|
9796
9851
|
{
|
|
9797
9852
|
control,
|
|
@@ -9816,7 +9871,7 @@ var ResetPasswordForm = (props) => {
|
|
|
9816
9871
|
}
|
|
9817
9872
|
}
|
|
9818
9873
|
}
|
|
9819
|
-
), /* @__PURE__ */ React90.createElement("div", { className: "
|
|
9874
|
+
), /* @__PURE__ */ React90.createElement("div", { className: "pb-2 text-start text-sm dark:text-gray-300" }, props.texts?.dontHaveAccount ?? "Don't have an account? ", /* @__PURE__ */ React90.createElement(
|
|
9820
9875
|
"span",
|
|
9821
9876
|
{
|
|
9822
9877
|
onClick: props.handleRouteToSignUp,
|