@pactor-app/ui 1.40.0 → 1.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-MGBEGZCH.js → chunk-UWKDHCV5.js} +154 -50
- package/dist/components/index.cjs +154 -50
- package/dist/components/index.d.cts +17 -5
- package/dist/components/index.d.ts +17 -5
- package/dist/components/index.js +1 -1
- package/dist/index.cjs +154 -50
- package/dist/index.js +1 -1
- package/package.json +6 -6
- package/styles.css +3 -0
|
@@ -13556,9 +13556,42 @@ function DefaultIllustration({ className }) {
|
|
|
13556
13556
|
"aria-hidden": "true",
|
|
13557
13557
|
className: cn("text-primary", className),
|
|
13558
13558
|
children: [
|
|
13559
|
-
/* @__PURE__ */ jsx159(
|
|
13560
|
-
|
|
13561
|
-
|
|
13559
|
+
/* @__PURE__ */ jsx159(
|
|
13560
|
+
"rect",
|
|
13561
|
+
{
|
|
13562
|
+
x: "24",
|
|
13563
|
+
y: "96",
|
|
13564
|
+
width: "88",
|
|
13565
|
+
height: "60",
|
|
13566
|
+
rx: "10",
|
|
13567
|
+
fill: "currentColor",
|
|
13568
|
+
opacity: "0.16"
|
|
13569
|
+
}
|
|
13570
|
+
),
|
|
13571
|
+
/* @__PURE__ */ jsx159(
|
|
13572
|
+
"rect",
|
|
13573
|
+
{
|
|
13574
|
+
x: "120",
|
|
13575
|
+
y: "60",
|
|
13576
|
+
width: "88",
|
|
13577
|
+
height: "96",
|
|
13578
|
+
rx: "10",
|
|
13579
|
+
fill: "currentColor",
|
|
13580
|
+
opacity: "0.28"
|
|
13581
|
+
}
|
|
13582
|
+
),
|
|
13583
|
+
/* @__PURE__ */ jsx159(
|
|
13584
|
+
"rect",
|
|
13585
|
+
{
|
|
13586
|
+
x: "216",
|
|
13587
|
+
y: "24",
|
|
13588
|
+
width: "80",
|
|
13589
|
+
height: "132",
|
|
13590
|
+
rx: "10",
|
|
13591
|
+
fill: "currentColor",
|
|
13592
|
+
opacity: "0.4"
|
|
13593
|
+
}
|
|
13594
|
+
),
|
|
13562
13595
|
/* @__PURE__ */ jsx159("circle", { cx: "68", cy: "52", r: "26", fill: "currentColor", opacity: "0.2" }),
|
|
13563
13596
|
/* @__PURE__ */ jsx159("circle", { cx: "248", cy: "140", r: "14", fill: "currentColor", opacity: "0.55" }),
|
|
13564
13597
|
/* @__PURE__ */ jsx159(
|
|
@@ -13583,7 +13616,10 @@ function BgDecor({ className }) {
|
|
|
13583
13616
|
{
|
|
13584
13617
|
"data-slot": "login-bg-decor",
|
|
13585
13618
|
"aria-hidden": "true",
|
|
13586
|
-
className: cn(
|
|
13619
|
+
className: cn(
|
|
13620
|
+
"pointer-events-none absolute inset-0 overflow-hidden",
|
|
13621
|
+
className
|
|
13622
|
+
),
|
|
13587
13623
|
children: [
|
|
13588
13624
|
/* @__PURE__ */ jsx159("div", { className: "absolute -right-24 -top-24 size-96 rounded-full bg-primary/8" }),
|
|
13589
13625
|
/* @__PURE__ */ jsx159("div", { className: "absolute -left-32 bottom-0 size-80 rounded-full bg-primary/5" }),
|
|
@@ -13639,6 +13675,7 @@ function Login({
|
|
|
13639
13675
|
registerLink,
|
|
13640
13676
|
forgotLink,
|
|
13641
13677
|
footer,
|
|
13678
|
+
children,
|
|
13642
13679
|
className,
|
|
13643
13680
|
style,
|
|
13644
13681
|
onSubmit,
|
|
@@ -13647,21 +13684,51 @@ function Login({
|
|
|
13647
13684
|
}) {
|
|
13648
13685
|
const { t } = useI18n13();
|
|
13649
13686
|
const brandIdentity = brand && (brand.logo || brand.name) ? /* @__PURE__ */ jsxs102("div", { "data-slot": "login-brand-identity", className: "flex items-center gap-2", children: [
|
|
13650
|
-
brand.logo ? /* @__PURE__ */ jsx159(
|
|
13651
|
-
brand.name ? /* @__PURE__ */ jsx159("span", { className: "text-base font-semibold", children: brand.name }) : null
|
|
13652
|
-
] }) : null;
|
|
13653
|
-
const brandVisual = /* @__PURE__ */ jsxs102("div", { className: "flex flex-col gap-4", children: [
|
|
13654
|
-
brand?.title ? /* @__PURE__ */ jsx159("h2", { className: "text-3xl font-bold leading-tight tracking-tight", children: brand.title }) : null,
|
|
13655
|
-
brand?.description ? /* @__PURE__ */ jsx159("p", { className: "max-w-md text-sm text-muted-foreground", children: brand.description }) : null,
|
|
13656
|
-
brand?.illustration ? /* @__PURE__ */ jsx159(
|
|
13687
|
+
brand.logo ? /* @__PURE__ */ jsx159(
|
|
13657
13688
|
"img",
|
|
13658
13689
|
{
|
|
13659
|
-
src: brand.
|
|
13660
|
-
alt: "",
|
|
13661
|
-
className: "
|
|
13690
|
+
src: brand.logo,
|
|
13691
|
+
alt: brand.name ?? "",
|
|
13692
|
+
className: "size-7 rounded-md"
|
|
13662
13693
|
}
|
|
13663
|
-
) :
|
|
13664
|
-
|
|
13694
|
+
) : null,
|
|
13695
|
+
brand.name ? /* @__PURE__ */ jsx159("span", { className: "text-base font-semibold", children: brand.name }) : null
|
|
13696
|
+
] }) : null;
|
|
13697
|
+
const brandVisual = (alignRight = false) => /* @__PURE__ */ jsxs102(
|
|
13698
|
+
"div",
|
|
13699
|
+
{
|
|
13700
|
+
className: cn("flex w-full flex-col gap-4", alignRight && "text-right"),
|
|
13701
|
+
children: [
|
|
13702
|
+
brand?.title ? /* @__PURE__ */ jsx159("h2", { className: "text-3xl font-bold leading-tight tracking-tight", children: brand.title }) : null,
|
|
13703
|
+
brand?.description ? /* @__PURE__ */ jsx159(
|
|
13704
|
+
"p",
|
|
13705
|
+
{
|
|
13706
|
+
className: cn(
|
|
13707
|
+
"max-w-md text-sm text-muted-foreground",
|
|
13708
|
+
alignRight && "ml-auto"
|
|
13709
|
+
),
|
|
13710
|
+
children: brand.description
|
|
13711
|
+
}
|
|
13712
|
+
) : null,
|
|
13713
|
+
brand?.illustration ? /* @__PURE__ */ jsx159(
|
|
13714
|
+
"img",
|
|
13715
|
+
{
|
|
13716
|
+
src: brand.illustration,
|
|
13717
|
+
alt: "",
|
|
13718
|
+
className: cn(
|
|
13719
|
+
"mt-4 w-full max-w-lg rounded-lg object-cover",
|
|
13720
|
+
alignRight && "self-end"
|
|
13721
|
+
)
|
|
13722
|
+
}
|
|
13723
|
+
) : brand?.illustration === "" ? null : /* @__PURE__ */ jsx159(
|
|
13724
|
+
DefaultIllustration,
|
|
13725
|
+
{
|
|
13726
|
+
className: cn("mt-4 w-full max-w-md", alignRight && "self-end")
|
|
13727
|
+
}
|
|
13728
|
+
)
|
|
13729
|
+
]
|
|
13730
|
+
}
|
|
13731
|
+
);
|
|
13665
13732
|
const renderAuxLink = (link, onClick) => {
|
|
13666
13733
|
if (!link) return null;
|
|
13667
13734
|
if (link.href) {
|
|
@@ -13682,35 +13749,40 @@ function Login({
|
|
|
13682
13749
|
/* @__PURE__ */ jsx159("h1", { className: "text-2xl font-semibold tracking-tight", children: title ?? t("pactor.login.title") }),
|
|
13683
13750
|
subtitle ? /* @__PURE__ */ jsx159("p", { className: "text-sm text-muted-foreground", children: subtitle }) : null
|
|
13684
13751
|
] }),
|
|
13685
|
-
/* @__PURE__ */ jsxs102(Form, { name: "login", className: "flex flex-col gap-
|
|
13686
|
-
/* @__PURE__ */ jsx159(
|
|
13752
|
+
children ?? /* @__PURE__ */ jsxs102(Form, { name: "login", className: "flex flex-col gap-2", onSubmit, children: [
|
|
13753
|
+
/* @__PURE__ */ jsx159(Field2, { label: usernameLabel ?? t("pactor.login.username"), required: true, children: /* @__PURE__ */ jsx159(
|
|
13687
13754
|
Input2,
|
|
13688
13755
|
{
|
|
13689
13756
|
name: "username",
|
|
13690
|
-
|
|
13757
|
+
size: "large",
|
|
13691
13758
|
placeholder: usernamePlaceholder ?? t("pactor.login.usernamePlaceholder"),
|
|
13692
|
-
rules: [
|
|
13759
|
+
rules: [
|
|
13760
|
+
{ required: true, message: t("pactor.login.usernameRequired") }
|
|
13761
|
+
]
|
|
13693
13762
|
}
|
|
13694
|
-
),
|
|
13695
|
-
/* @__PURE__ */ jsx159(
|
|
13763
|
+
) }),
|
|
13764
|
+
/* @__PURE__ */ jsx159(Field2, { label: passwordLabel ?? t("pactor.login.password"), required: true, children: /* @__PURE__ */ jsx159(
|
|
13696
13765
|
Input2,
|
|
13697
13766
|
{
|
|
13698
13767
|
name: "password",
|
|
13699
13768
|
type: "password",
|
|
13700
|
-
|
|
13769
|
+
size: "large",
|
|
13701
13770
|
placeholder: passwordPlaceholder ?? t("pactor.login.passwordPlaceholder"),
|
|
13702
|
-
rules: [
|
|
13771
|
+
rules: [
|
|
13772
|
+
{ required: true, message: t("pactor.login.passwordRequired") }
|
|
13773
|
+
]
|
|
13703
13774
|
}
|
|
13704
|
-
),
|
|
13705
|
-
/* @__PURE__ */ jsx159(
|
|
13775
|
+
) }),
|
|
13776
|
+
/* @__PURE__ */ jsx159(Field2, { children: /* @__PURE__ */ jsx159(
|
|
13706
13777
|
Button2,
|
|
13707
13778
|
{
|
|
13708
13779
|
submit: true,
|
|
13709
13780
|
variant: "primary",
|
|
13781
|
+
size: "large",
|
|
13710
13782
|
text: submitText ?? t("pactor.login.submit"),
|
|
13711
13783
|
className: "mt-2 w-full"
|
|
13712
13784
|
}
|
|
13713
|
-
)
|
|
13785
|
+
) })
|
|
13714
13786
|
] }),
|
|
13715
13787
|
registerLink || forgotLink ? /* @__PURE__ */ jsxs102("div", { className: "mt-4 flex items-center justify-between gap-4", children: [
|
|
13716
13788
|
renderAuxLink(registerLink, onRegisterClick),
|
|
@@ -13739,7 +13811,7 @@ function Login({
|
|
|
13739
13811
|
decor ? /* @__PURE__ */ jsx159(BgDecor, {}) : null,
|
|
13740
13812
|
/* @__PURE__ */ jsxs102("div", { className: "relative flex h-full flex-col justify-between", children: [
|
|
13741
13813
|
withIdentity ? brandIdentity : null,
|
|
13742
|
-
brandVisual,
|
|
13814
|
+
brandVisual(),
|
|
13743
13815
|
/* @__PURE__ */ jsx159("div", {})
|
|
13744
13816
|
] })
|
|
13745
13817
|
]
|
|
@@ -13750,6 +13822,37 @@ function Login({
|
|
|
13750
13822
|
/* @__PURE__ */ jsx159("div", { className: "flex flex-1 items-center justify-center p-6", children: authBox(variant) }),
|
|
13751
13823
|
footerBar
|
|
13752
13824
|
] });
|
|
13825
|
+
const brandCard = (widthClass, alignRight = false) => /* @__PURE__ */ jsx159(Card2, { className: cn("w-full", widthClass, BRAND_PANEL_BG), children: /* @__PURE__ */ jsxs102(
|
|
13826
|
+
"div",
|
|
13827
|
+
{
|
|
13828
|
+
"data-slot": "login-brand-card-content",
|
|
13829
|
+
className: cn("flex flex-col gap-6", alignRight && "text-right"),
|
|
13830
|
+
children: [
|
|
13831
|
+
brandIdentity ? /* @__PURE__ */ jsx159("div", { className: cn(alignRight && "flex justify-end"), children: brandIdentity }) : null,
|
|
13832
|
+
brandVisual(alignRight)
|
|
13833
|
+
]
|
|
13834
|
+
}
|
|
13835
|
+
) });
|
|
13836
|
+
const overlapAuthCard = /* @__PURE__ */ jsx159(
|
|
13837
|
+
"div",
|
|
13838
|
+
{
|
|
13839
|
+
className: cn(
|
|
13840
|
+
"z-10 w-full max-w-[400px]",
|
|
13841
|
+
brandSide === "left" ? "md:-ml-24" : "md:-mr-24"
|
|
13842
|
+
),
|
|
13843
|
+
children: /* @__PURE__ */ jsx159(Card2, { className: "p-2 shadow-xl md:p-4", children: authContent })
|
|
13844
|
+
}
|
|
13845
|
+
);
|
|
13846
|
+
const backdropBrandColumn = /* @__PURE__ */ jsxs102("div", { className: "relative hidden flex-col justify-between p-10 md:flex", children: [
|
|
13847
|
+
brandIdentity,
|
|
13848
|
+
brandVisual(),
|
|
13849
|
+
/* @__PURE__ */ jsx159("div", {})
|
|
13850
|
+
] });
|
|
13851
|
+
const backdropAuthColumn = /* @__PURE__ */ jsxs102("div", { className: "relative flex min-h-svh flex-col", children: [
|
|
13852
|
+
brandIdentity ? /* @__PURE__ */ jsx159("div", { className: "p-6 md:hidden", children: brandIdentity }) : null,
|
|
13853
|
+
/* @__PURE__ */ jsx159("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ jsx159(Card2, { className: "w-full max-w-[400px] p-2 shadow-xl md:p-4", children: authContent }) }),
|
|
13854
|
+
footerBar
|
|
13855
|
+
] });
|
|
13753
13856
|
if (layout === "centered") {
|
|
13754
13857
|
return /* @__PURE__ */ jsxs102(
|
|
13755
13858
|
"div",
|
|
@@ -13778,6 +13881,7 @@ function Login({
|
|
|
13778
13881
|
{
|
|
13779
13882
|
"data-slot": "login",
|
|
13780
13883
|
"data-layout": layout,
|
|
13884
|
+
"data-brand-side": brandSide,
|
|
13781
13885
|
className: cn(
|
|
13782
13886
|
"relative flex min-h-svh w-full flex-col overflow-hidden bg-background p-6 md:p-10",
|
|
13783
13887
|
className
|
|
@@ -13785,13 +13889,13 @@ function Login({
|
|
|
13785
13889
|
style,
|
|
13786
13890
|
children: [
|
|
13787
13891
|
decor ? /* @__PURE__ */ jsx159(BgDecor, {}) : null,
|
|
13788
|
-
/* @__PURE__ */
|
|
13789
|
-
|
|
13790
|
-
brandIdentity,
|
|
13791
|
-
brandVisual
|
|
13792
|
-
] }) }),
|
|
13892
|
+
/* @__PURE__ */ jsx159("div", { className: "relative flex flex-1 flex-col items-center gap-6 md:flex-row md:gap-10", children: brandSide === "left" ? /* @__PURE__ */ jsxs102(Fragment18, { children: [
|
|
13893
|
+
brandCard("md:w-[45%]"),
|
|
13793
13894
|
/* @__PURE__ */ jsx159("div", { className: "flex w-full flex-1 justify-center", children: authBox("plain") })
|
|
13794
|
-
] }),
|
|
13895
|
+
] }) : /* @__PURE__ */ jsxs102(Fragment18, { children: [
|
|
13896
|
+
/* @__PURE__ */ jsx159("div", { className: "flex w-full flex-1 justify-center", children: authBox("plain") }),
|
|
13897
|
+
brandCard("md:w-[45%]")
|
|
13898
|
+
] }) }),
|
|
13795
13899
|
footerBar
|
|
13796
13900
|
]
|
|
13797
13901
|
}
|
|
@@ -13803,6 +13907,7 @@ function Login({
|
|
|
13803
13907
|
{
|
|
13804
13908
|
"data-slot": "login",
|
|
13805
13909
|
"data-layout": layout,
|
|
13910
|
+
"data-brand-side": brandSide,
|
|
13806
13911
|
className: cn(
|
|
13807
13912
|
"relative flex min-h-svh w-full flex-col overflow-hidden bg-background p-6 md:p-10",
|
|
13808
13913
|
className
|
|
@@ -13810,13 +13915,13 @@ function Login({
|
|
|
13810
13915
|
style,
|
|
13811
13916
|
children: [
|
|
13812
13917
|
decor ? /* @__PURE__ */ jsx159(BgDecor, {}) : null,
|
|
13813
|
-
/* @__PURE__ */
|
|
13814
|
-
|
|
13815
|
-
|
|
13816
|
-
|
|
13817
|
-
|
|
13818
|
-
|
|
13819
|
-
] }),
|
|
13918
|
+
/* @__PURE__ */ jsx159("div", { className: "relative flex flex-1 flex-col items-center justify-center gap-6 md:flex-row md:items-center md:gap-0", children: brandSide === "left" ? /* @__PURE__ */ jsxs102(Fragment18, { children: [
|
|
13919
|
+
brandCard("md:w-[52%]"),
|
|
13920
|
+
overlapAuthCard
|
|
13921
|
+
] }) : /* @__PURE__ */ jsxs102(Fragment18, { children: [
|
|
13922
|
+
overlapAuthCard,
|
|
13923
|
+
brandCard("md:w-[52%]", true)
|
|
13924
|
+
] }) }),
|
|
13820
13925
|
footerBar
|
|
13821
13926
|
]
|
|
13822
13927
|
}
|
|
@@ -13828,6 +13933,7 @@ function Login({
|
|
|
13828
13933
|
{
|
|
13829
13934
|
"data-slot": "login",
|
|
13830
13935
|
"data-layout": layout,
|
|
13936
|
+
"data-brand-side": brandSide,
|
|
13831
13937
|
className: cn(
|
|
13832
13938
|
"relative grid min-h-svh w-full overflow-hidden bg-linear-to-br from-primary/20 via-accent to-primary/10 md:grid-cols-2 dark:from-primary/25 dark:to-primary/15",
|
|
13833
13939
|
className
|
|
@@ -13835,15 +13941,12 @@ function Login({
|
|
|
13835
13941
|
style,
|
|
13836
13942
|
children: [
|
|
13837
13943
|
decor ? /* @__PURE__ */ jsx159(BgDecor, {}) : null,
|
|
13838
|
-
/* @__PURE__ */ jsxs102(
|
|
13839
|
-
|
|
13840
|
-
|
|
13841
|
-
|
|
13842
|
-
|
|
13843
|
-
|
|
13844
|
-
brandIdentity ? /* @__PURE__ */ jsx159("div", { className: "p-6 md:hidden", children: brandIdentity }) : null,
|
|
13845
|
-
/* @__PURE__ */ jsx159("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ jsx159(Card2, { className: "w-full max-w-[400px] p-2 shadow-xl md:p-4", children: authContent }) }),
|
|
13846
|
-
footerBar
|
|
13944
|
+
brandSide === "left" ? /* @__PURE__ */ jsxs102(Fragment18, { children: [
|
|
13945
|
+
backdropBrandColumn,
|
|
13946
|
+
backdropAuthColumn
|
|
13947
|
+
] }) : /* @__PURE__ */ jsxs102(Fragment18, { children: [
|
|
13948
|
+
backdropAuthColumn,
|
|
13949
|
+
backdropBrandColumn
|
|
13847
13950
|
] })
|
|
13848
13951
|
]
|
|
13849
13952
|
}
|
|
@@ -13859,6 +13962,7 @@ function Login({
|
|
|
13859
13962
|
{
|
|
13860
13963
|
"data-slot": "login",
|
|
13861
13964
|
"data-layout": layout,
|
|
13965
|
+
"data-brand-side": brandSide,
|
|
13862
13966
|
className: cn(
|
|
13863
13967
|
"grid min-h-svh w-full bg-background md:[grid-template-columns:var(--login-grid)]",
|
|
13864
13968
|
className
|
|
@@ -17827,9 +17827,42 @@ function DefaultIllustration({ className }) {
|
|
|
17827
17827
|
"aria-hidden": "true",
|
|
17828
17828
|
className: cn("text-primary", className),
|
|
17829
17829
|
children: [
|
|
17830
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17831
|
-
|
|
17832
|
-
|
|
17830
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17831
|
+
"rect",
|
|
17832
|
+
{
|
|
17833
|
+
x: "24",
|
|
17834
|
+
y: "96",
|
|
17835
|
+
width: "88",
|
|
17836
|
+
height: "60",
|
|
17837
|
+
rx: "10",
|
|
17838
|
+
fill: "currentColor",
|
|
17839
|
+
opacity: "0.16"
|
|
17840
|
+
}
|
|
17841
|
+
),
|
|
17842
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17843
|
+
"rect",
|
|
17844
|
+
{
|
|
17845
|
+
x: "120",
|
|
17846
|
+
y: "60",
|
|
17847
|
+
width: "88",
|
|
17848
|
+
height: "96",
|
|
17849
|
+
rx: "10",
|
|
17850
|
+
fill: "currentColor",
|
|
17851
|
+
opacity: "0.28"
|
|
17852
|
+
}
|
|
17853
|
+
),
|
|
17854
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17855
|
+
"rect",
|
|
17856
|
+
{
|
|
17857
|
+
x: "216",
|
|
17858
|
+
y: "24",
|
|
17859
|
+
width: "80",
|
|
17860
|
+
height: "132",
|
|
17861
|
+
rx: "10",
|
|
17862
|
+
fill: "currentColor",
|
|
17863
|
+
opacity: "0.4"
|
|
17864
|
+
}
|
|
17865
|
+
),
|
|
17833
17866
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("circle", { cx: "68", cy: "52", r: "26", fill: "currentColor", opacity: "0.2" }),
|
|
17834
17867
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("circle", { cx: "248", cy: "140", r: "14", fill: "currentColor", opacity: "0.55" }),
|
|
17835
17868
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
@@ -17854,7 +17887,10 @@ function BgDecor({ className }) {
|
|
|
17854
17887
|
{
|
|
17855
17888
|
"data-slot": "login-bg-decor",
|
|
17856
17889
|
"aria-hidden": "true",
|
|
17857
|
-
className: cn(
|
|
17890
|
+
className: cn(
|
|
17891
|
+
"pointer-events-none absolute inset-0 overflow-hidden",
|
|
17892
|
+
className
|
|
17893
|
+
),
|
|
17858
17894
|
children: [
|
|
17859
17895
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "absolute -right-24 -top-24 size-96 rounded-full bg-primary/8" }),
|
|
17860
17896
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "absolute -left-32 bottom-0 size-80 rounded-full bg-primary/5" }),
|
|
@@ -17910,6 +17946,7 @@ function Login({
|
|
|
17910
17946
|
registerLink,
|
|
17911
17947
|
forgotLink,
|
|
17912
17948
|
footer,
|
|
17949
|
+
children,
|
|
17913
17950
|
className,
|
|
17914
17951
|
style,
|
|
17915
17952
|
onSubmit,
|
|
@@ -17918,21 +17955,51 @@ function Login({
|
|
|
17918
17955
|
}) {
|
|
17919
17956
|
const { t } = (0, import_runtime31.useI18n)();
|
|
17920
17957
|
const brandIdentity = brand && (brand.logo || brand.name) ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { "data-slot": "login-brand-identity", className: "flex items-center gap-2", children: [
|
|
17921
|
-
brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17922
|
-
brand.name ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("span", { className: "text-base font-semibold", children: brand.name }) : null
|
|
17923
|
-
] }) : null;
|
|
17924
|
-
const brandVisual = /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "flex flex-col gap-4", children: [
|
|
17925
|
-
brand?.title ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("h2", { className: "text-3xl font-bold leading-tight tracking-tight", children: brand.title }) : null,
|
|
17926
|
-
brand?.description ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("p", { className: "max-w-md text-sm text-muted-foreground", children: brand.description }) : null,
|
|
17927
|
-
brand?.illustration ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17958
|
+
brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17928
17959
|
"img",
|
|
17929
17960
|
{
|
|
17930
|
-
src: brand.
|
|
17931
|
-
alt: "",
|
|
17932
|
-
className: "
|
|
17961
|
+
src: brand.logo,
|
|
17962
|
+
alt: brand.name ?? "",
|
|
17963
|
+
className: "size-7 rounded-md"
|
|
17933
17964
|
}
|
|
17934
|
-
) :
|
|
17935
|
-
|
|
17965
|
+
) : null,
|
|
17966
|
+
brand.name ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("span", { className: "text-base font-semibold", children: brand.name }) : null
|
|
17967
|
+
] }) : null;
|
|
17968
|
+
const brandVisual = (alignRight = false) => /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
17969
|
+
"div",
|
|
17970
|
+
{
|
|
17971
|
+
className: cn("flex w-full flex-col gap-4", alignRight && "text-right"),
|
|
17972
|
+
children: [
|
|
17973
|
+
brand?.title ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("h2", { className: "text-3xl font-bold leading-tight tracking-tight", children: brand.title }) : null,
|
|
17974
|
+
brand?.description ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17975
|
+
"p",
|
|
17976
|
+
{
|
|
17977
|
+
className: cn(
|
|
17978
|
+
"max-w-md text-sm text-muted-foreground",
|
|
17979
|
+
alignRight && "ml-auto"
|
|
17980
|
+
),
|
|
17981
|
+
children: brand.description
|
|
17982
|
+
}
|
|
17983
|
+
) : null,
|
|
17984
|
+
brand?.illustration ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17985
|
+
"img",
|
|
17986
|
+
{
|
|
17987
|
+
src: brand.illustration,
|
|
17988
|
+
alt: "",
|
|
17989
|
+
className: cn(
|
|
17990
|
+
"mt-4 w-full max-w-lg rounded-lg object-cover",
|
|
17991
|
+
alignRight && "self-end"
|
|
17992
|
+
)
|
|
17993
|
+
}
|
|
17994
|
+
) : brand?.illustration === "" ? null : /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17995
|
+
DefaultIllustration,
|
|
17996
|
+
{
|
|
17997
|
+
className: cn("mt-4 w-full max-w-md", alignRight && "self-end")
|
|
17998
|
+
}
|
|
17999
|
+
)
|
|
18000
|
+
]
|
|
18001
|
+
}
|
|
18002
|
+
);
|
|
17936
18003
|
const renderAuxLink = (link, onClick) => {
|
|
17937
18004
|
if (!link) return null;
|
|
17938
18005
|
if (link.href) {
|
|
@@ -17953,35 +18020,40 @@ function Login({
|
|
|
17953
18020
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("h1", { className: "text-2xl font-semibold tracking-tight", children: title ?? t("pactor.login.title") }),
|
|
17954
18021
|
subtitle ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("p", { className: "text-sm text-muted-foreground", children: subtitle }) : null
|
|
17955
18022
|
] }),
|
|
17956
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(Form, { name: "login", className: "flex flex-col gap-
|
|
17957
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18023
|
+
children ?? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(Form, { name: "login", className: "flex flex-col gap-2", onSubmit, children: [
|
|
18024
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Field2, { label: usernameLabel ?? t("pactor.login.username"), required: true, children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17958
18025
|
Input2,
|
|
17959
18026
|
{
|
|
17960
18027
|
name: "username",
|
|
17961
|
-
|
|
18028
|
+
size: "large",
|
|
17962
18029
|
placeholder: usernamePlaceholder ?? t("pactor.login.usernamePlaceholder"),
|
|
17963
|
-
rules: [
|
|
18030
|
+
rules: [
|
|
18031
|
+
{ required: true, message: t("pactor.login.usernameRequired") }
|
|
18032
|
+
]
|
|
17964
18033
|
}
|
|
17965
|
-
),
|
|
17966
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18034
|
+
) }),
|
|
18035
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Field2, { label: passwordLabel ?? t("pactor.login.password"), required: true, children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17967
18036
|
Input2,
|
|
17968
18037
|
{
|
|
17969
18038
|
name: "password",
|
|
17970
18039
|
type: "password",
|
|
17971
|
-
|
|
18040
|
+
size: "large",
|
|
17972
18041
|
placeholder: passwordPlaceholder ?? t("pactor.login.passwordPlaceholder"),
|
|
17973
|
-
rules: [
|
|
18042
|
+
rules: [
|
|
18043
|
+
{ required: true, message: t("pactor.login.passwordRequired") }
|
|
18044
|
+
]
|
|
17974
18045
|
}
|
|
17975
|
-
),
|
|
17976
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18046
|
+
) }),
|
|
18047
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Field2, { children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17977
18048
|
Button2,
|
|
17978
18049
|
{
|
|
17979
18050
|
submit: true,
|
|
17980
18051
|
variant: "primary",
|
|
18052
|
+
size: "large",
|
|
17981
18053
|
text: submitText ?? t("pactor.login.submit"),
|
|
17982
18054
|
className: "mt-2 w-full"
|
|
17983
18055
|
}
|
|
17984
|
-
)
|
|
18056
|
+
) })
|
|
17985
18057
|
] }),
|
|
17986
18058
|
registerLink || forgotLink ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "mt-4 flex items-center justify-between gap-4", children: [
|
|
17987
18059
|
renderAuxLink(registerLink, onRegisterClick),
|
|
@@ -18010,7 +18082,7 @@ function Login({
|
|
|
18010
18082
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18011
18083
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "relative flex h-full flex-col justify-between", children: [
|
|
18012
18084
|
withIdentity ? brandIdentity : null,
|
|
18013
|
-
brandVisual,
|
|
18085
|
+
brandVisual(),
|
|
18014
18086
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", {})
|
|
18015
18087
|
] })
|
|
18016
18088
|
]
|
|
@@ -18021,6 +18093,37 @@ function Login({
|
|
|
18021
18093
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex flex-1 items-center justify-center p-6", children: authBox(variant) }),
|
|
18022
18094
|
footerBar
|
|
18023
18095
|
] });
|
|
18096
|
+
const brandCard = (widthClass, alignRight = false) => /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: cn("w-full", widthClass, BRAND_PANEL_BG), children: /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18097
|
+
"div",
|
|
18098
|
+
{
|
|
18099
|
+
"data-slot": "login-brand-card-content",
|
|
18100
|
+
className: cn("flex flex-col gap-6", alignRight && "text-right"),
|
|
18101
|
+
children: [
|
|
18102
|
+
brandIdentity ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: cn(alignRight && "flex justify-end"), children: brandIdentity }) : null,
|
|
18103
|
+
brandVisual(alignRight)
|
|
18104
|
+
]
|
|
18105
|
+
}
|
|
18106
|
+
) });
|
|
18107
|
+
const overlapAuthCard = /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18108
|
+
"div",
|
|
18109
|
+
{
|
|
18110
|
+
className: cn(
|
|
18111
|
+
"z-10 w-full max-w-[400px]",
|
|
18112
|
+
brandSide === "left" ? "md:-ml-24" : "md:-mr-24"
|
|
18113
|
+
),
|
|
18114
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: "p-2 shadow-xl md:p-4", children: authContent })
|
|
18115
|
+
}
|
|
18116
|
+
);
|
|
18117
|
+
const backdropBrandColumn = /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "relative hidden flex-col justify-between p-10 md:flex", children: [
|
|
18118
|
+
brandIdentity,
|
|
18119
|
+
brandVisual(),
|
|
18120
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", {})
|
|
18121
|
+
] });
|
|
18122
|
+
const backdropAuthColumn = /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "relative flex min-h-svh flex-col", children: [
|
|
18123
|
+
brandIdentity ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "p-6 md:hidden", children: brandIdentity }) : null,
|
|
18124
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: "w-full max-w-[400px] p-2 shadow-xl md:p-4", children: authContent }) }),
|
|
18125
|
+
footerBar
|
|
18126
|
+
] });
|
|
18024
18127
|
if (layout === "centered") {
|
|
18025
18128
|
return /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18026
18129
|
"div",
|
|
@@ -18049,6 +18152,7 @@ function Login({
|
|
|
18049
18152
|
{
|
|
18050
18153
|
"data-slot": "login",
|
|
18051
18154
|
"data-layout": layout,
|
|
18155
|
+
"data-brand-side": brandSide,
|
|
18052
18156
|
className: cn(
|
|
18053
18157
|
"relative flex min-h-svh w-full flex-col overflow-hidden bg-background p-6 md:p-10",
|
|
18054
18158
|
className
|
|
@@ -18056,13 +18160,13 @@ function Login({
|
|
|
18056
18160
|
style,
|
|
18057
18161
|
children: [
|
|
18058
18162
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18059
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.
|
|
18060
|
-
|
|
18061
|
-
brandIdentity,
|
|
18062
|
-
brandVisual
|
|
18063
|
-
] }) }),
|
|
18163
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "relative flex flex-1 flex-col items-center gap-6 md:flex-row md:gap-10", children: brandSide === "left" ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18164
|
+
brandCard("md:w-[45%]"),
|
|
18064
18165
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex w-full flex-1 justify-center", children: authBox("plain") })
|
|
18065
|
-
] }),
|
|
18166
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18167
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex w-full flex-1 justify-center", children: authBox("plain") }),
|
|
18168
|
+
brandCard("md:w-[45%]")
|
|
18169
|
+
] }) }),
|
|
18066
18170
|
footerBar
|
|
18067
18171
|
]
|
|
18068
18172
|
}
|
|
@@ -18074,6 +18178,7 @@ function Login({
|
|
|
18074
18178
|
{
|
|
18075
18179
|
"data-slot": "login",
|
|
18076
18180
|
"data-layout": layout,
|
|
18181
|
+
"data-brand-side": brandSide,
|
|
18077
18182
|
className: cn(
|
|
18078
18183
|
"relative flex min-h-svh w-full flex-col overflow-hidden bg-background p-6 md:p-10",
|
|
18079
18184
|
className
|
|
@@ -18081,13 +18186,13 @@ function Login({
|
|
|
18081
18186
|
style,
|
|
18082
18187
|
children: [
|
|
18083
18188
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18084
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.
|
|
18085
|
-
|
|
18086
|
-
|
|
18087
|
-
|
|
18088
|
-
|
|
18089
|
-
|
|
18090
|
-
] }),
|
|
18189
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "relative flex flex-1 flex-col items-center justify-center gap-6 md:flex-row md:items-center md:gap-0", children: brandSide === "left" ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18190
|
+
brandCard("md:w-[52%]"),
|
|
18191
|
+
overlapAuthCard
|
|
18192
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18193
|
+
overlapAuthCard,
|
|
18194
|
+
brandCard("md:w-[52%]", true)
|
|
18195
|
+
] }) }),
|
|
18091
18196
|
footerBar
|
|
18092
18197
|
]
|
|
18093
18198
|
}
|
|
@@ -18099,6 +18204,7 @@ function Login({
|
|
|
18099
18204
|
{
|
|
18100
18205
|
"data-slot": "login",
|
|
18101
18206
|
"data-layout": layout,
|
|
18207
|
+
"data-brand-side": brandSide,
|
|
18102
18208
|
className: cn(
|
|
18103
18209
|
"relative grid min-h-svh w-full overflow-hidden bg-linear-to-br from-primary/20 via-accent to-primary/10 md:grid-cols-2 dark:from-primary/25 dark:to-primary/15",
|
|
18104
18210
|
className
|
|
@@ -18106,15 +18212,12 @@ function Login({
|
|
|
18106
18212
|
style,
|
|
18107
18213
|
children: [
|
|
18108
18214
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18109
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18110
|
-
|
|
18111
|
-
|
|
18112
|
-
|
|
18113
|
-
|
|
18114
|
-
|
|
18115
|
-
brandIdentity ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "p-6 md:hidden", children: brandIdentity }) : null,
|
|
18116
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: "w-full max-w-[400px] p-2 shadow-xl md:p-4", children: authContent }) }),
|
|
18117
|
-
footerBar
|
|
18215
|
+
brandSide === "left" ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18216
|
+
backdropBrandColumn,
|
|
18217
|
+
backdropAuthColumn
|
|
18218
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18219
|
+
backdropAuthColumn,
|
|
18220
|
+
backdropBrandColumn
|
|
18118
18221
|
] })
|
|
18119
18222
|
]
|
|
18120
18223
|
}
|
|
@@ -18130,6 +18233,7 @@ function Login({
|
|
|
18130
18233
|
{
|
|
18131
18234
|
"data-slot": "login",
|
|
18132
18235
|
"data-layout": layout,
|
|
18236
|
+
"data-brand-side": brandSide,
|
|
18133
18237
|
className: cn(
|
|
18134
18238
|
"grid min-h-svh w-full bg-background md:[grid-template-columns:var(--login-grid)]",
|
|
18135
18239
|
className
|
|
@@ -4939,7 +4939,7 @@ declare function FieldCondition({ value, onChange, fields, disabled, size, }: Fi
|
|
|
4939
4939
|
* - `backdrop`(11)整页渐变品牌背景 + 悬浮认证卡片
|
|
4940
4940
|
* (10 扫码登录不在组件范围内)
|
|
4941
4941
|
*/
|
|
4942
|
-
type LoginVariant =
|
|
4942
|
+
type LoginVariant = "split" | "centered" | "brand-card" | "overlap" | "backdrop";
|
|
4943
4943
|
interface LoginBrandInfo {
|
|
4944
4944
|
/** Logo 图片地址 */
|
|
4945
4945
|
logo?: string;
|
|
@@ -4960,8 +4960,12 @@ interface LoginLink {
|
|
|
4960
4960
|
interface LoginProps {
|
|
4961
4961
|
/** 结构模式,默认 split */
|
|
4962
4962
|
layout?: LoginVariant;
|
|
4963
|
-
/**
|
|
4964
|
-
|
|
4963
|
+
/**
|
|
4964
|
+
* 品牌区方向(split / brand-card / overlap / backdrop 生效;centered 无分栏不适用),
|
|
4965
|
+
* 默认 left;right 即文档 12「左表单 + 右概念展示」的镜像结构
|
|
4966
|
+
* (窄屏均为认证区在前,品牌区隐藏或后置)
|
|
4967
|
+
*/
|
|
4968
|
+
brandSide?: "left" | "right";
|
|
4965
4969
|
/** 品牌区分栏占比 0–1(仅 split),默认 0.5;0.6 即文档 04 的品牌大区 */
|
|
4966
4970
|
brandRatio?: number;
|
|
4967
4971
|
/**
|
|
@@ -4969,7 +4973,7 @@ interface LoginProps {
|
|
|
4969
4973
|
* `plain` 裸表单(320–380px);`card` 常规卡片(默认,400px);
|
|
4970
4974
|
* `float` 大尺寸悬浮卡片(440px + 大留白 + 强阴影,即文档 03)
|
|
4971
4975
|
*/
|
|
4972
|
-
authVariant?:
|
|
4976
|
+
authVariant?: "plain" | "card" | "float";
|
|
4973
4977
|
/** split 品牌面板是否带渐变背景,默认 true */
|
|
4974
4978
|
brandPanelBackground?: boolean;
|
|
4975
4979
|
/** 是否渲染默认背景装饰(圆斑/圆环/点阵/流线),默认 true */
|
|
@@ -4992,6 +4996,13 @@ interface LoginProps {
|
|
|
4992
4996
|
forgotLink?: LoginLink;
|
|
4993
4997
|
/** 页脚文案(版权/协议行,未配置不渲染) */
|
|
4994
4998
|
footer?: string;
|
|
4999
|
+
/**
|
|
5000
|
+
* 认证区内容插槽(DSL children 或 ReactNode):提供时替换内置账号密码表单,
|
|
5001
|
+
* 标题/副标题与辅助入口(registerLink / forgotLink)保留。
|
|
5002
|
+
* 可内嵌 Tabs 切换多种登录方式(手机验证码 / 账号密码等);
|
|
5003
|
+
* 插槽内的表单字段、校验与提交事件由使用方自行编排,Login 的 onSubmit 不再生效
|
|
5004
|
+
*/
|
|
5005
|
+
children?: ReactNode;
|
|
4995
5006
|
/** 通用:根节点 class(与内置样式合并) */
|
|
4996
5007
|
className?: string;
|
|
4997
5008
|
/** 通用:根节点内联样式 */
|
|
@@ -5005,10 +5016,11 @@ interface LoginProps {
|
|
|
5005
5016
|
* Login 登录业务组件(business 目录):
|
|
5006
5017
|
* 品牌区 + 认证区 + 辅助入口 + 页脚的整页组合,内部复用 Form/Input/Button。
|
|
5007
5018
|
* 结构模式(layout)与修饰配置(方向/比例/卡片样式/背景/装饰)正交组合;
|
|
5019
|
+
* 认证区内容支持 children 插槽替换内置表单(可内嵌 Tabs 切换多种登录方式);
|
|
5008
5020
|
* 样式全部走语义令牌(深浅色/换肤自适应);文案缺省走 i18n(pactor.login.*),
|
|
5009
5021
|
* 同名 props 优先。组件不内置登录请求。
|
|
5010
5022
|
*/
|
|
5011
|
-
declare function Login({ layout, brandSide, brandRatio, authVariant, brandPanelBackground, decor, brand, title, subtitle, usernameLabel, usernamePlaceholder, passwordLabel, passwordPlaceholder, submitText, registerLink, forgotLink, footer, className, style, onSubmit, onRegisterClick, onForgotClick, }: LoginProps): React.JSX.Element;
|
|
5023
|
+
declare function Login({ layout, brandSide, brandRatio, authVariant, brandPanelBackground, decor, brand, title, subtitle, usernameLabel, usernamePlaceholder, passwordLabel, passwordPlaceholder, submitText, registerLink, forgotLink, footer, children, className, style, onSubmit, onRegisterClick, onForgotClick, }: LoginProps): React.JSX.Element;
|
|
5012
5024
|
|
|
5013
5025
|
type ConditionOpt = 'GREATER' | 'GREATER_EQUAL' | 'LESS_EQUAL' | 'LESS' | 'EQUAL' | 'IN' | 'NOT_IN' | 'UNEQUAL' | 'LIKE' | 'NULL' | 'HASVAL' | 'NOTNULL' | 'BETWEEN';
|
|
5014
5026
|
interface Condition {
|
|
@@ -4939,7 +4939,7 @@ declare function FieldCondition({ value, onChange, fields, disabled, size, }: Fi
|
|
|
4939
4939
|
* - `backdrop`(11)整页渐变品牌背景 + 悬浮认证卡片
|
|
4940
4940
|
* (10 扫码登录不在组件范围内)
|
|
4941
4941
|
*/
|
|
4942
|
-
type LoginVariant =
|
|
4942
|
+
type LoginVariant = "split" | "centered" | "brand-card" | "overlap" | "backdrop";
|
|
4943
4943
|
interface LoginBrandInfo {
|
|
4944
4944
|
/** Logo 图片地址 */
|
|
4945
4945
|
logo?: string;
|
|
@@ -4960,8 +4960,12 @@ interface LoginLink {
|
|
|
4960
4960
|
interface LoginProps {
|
|
4961
4961
|
/** 结构模式,默认 split */
|
|
4962
4962
|
layout?: LoginVariant;
|
|
4963
|
-
/**
|
|
4964
|
-
|
|
4963
|
+
/**
|
|
4964
|
+
* 品牌区方向(split / brand-card / overlap / backdrop 生效;centered 无分栏不适用),
|
|
4965
|
+
* 默认 left;right 即文档 12「左表单 + 右概念展示」的镜像结构
|
|
4966
|
+
* (窄屏均为认证区在前,品牌区隐藏或后置)
|
|
4967
|
+
*/
|
|
4968
|
+
brandSide?: "left" | "right";
|
|
4965
4969
|
/** 品牌区分栏占比 0–1(仅 split),默认 0.5;0.6 即文档 04 的品牌大区 */
|
|
4966
4970
|
brandRatio?: number;
|
|
4967
4971
|
/**
|
|
@@ -4969,7 +4973,7 @@ interface LoginProps {
|
|
|
4969
4973
|
* `plain` 裸表单(320–380px);`card` 常规卡片(默认,400px);
|
|
4970
4974
|
* `float` 大尺寸悬浮卡片(440px + 大留白 + 强阴影,即文档 03)
|
|
4971
4975
|
*/
|
|
4972
|
-
authVariant?:
|
|
4976
|
+
authVariant?: "plain" | "card" | "float";
|
|
4973
4977
|
/** split 品牌面板是否带渐变背景,默认 true */
|
|
4974
4978
|
brandPanelBackground?: boolean;
|
|
4975
4979
|
/** 是否渲染默认背景装饰(圆斑/圆环/点阵/流线),默认 true */
|
|
@@ -4992,6 +4996,13 @@ interface LoginProps {
|
|
|
4992
4996
|
forgotLink?: LoginLink;
|
|
4993
4997
|
/** 页脚文案(版权/协议行,未配置不渲染) */
|
|
4994
4998
|
footer?: string;
|
|
4999
|
+
/**
|
|
5000
|
+
* 认证区内容插槽(DSL children 或 ReactNode):提供时替换内置账号密码表单,
|
|
5001
|
+
* 标题/副标题与辅助入口(registerLink / forgotLink)保留。
|
|
5002
|
+
* 可内嵌 Tabs 切换多种登录方式(手机验证码 / 账号密码等);
|
|
5003
|
+
* 插槽内的表单字段、校验与提交事件由使用方自行编排,Login 的 onSubmit 不再生效
|
|
5004
|
+
*/
|
|
5005
|
+
children?: ReactNode;
|
|
4995
5006
|
/** 通用:根节点 class(与内置样式合并) */
|
|
4996
5007
|
className?: string;
|
|
4997
5008
|
/** 通用:根节点内联样式 */
|
|
@@ -5005,10 +5016,11 @@ interface LoginProps {
|
|
|
5005
5016
|
* Login 登录业务组件(business 目录):
|
|
5006
5017
|
* 品牌区 + 认证区 + 辅助入口 + 页脚的整页组合,内部复用 Form/Input/Button。
|
|
5007
5018
|
* 结构模式(layout)与修饰配置(方向/比例/卡片样式/背景/装饰)正交组合;
|
|
5019
|
+
* 认证区内容支持 children 插槽替换内置表单(可内嵌 Tabs 切换多种登录方式);
|
|
5008
5020
|
* 样式全部走语义令牌(深浅色/换肤自适应);文案缺省走 i18n(pactor.login.*),
|
|
5009
5021
|
* 同名 props 优先。组件不内置登录请求。
|
|
5010
5022
|
*/
|
|
5011
|
-
declare function Login({ layout, brandSide, brandRatio, authVariant, brandPanelBackground, decor, brand, title, subtitle, usernameLabel, usernamePlaceholder, passwordLabel, passwordPlaceholder, submitText, registerLink, forgotLink, footer, className, style, onSubmit, onRegisterClick, onForgotClick, }: LoginProps): React.JSX.Element;
|
|
5023
|
+
declare function Login({ layout, brandSide, brandRatio, authVariant, brandPanelBackground, decor, brand, title, subtitle, usernameLabel, usernamePlaceholder, passwordLabel, passwordPlaceholder, submitText, registerLink, forgotLink, footer, children, className, style, onSubmit, onRegisterClick, onForgotClick, }: LoginProps): React.JSX.Element;
|
|
5012
5024
|
|
|
5013
5025
|
type ConditionOpt = 'GREATER' | 'GREATER_EQUAL' | 'LESS_EQUAL' | 'LESS' | 'EQUAL' | 'IN' | 'NOT_IN' | 'UNEQUAL' | 'LIKE' | 'NULL' | 'HASVAL' | 'NOTNULL' | 'BETWEEN';
|
|
5014
5026
|
interface Condition {
|
package/dist/components/index.js
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -17866,9 +17866,42 @@ function DefaultIllustration({ className }) {
|
|
|
17866
17866
|
"aria-hidden": "true",
|
|
17867
17867
|
className: cn("text-primary", className),
|
|
17868
17868
|
children: [
|
|
17869
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17870
|
-
|
|
17871
|
-
|
|
17869
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17870
|
+
"rect",
|
|
17871
|
+
{
|
|
17872
|
+
x: "24",
|
|
17873
|
+
y: "96",
|
|
17874
|
+
width: "88",
|
|
17875
|
+
height: "60",
|
|
17876
|
+
rx: "10",
|
|
17877
|
+
fill: "currentColor",
|
|
17878
|
+
opacity: "0.16"
|
|
17879
|
+
}
|
|
17880
|
+
),
|
|
17881
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17882
|
+
"rect",
|
|
17883
|
+
{
|
|
17884
|
+
x: "120",
|
|
17885
|
+
y: "60",
|
|
17886
|
+
width: "88",
|
|
17887
|
+
height: "96",
|
|
17888
|
+
rx: "10",
|
|
17889
|
+
fill: "currentColor",
|
|
17890
|
+
opacity: "0.28"
|
|
17891
|
+
}
|
|
17892
|
+
),
|
|
17893
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17894
|
+
"rect",
|
|
17895
|
+
{
|
|
17896
|
+
x: "216",
|
|
17897
|
+
y: "24",
|
|
17898
|
+
width: "80",
|
|
17899
|
+
height: "132",
|
|
17900
|
+
rx: "10",
|
|
17901
|
+
fill: "currentColor",
|
|
17902
|
+
opacity: "0.4"
|
|
17903
|
+
}
|
|
17904
|
+
),
|
|
17872
17905
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("circle", { cx: "68", cy: "52", r: "26", fill: "currentColor", opacity: "0.2" }),
|
|
17873
17906
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("circle", { cx: "248", cy: "140", r: "14", fill: "currentColor", opacity: "0.55" }),
|
|
17874
17907
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
@@ -17893,7 +17926,10 @@ function BgDecor({ className }) {
|
|
|
17893
17926
|
{
|
|
17894
17927
|
"data-slot": "login-bg-decor",
|
|
17895
17928
|
"aria-hidden": "true",
|
|
17896
|
-
className: cn(
|
|
17929
|
+
className: cn(
|
|
17930
|
+
"pointer-events-none absolute inset-0 overflow-hidden",
|
|
17931
|
+
className
|
|
17932
|
+
),
|
|
17897
17933
|
children: [
|
|
17898
17934
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "absolute -right-24 -top-24 size-96 rounded-full bg-primary/8" }),
|
|
17899
17935
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "absolute -left-32 bottom-0 size-80 rounded-full bg-primary/5" }),
|
|
@@ -17949,6 +17985,7 @@ function Login({
|
|
|
17949
17985
|
registerLink,
|
|
17950
17986
|
forgotLink,
|
|
17951
17987
|
footer,
|
|
17988
|
+
children,
|
|
17952
17989
|
className,
|
|
17953
17990
|
style,
|
|
17954
17991
|
onSubmit,
|
|
@@ -17957,21 +17994,51 @@ function Login({
|
|
|
17957
17994
|
}) {
|
|
17958
17995
|
const { t } = (0, import_runtime31.useI18n)();
|
|
17959
17996
|
const brandIdentity = brand && (brand.logo || brand.name) ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { "data-slot": "login-brand-identity", className: "flex items-center gap-2", children: [
|
|
17960
|
-
brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17961
|
-
brand.name ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("span", { className: "text-base font-semibold", children: brand.name }) : null
|
|
17962
|
-
] }) : null;
|
|
17963
|
-
const brandVisual = /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "flex flex-col gap-4", children: [
|
|
17964
|
-
brand?.title ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("h2", { className: "text-3xl font-bold leading-tight tracking-tight", children: brand.title }) : null,
|
|
17965
|
-
brand?.description ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("p", { className: "max-w-md text-sm text-muted-foreground", children: brand.description }) : null,
|
|
17966
|
-
brand?.illustration ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17997
|
+
brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17967
17998
|
"img",
|
|
17968
17999
|
{
|
|
17969
|
-
src: brand.
|
|
17970
|
-
alt: "",
|
|
17971
|
-
className: "
|
|
18000
|
+
src: brand.logo,
|
|
18001
|
+
alt: brand.name ?? "",
|
|
18002
|
+
className: "size-7 rounded-md"
|
|
17972
18003
|
}
|
|
17973
|
-
) :
|
|
17974
|
-
|
|
18004
|
+
) : null,
|
|
18005
|
+
brand.name ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("span", { className: "text-base font-semibold", children: brand.name }) : null
|
|
18006
|
+
] }) : null;
|
|
18007
|
+
const brandVisual = (alignRight = false) => /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18008
|
+
"div",
|
|
18009
|
+
{
|
|
18010
|
+
className: cn("flex w-full flex-col gap-4", alignRight && "text-right"),
|
|
18011
|
+
children: [
|
|
18012
|
+
brand?.title ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("h2", { className: "text-3xl font-bold leading-tight tracking-tight", children: brand.title }) : null,
|
|
18013
|
+
brand?.description ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18014
|
+
"p",
|
|
18015
|
+
{
|
|
18016
|
+
className: cn(
|
|
18017
|
+
"max-w-md text-sm text-muted-foreground",
|
|
18018
|
+
alignRight && "ml-auto"
|
|
18019
|
+
),
|
|
18020
|
+
children: brand.description
|
|
18021
|
+
}
|
|
18022
|
+
) : null,
|
|
18023
|
+
brand?.illustration ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18024
|
+
"img",
|
|
18025
|
+
{
|
|
18026
|
+
src: brand.illustration,
|
|
18027
|
+
alt: "",
|
|
18028
|
+
className: cn(
|
|
18029
|
+
"mt-4 w-full max-w-lg rounded-lg object-cover",
|
|
18030
|
+
alignRight && "self-end"
|
|
18031
|
+
)
|
|
18032
|
+
}
|
|
18033
|
+
) : brand?.illustration === "" ? null : /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18034
|
+
DefaultIllustration,
|
|
18035
|
+
{
|
|
18036
|
+
className: cn("mt-4 w-full max-w-md", alignRight && "self-end")
|
|
18037
|
+
}
|
|
18038
|
+
)
|
|
18039
|
+
]
|
|
18040
|
+
}
|
|
18041
|
+
);
|
|
17975
18042
|
const renderAuxLink = (link, onClick) => {
|
|
17976
18043
|
if (!link) return null;
|
|
17977
18044
|
if (link.href) {
|
|
@@ -17992,35 +18059,40 @@ function Login({
|
|
|
17992
18059
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("h1", { className: "text-2xl font-semibold tracking-tight", children: title ?? t("pactor.login.title") }),
|
|
17993
18060
|
subtitle ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("p", { className: "text-sm text-muted-foreground", children: subtitle }) : null
|
|
17994
18061
|
] }),
|
|
17995
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(Form, { name: "login", className: "flex flex-col gap-
|
|
17996
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18062
|
+
children ?? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(Form, { name: "login", className: "flex flex-col gap-2", onSubmit, children: [
|
|
18063
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Field2, { label: usernameLabel ?? t("pactor.login.username"), required: true, children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
17997
18064
|
Input2,
|
|
17998
18065
|
{
|
|
17999
18066
|
name: "username",
|
|
18000
|
-
|
|
18067
|
+
size: "large",
|
|
18001
18068
|
placeholder: usernamePlaceholder ?? t("pactor.login.usernamePlaceholder"),
|
|
18002
|
-
rules: [
|
|
18069
|
+
rules: [
|
|
18070
|
+
{ required: true, message: t("pactor.login.usernameRequired") }
|
|
18071
|
+
]
|
|
18003
18072
|
}
|
|
18004
|
-
),
|
|
18005
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18073
|
+
) }),
|
|
18074
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Field2, { label: passwordLabel ?? t("pactor.login.password"), required: true, children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18006
18075
|
Input2,
|
|
18007
18076
|
{
|
|
18008
18077
|
name: "password",
|
|
18009
18078
|
type: "password",
|
|
18010
|
-
|
|
18079
|
+
size: "large",
|
|
18011
18080
|
placeholder: passwordPlaceholder ?? t("pactor.login.passwordPlaceholder"),
|
|
18012
|
-
rules: [
|
|
18081
|
+
rules: [
|
|
18082
|
+
{ required: true, message: t("pactor.login.passwordRequired") }
|
|
18083
|
+
]
|
|
18013
18084
|
}
|
|
18014
|
-
),
|
|
18015
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18085
|
+
) }),
|
|
18086
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Field2, { children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18016
18087
|
Button2,
|
|
18017
18088
|
{
|
|
18018
18089
|
submit: true,
|
|
18019
18090
|
variant: "primary",
|
|
18091
|
+
size: "large",
|
|
18020
18092
|
text: submitText ?? t("pactor.login.submit"),
|
|
18021
18093
|
className: "mt-2 w-full"
|
|
18022
18094
|
}
|
|
18023
|
-
)
|
|
18095
|
+
) })
|
|
18024
18096
|
] }),
|
|
18025
18097
|
registerLink || forgotLink ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "mt-4 flex items-center justify-between gap-4", children: [
|
|
18026
18098
|
renderAuxLink(registerLink, onRegisterClick),
|
|
@@ -18049,7 +18121,7 @@ function Login({
|
|
|
18049
18121
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18050
18122
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "relative flex h-full flex-col justify-between", children: [
|
|
18051
18123
|
withIdentity ? brandIdentity : null,
|
|
18052
|
-
brandVisual,
|
|
18124
|
+
brandVisual(),
|
|
18053
18125
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", {})
|
|
18054
18126
|
] })
|
|
18055
18127
|
]
|
|
@@ -18060,6 +18132,37 @@ function Login({
|
|
|
18060
18132
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex flex-1 items-center justify-center p-6", children: authBox(variant) }),
|
|
18061
18133
|
footerBar
|
|
18062
18134
|
] });
|
|
18135
|
+
const brandCard = (widthClass, alignRight = false) => /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: cn("w-full", widthClass, BRAND_PANEL_BG), children: /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18136
|
+
"div",
|
|
18137
|
+
{
|
|
18138
|
+
"data-slot": "login-brand-card-content",
|
|
18139
|
+
className: cn("flex flex-col gap-6", alignRight && "text-right"),
|
|
18140
|
+
children: [
|
|
18141
|
+
brandIdentity ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: cn(alignRight && "flex justify-end"), children: brandIdentity }) : null,
|
|
18142
|
+
brandVisual(alignRight)
|
|
18143
|
+
]
|
|
18144
|
+
}
|
|
18145
|
+
) });
|
|
18146
|
+
const overlapAuthCard = /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(
|
|
18147
|
+
"div",
|
|
18148
|
+
{
|
|
18149
|
+
className: cn(
|
|
18150
|
+
"z-10 w-full max-w-[400px]",
|
|
18151
|
+
brandSide === "left" ? "md:-ml-24" : "md:-mr-24"
|
|
18152
|
+
),
|
|
18153
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: "p-2 shadow-xl md:p-4", children: authContent })
|
|
18154
|
+
}
|
|
18155
|
+
);
|
|
18156
|
+
const backdropBrandColumn = /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "relative hidden flex-col justify-between p-10 md:flex", children: [
|
|
18157
|
+
brandIdentity,
|
|
18158
|
+
brandVisual(),
|
|
18159
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", {})
|
|
18160
|
+
] });
|
|
18161
|
+
const backdropAuthColumn = /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)("div", { className: "relative flex min-h-svh flex-col", children: [
|
|
18162
|
+
brandIdentity ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "p-6 md:hidden", children: brandIdentity }) : null,
|
|
18163
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: "w-full max-w-[400px] p-2 shadow-xl md:p-4", children: authContent }) }),
|
|
18164
|
+
footerBar
|
|
18165
|
+
] });
|
|
18063
18166
|
if (layout === "centered") {
|
|
18064
18167
|
return /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18065
18168
|
"div",
|
|
@@ -18088,6 +18191,7 @@ function Login({
|
|
|
18088
18191
|
{
|
|
18089
18192
|
"data-slot": "login",
|
|
18090
18193
|
"data-layout": layout,
|
|
18194
|
+
"data-brand-side": brandSide,
|
|
18091
18195
|
className: cn(
|
|
18092
18196
|
"relative flex min-h-svh w-full flex-col overflow-hidden bg-background p-6 md:p-10",
|
|
18093
18197
|
className
|
|
@@ -18095,13 +18199,13 @@ function Login({
|
|
|
18095
18199
|
style,
|
|
18096
18200
|
children: [
|
|
18097
18201
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18098
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.
|
|
18099
|
-
|
|
18100
|
-
brandIdentity,
|
|
18101
|
-
brandVisual
|
|
18102
|
-
] }) }),
|
|
18202
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "relative flex flex-1 flex-col items-center gap-6 md:flex-row md:gap-10", children: brandSide === "left" ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18203
|
+
brandCard("md:w-[45%]"),
|
|
18103
18204
|
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex w-full flex-1 justify-center", children: authBox("plain") })
|
|
18104
|
-
] }),
|
|
18205
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18206
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex w-full flex-1 justify-center", children: authBox("plain") }),
|
|
18207
|
+
brandCard("md:w-[45%]")
|
|
18208
|
+
] }) }),
|
|
18105
18209
|
footerBar
|
|
18106
18210
|
]
|
|
18107
18211
|
}
|
|
@@ -18113,6 +18217,7 @@ function Login({
|
|
|
18113
18217
|
{
|
|
18114
18218
|
"data-slot": "login",
|
|
18115
18219
|
"data-layout": layout,
|
|
18220
|
+
"data-brand-side": brandSide,
|
|
18116
18221
|
className: cn(
|
|
18117
18222
|
"relative flex min-h-svh w-full flex-col overflow-hidden bg-background p-6 md:p-10",
|
|
18118
18223
|
className
|
|
@@ -18120,13 +18225,13 @@ function Login({
|
|
|
18120
18225
|
style,
|
|
18121
18226
|
children: [
|
|
18122
18227
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18123
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.
|
|
18124
|
-
|
|
18125
|
-
|
|
18126
|
-
|
|
18127
|
-
|
|
18128
|
-
|
|
18129
|
-
] }),
|
|
18228
|
+
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "relative flex flex-1 flex-col items-center justify-center gap-6 md:flex-row md:items-center md:gap-0", children: brandSide === "left" ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18229
|
+
brandCard("md:w-[52%]"),
|
|
18230
|
+
overlapAuthCard
|
|
18231
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18232
|
+
overlapAuthCard,
|
|
18233
|
+
brandCard("md:w-[52%]", true)
|
|
18234
|
+
] }) }),
|
|
18130
18235
|
footerBar
|
|
18131
18236
|
]
|
|
18132
18237
|
}
|
|
@@ -18138,6 +18243,7 @@ function Login({
|
|
|
18138
18243
|
{
|
|
18139
18244
|
"data-slot": "login",
|
|
18140
18245
|
"data-layout": layout,
|
|
18246
|
+
"data-brand-side": brandSide,
|
|
18141
18247
|
className: cn(
|
|
18142
18248
|
"relative grid min-h-svh w-full overflow-hidden bg-linear-to-br from-primary/20 via-accent to-primary/10 md:grid-cols-2 dark:from-primary/25 dark:to-primary/15",
|
|
18143
18249
|
className
|
|
@@ -18145,15 +18251,12 @@ function Login({
|
|
|
18145
18251
|
style,
|
|
18146
18252
|
children: [
|
|
18147
18253
|
decor ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(BgDecor, {}) : null,
|
|
18148
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(
|
|
18149
|
-
|
|
18150
|
-
|
|
18151
|
-
|
|
18152
|
-
|
|
18153
|
-
|
|
18154
|
-
brandIdentity ? /* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "p-6 md:hidden", children: brandIdentity }) : null,
|
|
18155
|
-
/* @__PURE__ */ (0, import_jsx_runtime217.jsx)("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ (0, import_jsx_runtime217.jsx)(Card2, { className: "w-full max-w-[400px] p-2 shadow-xl md:p-4", children: authContent }) }),
|
|
18156
|
-
footerBar
|
|
18254
|
+
brandSide === "left" ? /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18255
|
+
backdropBrandColumn,
|
|
18256
|
+
backdropAuthColumn
|
|
18257
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime217.jsxs)(import_jsx_runtime217.Fragment, { children: [
|
|
18258
|
+
backdropAuthColumn,
|
|
18259
|
+
backdropBrandColumn
|
|
18157
18260
|
] })
|
|
18158
18261
|
]
|
|
18159
18262
|
}
|
|
@@ -18169,6 +18272,7 @@ function Login({
|
|
|
18169
18272
|
{
|
|
18170
18273
|
"data-slot": "login",
|
|
18171
18274
|
"data-layout": layout,
|
|
18275
|
+
"data-brand-side": brandSide,
|
|
18172
18276
|
className: cn(
|
|
18173
18277
|
"grid min-h-svh w-full bg-background md:[grid-template-columns:var(--login-grid)]",
|
|
18174
18278
|
className
|
package/dist/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pactor-app/ui",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.41.0",
|
|
4
4
|
"description": "Pactor UI kit (shadcn): the single built-in UI kit — vendored shadcn/ui components (Base UI primitives + cva + tailwind-merge + lucide-react), props contracts, interaction core (OverlayManager / UiBridge) and layouts, with build-time Tailwind v4 prebuilt styles.css (zero consumer-side Tailwind config)",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"pactor",
|
|
@@ -108,11 +108,11 @@
|
|
|
108
108
|
"react-resizable-panels": "^4.12.3",
|
|
109
109
|
"tailwind-merge": "^3.6.0",
|
|
110
110
|
"vaul": "^1.1.2",
|
|
111
|
-
"@pactor-app/core": "1.
|
|
112
|
-
"@pactor-app/
|
|
113
|
-
"@pactor-app/
|
|
114
|
-
"@pactor-app/router": "1.
|
|
115
|
-
"@pactor-app/
|
|
111
|
+
"@pactor-app/core": "1.41.0",
|
|
112
|
+
"@pactor-app/runtime": "1.41.0",
|
|
113
|
+
"@pactor-app/permission": "1.41.0",
|
|
114
|
+
"@pactor-app/router": "1.41.0",
|
|
115
|
+
"@pactor-app/markdown": "1.41.0"
|
|
116
116
|
},
|
|
117
117
|
"peerDependencies": {
|
|
118
118
|
"react": ">=18",
|