@sikka/hawa 0.19.16-next → 0.19.18-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/index.css +7 -0
- package/dist/index.d.mts +8 -1
- package/dist/index.d.ts +8 -1
- package/dist/index.js +124 -56
- package/dist/index.mjs +124 -56
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -980,6 +980,9 @@ input[type="number"]::-webkit-inner-spin-button,
|
|
|
980
980
|
top: 0px;
|
|
981
981
|
bottom: 0px;
|
|
982
982
|
}
|
|
983
|
+
.-hawa-left-\[1px\] {
|
|
984
|
+
left: -1px;
|
|
985
|
+
}
|
|
983
986
|
.hawa--left-1 {
|
|
984
987
|
left: -0.25rem;
|
|
985
988
|
}
|
|
@@ -1727,6 +1730,10 @@ input[type="number"]::-webkit-inner-spin-button,
|
|
|
1727
1730
|
--tw-translate-y: -0.5rem;
|
|
1728
1731
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1729
1732
|
}
|
|
1733
|
+
.-hawa-translate-y-full {
|
|
1734
|
+
--tw-translate-y: -100%;
|
|
1735
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1736
|
+
}
|
|
1730
1737
|
.hawa--translate-x-0 {
|
|
1731
1738
|
--tw-translate-x: -0px;
|
|
1732
1739
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
package/dist/index.d.mts
CHANGED
|
@@ -68,6 +68,7 @@ type PricingCardProps = {
|
|
|
68
68
|
discount?: string;
|
|
69
69
|
onPlanClicked?: () => void;
|
|
70
70
|
currentPlan?: boolean;
|
|
71
|
+
recommended?: boolean;
|
|
71
72
|
size?: "small" | "medium" | "large";
|
|
72
73
|
isLoading?: boolean;
|
|
73
74
|
texts: {
|
|
@@ -76,6 +77,7 @@ type PricingCardProps = {
|
|
|
76
77
|
buttonText: string;
|
|
77
78
|
cycleText: string;
|
|
78
79
|
currencyText: string;
|
|
80
|
+
recommended?: string;
|
|
79
81
|
};
|
|
80
82
|
};
|
|
81
83
|
declare const PricingCard: FC<PricingCardProps>;
|
|
@@ -245,10 +247,15 @@ type CheckBoxTypes = {
|
|
|
245
247
|
label?: any;
|
|
246
248
|
sublabel?: any;
|
|
247
249
|
helperText?: string;
|
|
250
|
+
size?: "xs" | "sm" | "default" | "md" | "lg" | "xl";
|
|
251
|
+
radius?: RadiusType;
|
|
248
252
|
};
|
|
249
253
|
type CheckboxProps = CheckBoxTypes & React$1.ComponentProps<typeof CheckboxElement>;
|
|
250
254
|
declare const Checkbox: React$1.FC<CheckboxProps>;
|
|
251
|
-
declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> &
|
|
255
|
+
declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
|
|
256
|
+
size?: "xs" | "sm" | "lg" | "xl" | "default" | "md" | undefined;
|
|
257
|
+
radius?: RadiusType | undefined;
|
|
258
|
+
} & React$1.RefAttributes<HTMLButtonElement>>;
|
|
252
259
|
|
|
253
260
|
type RadioOptionsTypes = {
|
|
254
261
|
value: any;
|
package/dist/index.d.ts
CHANGED
|
@@ -68,6 +68,7 @@ type PricingCardProps = {
|
|
|
68
68
|
discount?: string;
|
|
69
69
|
onPlanClicked?: () => void;
|
|
70
70
|
currentPlan?: boolean;
|
|
71
|
+
recommended?: boolean;
|
|
71
72
|
size?: "small" | "medium" | "large";
|
|
72
73
|
isLoading?: boolean;
|
|
73
74
|
texts: {
|
|
@@ -76,6 +77,7 @@ type PricingCardProps = {
|
|
|
76
77
|
buttonText: string;
|
|
77
78
|
cycleText: string;
|
|
78
79
|
currencyText: string;
|
|
80
|
+
recommended?: string;
|
|
79
81
|
};
|
|
80
82
|
};
|
|
81
83
|
declare const PricingCard: FC<PricingCardProps>;
|
|
@@ -245,10 +247,15 @@ type CheckBoxTypes = {
|
|
|
245
247
|
label?: any;
|
|
246
248
|
sublabel?: any;
|
|
247
249
|
helperText?: string;
|
|
250
|
+
size?: "xs" | "sm" | "default" | "md" | "lg" | "xl";
|
|
251
|
+
radius?: RadiusType;
|
|
248
252
|
};
|
|
249
253
|
type CheckboxProps = CheckBoxTypes & React$1.ComponentProps<typeof CheckboxElement>;
|
|
250
254
|
declare const Checkbox: React$1.FC<CheckboxProps>;
|
|
251
|
-
declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> &
|
|
255
|
+
declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
|
|
256
|
+
size?: "xs" | "sm" | "lg" | "xl" | "default" | "md" | undefined;
|
|
257
|
+
radius?: RadiusType | undefined;
|
|
258
|
+
} & React$1.RefAttributes<HTMLButtonElement>>;
|
|
252
259
|
|
|
253
260
|
type RadioOptionsTypes = {
|
|
254
261
|
value: any;
|
package/dist/index.js
CHANGED
|
@@ -868,6 +868,7 @@ var PricingCard = ({
|
|
|
868
868
|
size = "medium",
|
|
869
869
|
direction = "ltr",
|
|
870
870
|
endButton = true,
|
|
871
|
+
recommended,
|
|
871
872
|
currentPlan = false,
|
|
872
873
|
...props
|
|
873
874
|
}) => {
|
|
@@ -884,10 +885,19 @@ var PricingCard = ({
|
|
|
884
885
|
className: cn(
|
|
885
886
|
currentPlan ? "hawa-border-primary dark:hawa-border-primary/70 hawa-border-2 " : "hawa-border",
|
|
886
887
|
cardSizes[size],
|
|
887
|
-
"hawa-flex
|
|
888
|
+
"hawa-flex hawa-gap-4 hawa-p-4 hawa-justify-between hawa-flex-col hawa-relative",
|
|
889
|
+
recommended ? "hawa-rounded hawa-rounded-t-none" : "hawa-rounded"
|
|
888
890
|
)
|
|
889
891
|
},
|
|
890
|
-
|
|
892
|
+
recommended && /* @__PURE__ */ import_react7.default.createElement(
|
|
893
|
+
"div",
|
|
894
|
+
{
|
|
895
|
+
className: "hawa-bg-primary hawa-text-center hawa-text-primary-foreground hawa-p-2 hawa-border hawa-rounded-t hawa-absolute hawa-top-0 -hawa-left-[1px] -hawa-translate-y-full",
|
|
896
|
+
style: { width: "calc(100% + 2px)" }
|
|
897
|
+
},
|
|
898
|
+
props.texts.recommended || "RECOMMENDED"
|
|
899
|
+
),
|
|
900
|
+
/* @__PURE__ */ import_react7.default.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-4 hawa-h-full" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "hawa-text-md hawa-relative hawa-flex hawa-flex-col hawa-justify-between hawa-font-bold hawa-text-primary/70" }, /* @__PURE__ */ import_react7.default.createElement("span", null, props.texts.title), /* @__PURE__ */ import_react7.default.createElement("h5", { className: "hawa-text-sm hawa-font-normal hawa-text-primary/70" }, props.texts.subtitle), props.discount && /* @__PURE__ */ import_react7.default.createElement("span", { className: "hawa-absolute hawa-end-0" }, /* @__PURE__ */ import_react7.default.createElement(Chip, { label: props.discount, size: "large", color: "hyper" }))), /* @__PURE__ */ import_react7.default.createElement("div", { className: " hawa-text-primary hawa-flex hawa-items-baseline" }, props.isLoading ? /* @__PURE__ */ import_react7.default.createElement(Skeleton, { className: "hawa-w-full hawa-max-w-[200px] hawa-h-[48px] hawa-p-0 " }) : /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2 hawa-items-end" }, props.oldPrice && /* @__PURE__ */ import_react7.default.createElement("span", { className: "hawa-line-through hawa-opacity-70" }, props.oldPrice + " " + props.texts.currencyText), /* @__PURE__ */ import_react7.default.createElement("span", { className: "hawa-text-5xl hawa-font-extrabold hawa-tracking-tight" }, props.price)), /* @__PURE__ */ import_react7.default.createElement("span", { className: "hawa-mx-1 hawa-text-sm hawa-font-semibold" }, props.texts.currencyText)), /* @__PURE__ */ import_react7.default.createElement("span", { className: "hawa-ml-1 hawa-text-xl hawa-whitespace-nowrap hawa-font-normal hawa-text-primary/70" }, "/ ", props.texts.cycleText))), endButton && /* @__PURE__ */ import_react7.default.createElement(Separator, null), /* @__PURE__ */ import_react7.default.createElement(
|
|
891
901
|
"div",
|
|
892
902
|
{
|
|
893
903
|
className: cn(
|
|
@@ -3466,73 +3476,131 @@ var Checkbox = ({
|
|
|
3466
3476
|
sublabel,
|
|
3467
3477
|
helperText,
|
|
3468
3478
|
disabled,
|
|
3479
|
+
size = "default",
|
|
3480
|
+
radius = "inherit",
|
|
3469
3481
|
...props
|
|
3470
3482
|
}) => {
|
|
3471
|
-
|
|
3472
|
-
|
|
3473
|
-
|
|
3474
|
-
|
|
3475
|
-
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
), sublabel && /* @__PURE__ */ React20.createElement(
|
|
3482
|
-
"label",
|
|
3483
|
-
{
|
|
3484
|
-
htmlFor: id,
|
|
3485
|
-
className: cn(
|
|
3486
|
-
"hawa-w-fit hawa-select-none hawa-text-sm hawa-text-muted-foreground",
|
|
3487
|
-
disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70" : "hawa-cursor-pointer"
|
|
3488
|
-
)
|
|
3489
|
-
},
|
|
3490
|
-
sublabel
|
|
3491
|
-
), helperText && !disabled && /* @__PURE__ */ React20.createElement(
|
|
3492
|
-
"label",
|
|
3483
|
+
let labelLineHeightStyles = {
|
|
3484
|
+
xs: sublabel || helperText ? 0.5 : 0.1,
|
|
3485
|
+
sm: 0.6,
|
|
3486
|
+
default: 0.7,
|
|
3487
|
+
md: 0.8,
|
|
3488
|
+
lg: 0.9,
|
|
3489
|
+
xl: 1
|
|
3490
|
+
};
|
|
3491
|
+
return /* @__PURE__ */ React20.createElement(
|
|
3492
|
+
"div",
|
|
3493
3493
|
{
|
|
3494
|
-
htmlFor: id,
|
|
3495
3494
|
className: cn(
|
|
3496
|
-
"hawa-
|
|
3497
|
-
|
|
3495
|
+
"hawa-flex hawa-gap-2",
|
|
3496
|
+
"hawa-items-top",
|
|
3497
|
+
sublabel || helperText ? "hawa-items-top" : "hawa-items-center"
|
|
3498
3498
|
)
|
|
3499
3499
|
},
|
|
3500
|
-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
|
|
3506
|
-
|
|
3507
|
-
|
|
3508
|
-
|
|
3509
|
-
className
|
|
3500
|
+
/* @__PURE__ */ React20.createElement(
|
|
3501
|
+
CheckboxElement,
|
|
3502
|
+
{
|
|
3503
|
+
...props,
|
|
3504
|
+
size,
|
|
3505
|
+
radius,
|
|
3506
|
+
disabled,
|
|
3507
|
+
id
|
|
3508
|
+
}
|
|
3510
3509
|
),
|
|
3511
|
-
|
|
3512
|
-
|
|
3513
|
-
|
|
3514
|
-
|
|
3510
|
+
(label || helperText) && /* @__PURE__ */ React20.createElement("div", { className: "hawa-grid hawa-gap-1.5 hawa-leading-none" }, label && /* @__PURE__ */ React20.createElement(
|
|
3511
|
+
"label",
|
|
3512
|
+
{
|
|
3513
|
+
htmlFor: id,
|
|
3514
|
+
className: cn(
|
|
3515
|
+
"hawa-w-fit hawa-select-none hawa-text-sm hawa-font-medium hawa-leading-none hawa-pt-0.5",
|
|
3516
|
+
disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70 " : "hawa-cursor-pointer"
|
|
3517
|
+
),
|
|
3518
|
+
style: {
|
|
3519
|
+
lineHeight: labelLineHeightStyles[size]
|
|
3520
|
+
}
|
|
3521
|
+
},
|
|
3522
|
+
label
|
|
3523
|
+
), sublabel && /* @__PURE__ */ React20.createElement(
|
|
3524
|
+
"label",
|
|
3525
|
+
{
|
|
3526
|
+
htmlFor: id,
|
|
3527
|
+
className: cn(
|
|
3528
|
+
"hawa-w-fit hawa-select-none hawa-text-sm hawa-text-muted-foreground",
|
|
3529
|
+
disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70" : "hawa-cursor-pointer"
|
|
3530
|
+
)
|
|
3531
|
+
},
|
|
3532
|
+
sublabel
|
|
3533
|
+
), helperText && !disabled && /* @__PURE__ */ React20.createElement(
|
|
3534
|
+
"label",
|
|
3535
|
+
{
|
|
3536
|
+
htmlFor: id,
|
|
3537
|
+
className: cn(
|
|
3538
|
+
"hawa-w-fit hawa-select-none hawa-text-xs hawa-text-helper-color",
|
|
3539
|
+
disabled && "hawa-cursor-not-allowed hawa-opacity-70"
|
|
3540
|
+
)
|
|
3541
|
+
},
|
|
3542
|
+
helperText
|
|
3543
|
+
))
|
|
3544
|
+
);
|
|
3545
|
+
};
|
|
3546
|
+
var CheckboxElement = React20.forwardRef(({ radius = "inherit", size = "default", className, ...props }, ref) => {
|
|
3547
|
+
let checkboxRadius = {
|
|
3548
|
+
none: "hawa-rounded-none",
|
|
3549
|
+
inherit: "hawa-rounded-sm",
|
|
3550
|
+
full: "hawa-rounded-full"
|
|
3551
|
+
};
|
|
3552
|
+
let checkboxSizes = {
|
|
3553
|
+
xs: "hawa-w-3 hawa-h-3",
|
|
3554
|
+
sm: "hawa-w-6 hawa-h-6",
|
|
3555
|
+
default: "hawa-icon",
|
|
3556
|
+
md: "hawa-w-8 hawa-h-8",
|
|
3557
|
+
lg: "hawa-w-10 hawa-h-10",
|
|
3558
|
+
xl: "hawa-w-12 hawa-h-12"
|
|
3559
|
+
};
|
|
3560
|
+
let checkboxIndicatorSizes = {
|
|
3561
|
+
xs: "0.5em",
|
|
3562
|
+
default: "0.60em",
|
|
3563
|
+
sm: "0.75em",
|
|
3564
|
+
md: "0.875em",
|
|
3565
|
+
lg: "1em",
|
|
3566
|
+
xl: "1.25em"
|
|
3567
|
+
};
|
|
3568
|
+
return /* @__PURE__ */ React20.createElement(
|
|
3569
|
+
CheckboxPrimitive.Root,
|
|
3515
3570
|
{
|
|
3571
|
+
ref,
|
|
3516
3572
|
className: cn(
|
|
3517
|
-
"hawa-
|
|
3518
|
-
|
|
3573
|
+
"hawa-peer hawa-shrink-0 hawa-border hawa-border-primary hawa-ring-offset-background focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50 data-[state=checked]:hawa-bg-primary data-[state=checked]:hawa-text-primary-foreground",
|
|
3574
|
+
checkboxSizes[size],
|
|
3575
|
+
checkboxRadius[radius],
|
|
3576
|
+
className
|
|
3577
|
+
),
|
|
3578
|
+
...props
|
|
3519
3579
|
},
|
|
3520
3580
|
/* @__PURE__ */ React20.createElement(
|
|
3521
|
-
|
|
3581
|
+
CheckboxPrimitive.Indicator,
|
|
3522
3582
|
{
|
|
3523
|
-
|
|
3524
|
-
|
|
3525
|
-
|
|
3526
|
-
strokeWidth: "0",
|
|
3527
|
-
viewBox: "0 0 512 512",
|
|
3528
|
-
height: "0.60em",
|
|
3529
|
-
width: "0.60em"
|
|
3583
|
+
className: cn(
|
|
3584
|
+
"hawa-flex hawa-items-center hawa-justify-center hawa-text-current"
|
|
3585
|
+
)
|
|
3530
3586
|
},
|
|
3531
|
-
/* @__PURE__ */ React20.createElement(
|
|
3532
|
-
|
|
3533
|
-
|
|
3534
|
-
|
|
3535
|
-
|
|
3587
|
+
/* @__PURE__ */ React20.createElement(
|
|
3588
|
+
"svg",
|
|
3589
|
+
{
|
|
3590
|
+
"aria-label": "Check Mark",
|
|
3591
|
+
stroke: "currentColor",
|
|
3592
|
+
fill: "currentColor",
|
|
3593
|
+
strokeWidth: "0",
|
|
3594
|
+
viewBox: "0 0 512 512",
|
|
3595
|
+
height: checkboxIndicatorSizes[size],
|
|
3596
|
+
width: checkboxIndicatorSizes[size]
|
|
3597
|
+
},
|
|
3598
|
+
/* @__PURE__ */ React20.createElement("path", { d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })
|
|
3599
|
+
),
|
|
3600
|
+
" "
|
|
3601
|
+
)
|
|
3602
|
+
);
|
|
3603
|
+
});
|
|
3536
3604
|
CheckboxElement.displayName = CheckboxPrimitive.Root.displayName;
|
|
3537
3605
|
|
|
3538
3606
|
// components/elements/Radio.tsx
|
package/dist/index.mjs
CHANGED
|
@@ -635,6 +635,7 @@ var PricingCard = ({
|
|
|
635
635
|
size = "medium",
|
|
636
636
|
direction = "ltr",
|
|
637
637
|
endButton = true,
|
|
638
|
+
recommended,
|
|
638
639
|
currentPlan = false,
|
|
639
640
|
...props
|
|
640
641
|
}) => {
|
|
@@ -651,10 +652,19 @@ var PricingCard = ({
|
|
|
651
652
|
className: cn(
|
|
652
653
|
currentPlan ? "hawa-border-primary dark:hawa-border-primary/70 hawa-border-2 " : "hawa-border",
|
|
653
654
|
cardSizes[size],
|
|
654
|
-
"hawa-flex
|
|
655
|
+
"hawa-flex hawa-gap-4 hawa-p-4 hawa-justify-between hawa-flex-col hawa-relative",
|
|
656
|
+
recommended ? "hawa-rounded hawa-rounded-t-none" : "hawa-rounded"
|
|
655
657
|
)
|
|
656
658
|
},
|
|
657
|
-
|
|
659
|
+
recommended && /* @__PURE__ */ React11.createElement(
|
|
660
|
+
"div",
|
|
661
|
+
{
|
|
662
|
+
className: "hawa-bg-primary hawa-text-center hawa-text-primary-foreground hawa-p-2 hawa-border hawa-rounded-t hawa-absolute hawa-top-0 -hawa-left-[1px] -hawa-translate-y-full",
|
|
663
|
+
style: { width: "calc(100% + 2px)" }
|
|
664
|
+
},
|
|
665
|
+
props.texts.recommended || "RECOMMENDED"
|
|
666
|
+
),
|
|
667
|
+
/* @__PURE__ */ React11.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-4 hawa-h-full" }, /* @__PURE__ */ React11.createElement("div", { className: "hawa-text-md hawa-relative hawa-flex hawa-flex-col hawa-justify-between hawa-font-bold hawa-text-primary/70" }, /* @__PURE__ */ React11.createElement("span", null, props.texts.title), /* @__PURE__ */ React11.createElement("h5", { className: "hawa-text-sm hawa-font-normal hawa-text-primary/70" }, props.texts.subtitle), props.discount && /* @__PURE__ */ React11.createElement("span", { className: "hawa-absolute hawa-end-0" }, /* @__PURE__ */ React11.createElement(Chip, { label: props.discount, size: "large", color: "hyper" }))), /* @__PURE__ */ React11.createElement("div", { className: " hawa-text-primary hawa-flex hawa-items-baseline" }, props.isLoading ? /* @__PURE__ */ React11.createElement(Skeleton, { className: "hawa-w-full hawa-max-w-[200px] hawa-h-[48px] hawa-p-0 " }) : /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2 hawa-items-end" }, props.oldPrice && /* @__PURE__ */ React11.createElement("span", { className: "hawa-line-through hawa-opacity-70" }, props.oldPrice + " " + props.texts.currencyText), /* @__PURE__ */ React11.createElement("span", { className: "hawa-text-5xl hawa-font-extrabold hawa-tracking-tight" }, props.price)), /* @__PURE__ */ React11.createElement("span", { className: "hawa-mx-1 hawa-text-sm hawa-font-semibold" }, props.texts.currencyText)), /* @__PURE__ */ React11.createElement("span", { className: "hawa-ml-1 hawa-text-xl hawa-whitespace-nowrap hawa-font-normal hawa-text-primary/70" }, "/ ", props.texts.cycleText))), endButton && /* @__PURE__ */ React11.createElement(Separator, null), /* @__PURE__ */ React11.createElement(
|
|
658
668
|
"div",
|
|
659
669
|
{
|
|
660
670
|
className: cn(
|
|
@@ -3233,73 +3243,131 @@ var Checkbox = ({
|
|
|
3233
3243
|
sublabel,
|
|
3234
3244
|
helperText,
|
|
3235
3245
|
disabled,
|
|
3246
|
+
size = "default",
|
|
3247
|
+
radius = "inherit",
|
|
3236
3248
|
...props
|
|
3237
3249
|
}) => {
|
|
3238
|
-
|
|
3239
|
-
|
|
3240
|
-
|
|
3241
|
-
|
|
3242
|
-
|
|
3243
|
-
|
|
3244
|
-
|
|
3245
|
-
|
|
3246
|
-
|
|
3247
|
-
|
|
3248
|
-
), sublabel && /* @__PURE__ */ React20.createElement(
|
|
3249
|
-
"label",
|
|
3250
|
-
{
|
|
3251
|
-
htmlFor: id,
|
|
3252
|
-
className: cn(
|
|
3253
|
-
"hawa-w-fit hawa-select-none hawa-text-sm hawa-text-muted-foreground",
|
|
3254
|
-
disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70" : "hawa-cursor-pointer"
|
|
3255
|
-
)
|
|
3256
|
-
},
|
|
3257
|
-
sublabel
|
|
3258
|
-
), helperText && !disabled && /* @__PURE__ */ React20.createElement(
|
|
3259
|
-
"label",
|
|
3250
|
+
let labelLineHeightStyles = {
|
|
3251
|
+
xs: sublabel || helperText ? 0.5 : 0.1,
|
|
3252
|
+
sm: 0.6,
|
|
3253
|
+
default: 0.7,
|
|
3254
|
+
md: 0.8,
|
|
3255
|
+
lg: 0.9,
|
|
3256
|
+
xl: 1
|
|
3257
|
+
};
|
|
3258
|
+
return /* @__PURE__ */ React20.createElement(
|
|
3259
|
+
"div",
|
|
3260
3260
|
{
|
|
3261
|
-
htmlFor: id,
|
|
3262
3261
|
className: cn(
|
|
3263
|
-
"hawa-
|
|
3264
|
-
|
|
3262
|
+
"hawa-flex hawa-gap-2",
|
|
3263
|
+
"hawa-items-top",
|
|
3264
|
+
sublabel || helperText ? "hawa-items-top" : "hawa-items-center"
|
|
3265
3265
|
)
|
|
3266
3266
|
},
|
|
3267
|
-
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
|
|
3275
|
-
|
|
3276
|
-
className
|
|
3267
|
+
/* @__PURE__ */ React20.createElement(
|
|
3268
|
+
CheckboxElement,
|
|
3269
|
+
{
|
|
3270
|
+
...props,
|
|
3271
|
+
size,
|
|
3272
|
+
radius,
|
|
3273
|
+
disabled,
|
|
3274
|
+
id
|
|
3275
|
+
}
|
|
3277
3276
|
),
|
|
3278
|
-
|
|
3279
|
-
|
|
3280
|
-
|
|
3281
|
-
|
|
3277
|
+
(label || helperText) && /* @__PURE__ */ React20.createElement("div", { className: "hawa-grid hawa-gap-1.5 hawa-leading-none" }, label && /* @__PURE__ */ React20.createElement(
|
|
3278
|
+
"label",
|
|
3279
|
+
{
|
|
3280
|
+
htmlFor: id,
|
|
3281
|
+
className: cn(
|
|
3282
|
+
"hawa-w-fit hawa-select-none hawa-text-sm hawa-font-medium hawa-leading-none hawa-pt-0.5",
|
|
3283
|
+
disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70 " : "hawa-cursor-pointer"
|
|
3284
|
+
),
|
|
3285
|
+
style: {
|
|
3286
|
+
lineHeight: labelLineHeightStyles[size]
|
|
3287
|
+
}
|
|
3288
|
+
},
|
|
3289
|
+
label
|
|
3290
|
+
), sublabel && /* @__PURE__ */ React20.createElement(
|
|
3291
|
+
"label",
|
|
3292
|
+
{
|
|
3293
|
+
htmlFor: id,
|
|
3294
|
+
className: cn(
|
|
3295
|
+
"hawa-w-fit hawa-select-none hawa-text-sm hawa-text-muted-foreground",
|
|
3296
|
+
disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70" : "hawa-cursor-pointer"
|
|
3297
|
+
)
|
|
3298
|
+
},
|
|
3299
|
+
sublabel
|
|
3300
|
+
), helperText && !disabled && /* @__PURE__ */ React20.createElement(
|
|
3301
|
+
"label",
|
|
3302
|
+
{
|
|
3303
|
+
htmlFor: id,
|
|
3304
|
+
className: cn(
|
|
3305
|
+
"hawa-w-fit hawa-select-none hawa-text-xs hawa-text-helper-color",
|
|
3306
|
+
disabled && "hawa-cursor-not-allowed hawa-opacity-70"
|
|
3307
|
+
)
|
|
3308
|
+
},
|
|
3309
|
+
helperText
|
|
3310
|
+
))
|
|
3311
|
+
);
|
|
3312
|
+
};
|
|
3313
|
+
var CheckboxElement = React20.forwardRef(({ radius = "inherit", size = "default", className, ...props }, ref) => {
|
|
3314
|
+
let checkboxRadius = {
|
|
3315
|
+
none: "hawa-rounded-none",
|
|
3316
|
+
inherit: "hawa-rounded-sm",
|
|
3317
|
+
full: "hawa-rounded-full"
|
|
3318
|
+
};
|
|
3319
|
+
let checkboxSizes = {
|
|
3320
|
+
xs: "hawa-w-3 hawa-h-3",
|
|
3321
|
+
sm: "hawa-w-6 hawa-h-6",
|
|
3322
|
+
default: "hawa-icon",
|
|
3323
|
+
md: "hawa-w-8 hawa-h-8",
|
|
3324
|
+
lg: "hawa-w-10 hawa-h-10",
|
|
3325
|
+
xl: "hawa-w-12 hawa-h-12"
|
|
3326
|
+
};
|
|
3327
|
+
let checkboxIndicatorSizes = {
|
|
3328
|
+
xs: "0.5em",
|
|
3329
|
+
default: "0.60em",
|
|
3330
|
+
sm: "0.75em",
|
|
3331
|
+
md: "0.875em",
|
|
3332
|
+
lg: "1em",
|
|
3333
|
+
xl: "1.25em"
|
|
3334
|
+
};
|
|
3335
|
+
return /* @__PURE__ */ React20.createElement(
|
|
3336
|
+
CheckboxPrimitive.Root,
|
|
3282
3337
|
{
|
|
3338
|
+
ref,
|
|
3283
3339
|
className: cn(
|
|
3284
|
-
"hawa-
|
|
3285
|
-
|
|
3340
|
+
"hawa-peer hawa-shrink-0 hawa-border hawa-border-primary hawa-ring-offset-background focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50 data-[state=checked]:hawa-bg-primary data-[state=checked]:hawa-text-primary-foreground",
|
|
3341
|
+
checkboxSizes[size],
|
|
3342
|
+
checkboxRadius[radius],
|
|
3343
|
+
className
|
|
3344
|
+
),
|
|
3345
|
+
...props
|
|
3286
3346
|
},
|
|
3287
3347
|
/* @__PURE__ */ React20.createElement(
|
|
3288
|
-
|
|
3348
|
+
CheckboxPrimitive.Indicator,
|
|
3289
3349
|
{
|
|
3290
|
-
|
|
3291
|
-
|
|
3292
|
-
|
|
3293
|
-
strokeWidth: "0",
|
|
3294
|
-
viewBox: "0 0 512 512",
|
|
3295
|
-
height: "0.60em",
|
|
3296
|
-
width: "0.60em"
|
|
3350
|
+
className: cn(
|
|
3351
|
+
"hawa-flex hawa-items-center hawa-justify-center hawa-text-current"
|
|
3352
|
+
)
|
|
3297
3353
|
},
|
|
3298
|
-
/* @__PURE__ */ React20.createElement(
|
|
3299
|
-
|
|
3300
|
-
|
|
3301
|
-
|
|
3302
|
-
|
|
3354
|
+
/* @__PURE__ */ React20.createElement(
|
|
3355
|
+
"svg",
|
|
3356
|
+
{
|
|
3357
|
+
"aria-label": "Check Mark",
|
|
3358
|
+
stroke: "currentColor",
|
|
3359
|
+
fill: "currentColor",
|
|
3360
|
+
strokeWidth: "0",
|
|
3361
|
+
viewBox: "0 0 512 512",
|
|
3362
|
+
height: checkboxIndicatorSizes[size],
|
|
3363
|
+
width: checkboxIndicatorSizes[size]
|
|
3364
|
+
},
|
|
3365
|
+
/* @__PURE__ */ React20.createElement("path", { d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })
|
|
3366
|
+
),
|
|
3367
|
+
" "
|
|
3368
|
+
)
|
|
3369
|
+
);
|
|
3370
|
+
});
|
|
3303
3371
|
CheckboxElement.displayName = CheckboxPrimitive.Root.displayName;
|
|
3304
3372
|
|
|
3305
3373
|
// components/elements/Radio.tsx
|