myshell-react-lib 0.1.54 → 0.1.55
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.cjs +23 -23
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +23 -23
- package/dist/index.js.map +1 -1
- package/dist/styles/components-dark.scss +20 -20
- package/dist/styles/components-light.scss +1 -1
- package/dist/styles/design2-dark.scss +19 -21
- package/dist/styles/design2-light.scss +3 -2
- package/dist/styles/new-tokens.scss +5 -5
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -5785,7 +5785,7 @@ function createButtonWithVariant(props, ref) {
|
|
|
5785
5785
|
size: size
|
|
5786
5786
|
}),
|
|
5787
5787
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", {
|
|
5788
|
-
className: cn("inline-flex w-full items-center justify-center", loading ? "opacity-0" : "opacity-100", variant === "plain" && "font-medium"),
|
|
5788
|
+
className: cn("inline-flex w-full items-center justify-center space-x-1.5", loading ? "opacity-0" : "opacity-100", variant === "plain" && "font-medium"),
|
|
5789
5789
|
children: [
|
|
5790
5790
|
!asset && icon && !iconOutBox && iconDirection === "left" && renderIcon(icon, "left", {
|
|
5791
5791
|
loading: loading,
|
|
@@ -6190,7 +6190,7 @@ var PopoverContent = React8.forwardRef(function(_param, ref) {
|
|
|
6190
6190
|
arrowPadding: arrowPadding,
|
|
6191
6191
|
side: side,
|
|
6192
6192
|
forceMount: true,
|
|
6193
|
-
className: cn("relative z-[49] mx-4 w-fit max-w-72 rounded-md border border-Colors-Border-Opaque p-3 text-left text-xs shadow-modal-default outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 [&[data-state=open]>span]:animate-none", variant === "default" ? mode === "popover" ? "bg-Colors-Background-
|
|
6193
|
+
className: cn("relative z-[49] mx-4 w-fit max-w-72 rounded-md border border-Colors-Border-Opaque p-3 text-left text-xs shadow-modal-default outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 [&[data-state=open]>span]:animate-none", variant === "default" ? mode === "popover" ? "bg-Colors-Background-Utilities-Modal border-Colors-Border-Opaque text-Colors-Text-Default" : "bg-cc-Tooltip-bg-default text-cc-Tooltip-fg-default border border-cc-Tooltip-border-default" : "bg-Colors-Utility-Lake-Blue-50 text-Colors-Text-Static-White", className)
|
|
6194
6194
|
}, props), {
|
|
6195
6195
|
children: [
|
|
6196
6196
|
children,
|
|
@@ -6813,7 +6813,7 @@ var DropdownMenuSubTrigger = React13.forwardRef(function(_param, ref) {
|
|
|
6813
6813
|
]);
|
|
6814
6814
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(DropdownMenuPrimitive.SubTrigger, _object_spread_props(_object_spread({
|
|
6815
6815
|
ref: ref,
|
|
6816
|
-
className: cn("flex cursor-default select-none items-center rounded-
|
|
6816
|
+
className: cn("flex cursor-default select-none items-center rounded-sm px-3 py-2 outline-none focus:bg-Colors-Background-Neutral-Primary-Default data-[state=open]:bg-Colors-Background-Neutral-Primary-Default", inset && "pl-8", className)
|
|
6817
6817
|
}, props), {
|
|
6818
6818
|
children: [
|
|
6819
6819
|
children,
|
|
@@ -6830,7 +6830,7 @@ var DropdownMenuSubContent = React13.forwardRef(function(_param, ref) {
|
|
|
6830
6830
|
]);
|
|
6831
6831
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DropdownMenuPrimitive.SubContent, _object_spread({
|
|
6832
6832
|
ref: ref,
|
|
6833
|
-
className: cn("z-50 min-w-[8rem] overflow-hidden rounded-
|
|
6833
|
+
className: cn("z-50 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-Colors-Background-Utilities-Modal p-2 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className)
|
|
6834
6834
|
}, props));
|
|
6835
6835
|
});
|
|
6836
6836
|
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
|
|
@@ -6842,7 +6842,7 @@ var DropdownMenuContent = React13.forwardRef(function(_param, ref) {
|
|
|
6842
6842
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DropdownMenuPrimitive.Content, _object_spread({
|
|
6843
6843
|
ref: ref,
|
|
6844
6844
|
sideOffset: sideOffset,
|
|
6845
|
-
className: cn("z-[100] min-w-[8rem] overflow-hidden rounded-
|
|
6845
|
+
className: cn("z-[100] min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Opaque bg-Colors-Background-Normal-Primary-Default p-1 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className)
|
|
6846
6846
|
}, props));
|
|
6847
6847
|
});
|
|
6848
6848
|
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
@@ -6853,7 +6853,7 @@ var DropdownMenuItem = React13.forwardRef(function(_param, ref) {
|
|
|
6853
6853
|
]);
|
|
6854
6854
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DropdownMenuPrimitive.Item, _object_spread({
|
|
6855
6855
|
ref: ref,
|
|
6856
|
-
className: cn("relative flex cursor-default select-none items-center rounded-
|
|
6856
|
+
className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1 outline-none transition-colors focus:bg-Colors-Background-Neutral-Primary-Default data-[disabled]:pointer-events-none data-[disabled]:opacity-30", inset && "pl-8", className)
|
|
6857
6857
|
}, props));
|
|
6858
6858
|
});
|
|
6859
6859
|
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
@@ -6865,7 +6865,7 @@ var DropdownMenuCheckboxItem = React13.forwardRef(function(_param, ref) {
|
|
|
6865
6865
|
]);
|
|
6866
6866
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(DropdownMenuPrimitive.CheckboxItem, _object_spread_props(_object_spread({
|
|
6867
6867
|
ref: ref,
|
|
6868
|
-
className: cn("relative flex cursor-default select-none items-center rounded-
|
|
6868
|
+
className: cn("relative flex cursor-default select-none items-center rounded-xs py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-slate-100 focus:text-slate-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-30", className),
|
|
6869
6869
|
checked: checked
|
|
6870
6870
|
}, props), {
|
|
6871
6871
|
children: [
|
|
@@ -6889,7 +6889,7 @@ var DropdownMenuRadioItem = React13.forwardRef(function(_param, ref) {
|
|
|
6889
6889
|
]);
|
|
6890
6890
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(DropdownMenuPrimitive.RadioItem, _object_spread_props(_object_spread({
|
|
6891
6891
|
ref: ref,
|
|
6892
|
-
className: cn("relative flex cursor-default select-none items-center rounded-
|
|
6892
|
+
className: cn("relative flex cursor-default select-none items-center rounded-xs py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-slate-100 focus:text-slate-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-slate-800 dark:focus:text-slate-50", className)
|
|
6893
6893
|
}, props), {
|
|
6894
6894
|
children: [
|
|
6895
6895
|
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", {
|
|
@@ -8563,7 +8563,7 @@ var ModalContent = React27.forwardRef(function(_param, ref) {
|
|
|
8563
8563
|
"children"
|
|
8564
8564
|
]);
|
|
8565
8565
|
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(DialogPrimitive2.Content, _object_spread_props(_object_spread({
|
|
8566
|
-
className: cn("absolute left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2 !touch-auto !select-text", "duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] focus
|
|
8566
|
+
className: cn("absolute left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2 !touch-auto !select-text", "duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] outline-none focus-visible:!outline-none ", className)
|
|
8567
8567
|
}, props), {
|
|
8568
8568
|
children: children
|
|
8569
8569
|
}));
|
|
@@ -8599,7 +8599,7 @@ var ModalTitle = React27.forwardRef(function(_param, ref) {
|
|
|
8599
8599
|
}));
|
|
8600
8600
|
});
|
|
8601
8601
|
ModalTitle.displayName = DialogPrimitive2.Title.displayName;
|
|
8602
|
-
var modalVariants = (0, import_class_variance_authority12.cva)("", {
|
|
8602
|
+
var modalVariants = (0, import_class_variance_authority12.cva)("focus-visible:outline-none", {
|
|
8603
8603
|
variants: {
|
|
8604
8604
|
size: {
|
|
8605
8605
|
lg: "w-[720px] max-h-[600px]",
|
|
@@ -8649,7 +8649,7 @@ var Modal = function(_param) {
|
|
|
8649
8649
|
var isMobile2 = (0, import_react_use6.useMedia)("(max-width: 768px)");
|
|
8650
8650
|
if (isMobile2 && !modalOnly && !isNotification) {
|
|
8651
8651
|
var drawerContent = /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_vaul2.Drawer.Content, {
|
|
8652
|
-
className: cn("fixed inset-x-0 bottom-0 z-50 h-auto overflow-hidden no-scrollbar border-Colors-Border-Opaque bg-Colors-Background-
|
|
8652
|
+
className: cn("fixed inset-x-0 bottom-0 z-50 h-auto overflow-hidden no-scrollbar border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal shadow-modal-default focus:outline-none", fullScreen ? "rounded-t-none max-h-full" : "rounded-t-md max-h-[85vh]", contentClassName),
|
|
8653
8653
|
onOpenAutoFocus: function(e) {
|
|
8654
8654
|
!autoFocus && e.preventDefault();
|
|
8655
8655
|
},
|
|
@@ -8744,7 +8744,7 @@ var Modal = function(_param) {
|
|
|
8744
8744
|
}
|
|
8745
8745
|
};
|
|
8746
8746
|
var dialogContent = /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(ModalContent, {
|
|
8747
|
-
className: cn("rounded-md border-Colors-Border-Opaque bg-Colors-Background-
|
|
8747
|
+
className: cn("rounded-md border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal shadow-modal-default overflow-hidden", !isMobile2 ? modalVariants({
|
|
8748
8748
|
size: size,
|
|
8749
8749
|
zIndex: zIndex
|
|
8750
8750
|
}) : isLogin ? "w-[90%]" : "w-[80%]", isNotification && "w-[312px] md:w-[380px]", contentClassName),
|
|
@@ -11547,14 +11547,14 @@ function TopNavigationBar(param) {
|
|
|
11547
11547
|
href: backUrl,
|
|
11548
11548
|
className: "flex justify-center items-center",
|
|
11549
11549
|
children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(IconButton, {
|
|
11550
|
-
variant:
|
|
11551
|
-
color:
|
|
11550
|
+
variant: "plain",
|
|
11551
|
+
color: "default",
|
|
11552
11552
|
size: "md",
|
|
11553
11553
|
icon: ArrowLeftIcon
|
|
11554
11554
|
})
|
|
11555
11555
|
}) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(IconButton, {
|
|
11556
|
-
variant:
|
|
11557
|
-
color:
|
|
11556
|
+
variant: "plain",
|
|
11557
|
+
color: "default",
|
|
11558
11558
|
size: "md",
|
|
11559
11559
|
icon: ArrowLeftIcon,
|
|
11560
11560
|
onClick: onBack
|
|
@@ -12422,7 +12422,7 @@ var Tab = React37.forwardRef(function(_param, ref) {
|
|
|
12422
12422
|
}, tooltip), {
|
|
12423
12423
|
children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TabsPrimitive.Trigger, _object_spread_props(_object_spread({
|
|
12424
12424
|
ref: ref,
|
|
12425
|
-
className: cn("tabtrigger min-w-fit", tabVariants({
|
|
12425
|
+
className: cn("tabtrigger min-w-fit outline-none focus:!outline-none focus-visible:!outline-none", tabVariants({
|
|
12426
12426
|
variant: variant,
|
|
12427
12427
|
size: size,
|
|
12428
12428
|
rounded: rounded
|
|
@@ -12501,7 +12501,7 @@ var Textarea = React38.forwardRef(function(_param, ref) {
|
|
|
12501
12501
|
className: "relative",
|
|
12502
12502
|
children: [
|
|
12503
12503
|
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("textarea", _object_spread({
|
|
12504
|
-
className: cn("w-full min-h-[123px] p-3
|
|
12504
|
+
className: cn("w-full min-h-[123px] p-3 rounded-sm border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active ", "text-sm text-Colors-Text-Default placeholder:text-Colors-Text-Subtlest", "hover:border-Colors-Border-Hover bg-cc-Input-bg-default hover:bg-cc-Input-bg-hover disabled:bg-cc-Input-bg-disabled aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Background-Critical-Subtle", "aria-[invalid=true]:focus-visible:ring-error file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler", "disabled:cursor-not-allowed disabled:opacity-30", maxLength && ((value1 === null || value1 === void 0 ? void 0 : (_value_toString = value1.toString()) === null || _value_toString === void 0 ? void 0 : _value_toString.length) || 0) > maxLength || error ? "border-Colors-Border-Critical hover:bg-Colors-Background-Critical-Subtle focus-visible:ring-error" : "", className),
|
|
12505
12505
|
ref: ref,
|
|
12506
12506
|
maxLength: maxLength,
|
|
12507
12507
|
value: value1,
|
|
@@ -12897,10 +12897,10 @@ ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
|
|
|
12897
12897
|
var toastVariants = (0, import_class_variance_authority20.cva)("group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-sm border border-Colors-Border-Opaque p-6 pr-8 shadow-modal-default transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 max-w-md", {
|
|
12898
12898
|
variants: {
|
|
12899
12899
|
variant: {
|
|
12900
|
-
info: "bg-Colors-Background-
|
|
12901
|
-
warning: "bg-Colors-Background-
|
|
12902
|
-
error: "bg-Colors-Background-
|
|
12903
|
-
success: "bg-Colors-Background-
|
|
12900
|
+
info: "bg-Colors-Background-Utilities-Modal p-4",
|
|
12901
|
+
warning: "bg-Colors-Background-Utilities-Modal p-4",
|
|
12902
|
+
error: "bg-Colors-Background-Utilities-Modal p-4",
|
|
12903
|
+
success: "bg-Colors-Background-Utilities-Modal p-4"
|
|
12904
12904
|
},
|
|
12905
12905
|
position: {
|
|
12906
12906
|
"top-left": "data-[state=open]:slide-in-from-left-full data-[state=closed]:slide-out-to-left-full",
|
|
@@ -13465,7 +13465,7 @@ function CustomNotification(param) {
|
|
|
13465
13465
|
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", {
|
|
13466
13466
|
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", {
|
|
13467
13467
|
id: id,
|
|
13468
|
-
className: "z-[10000000] min-h-10 w-fit max-w-[90vw] rounded-full border border-Colors-Border-Opaque bg-Colors-Background-
|
|
13468
|
+
className: "z-[10000000] min-h-10 w-fit max-w-[90vw] rounded-full border border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal px-3 py-2 shadow-modal-default md:max-w-[560px]",
|
|
13469
13469
|
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", {
|
|
13470
13470
|
className: "flex w-full items-center justify-center gap-2",
|
|
13471
13471
|
children: [
|