@sunggang/ui-lib 0.3.62 → 0.3.63

package/index.esm.css

@@ -743,9 +743,6 @@ video {
 .z-10 {
   z-index: 10;
 }
-.z-20 {
-  z-index: 20;
-}
 .z-50 {
   z-index: 50;
 }
@@ -758,6 +755,9 @@ video {
 .z-\[9999\] {
   z-index: 9999;
 }
+.z-\[99\] {
+  z-index: 99;
+}
 .m-1 {
   margin: 0.25rem;
 }
@@ -1510,6 +1510,9 @@ video {
 .bg-\[\#1697960D\] {
   background-color: #1697960D;
 }
+.bg-\[\#169796BF\] {
+  background-color: #169796BF;
+}
 .bg-\[\#1A1A1A\] {
   --tw-bg-opacity: 1;
   background-color: rgb(26 26 26 / var(--tw-bg-opacity, 1));
@@ -1538,6 +1541,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
 }
+.bg-\[\#ecf0ef\] {
+  --tw-bg-opacity: 1;
+  background-color: rgb(236 240 239 / var(--tw-bg-opacity, 1));
+}
 .bg-\[\#f5f5f5\] {
   --tw-bg-opacity: 1;
   background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
@@ -1610,10 +1617,6 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
 }
-.bg-green-50 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
-}
 .bg-green-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
@@ -1987,6 +1990,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(51 51 51 / var(--tw-text-opacity, 1));
 }
+.text-\[\#40392B\] {
+  --tw-text-opacity: 1;
+  color: rgb(64 57 43 / var(--tw-text-opacity, 1));
+}
 .text-\[\#4788FF\] {
   --tw-text-opacity: 1;
   color: rgb(71 136 255 / var(--tw-text-opacity, 1));
@@ -2530,6 +2537,11 @@ video {
   background-color: #1697960D;
 }
 
+.hover\:bg-\[\#D1EDED\]:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(209 237 237 / var(--tw-bg-opacity, 1));
+}
+
 .hover\:bg-\[\#D9D9D9\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(217 217 217 / var(--tw-bg-opacity, 1));

package/index.esm2.js

@@ -47650,7 +47650,7 @@ var DropdownList = function(param) {
     }, [
         formContext
     ]);
-    var _ref = (item === null || item === void 0 ? void 0 : item.dropStyle) || {}, _ref_bgClass = _ref.bgClass, bgClass = _ref_bgClass === void 0 ? "bg-[#E5E5EA]" : _ref_bgClass, _ref_hoverClass = _ref.hoverClass, hoverClass = _ref_hoverClass === void 0 ? "hover:bg-[#d9d9e2]" : _ref_hoverClass, _ref_selectedClass = _ref.selectedClass, selectedClass = _ref_selectedClass === void 0 ? "bg-[#C7C7CC]" : _ref_selectedClass, _ref_textColor = _ref.textColor, textColor = _ref_textColor === void 0 ? "text-[#000000]" : _ref_textColor, _ref_borderColor = _ref.borderColor, borderColor = _ref_borderColor === void 0 ? "border-[#C7C7CC]" : _ref_borderColor;
+    var _ref = (item === null || item === void 0 ? void 0 : item.dropStyle) || {}, _ref_outBgClass = _ref.outBgClass, outBgClass = _ref_outBgClass === void 0 ? "bg-white" : _ref_outBgClass, _ref_bgClass = _ref.bgClass, bgClass = _ref_bgClass === void 0 ? "bg-[#E5E5EA]" : _ref_bgClass, _ref_hoverClass = _ref.hoverClass, hoverClass = _ref_hoverClass === void 0 ? "hover:bg-[#d9d9e2]" : _ref_hoverClass, _ref_selectedClass = _ref.selectedClass, selectedClass = _ref_selectedClass === void 0 ? "bg-[#C7C7CC]" : _ref_selectedClass, _ref_textColor = _ref.textColor, textColor = _ref_textColor === void 0 ? "text-[#000000]" : _ref_textColor, _ref_borderColor = _ref.borderColor, borderColor = _ref_borderColor === void 0 ? "border-[#C7C7CC]" : _ref_borderColor;
     return /*#__PURE__*/ jsxs("div", {
         className: (item === null || item === void 0 ? void 0 : item.className) || "w-full h-24",
         children: [
@@ -47689,8 +47689,8 @@ var DropdownList = function(param) {
                             var _item_option_find, _item_option;
                             return /*#__PURE__*/ jsxs("div", {
                                 className: [
-                                    (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#E5E5EA] cursor-not-allowed pointer-events-none" : "".concat(textColor, " ").concat(bgClass),
-                                    "customSelect w-full h-11 py-2 pr-4 pl-4 rounded-2xl border border-solid",
+                                    (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#E5E5EA] cursor-not-allowed pointer-events-none" : "".concat(textColor, " ").concat(outBgClass),
+                                    "customSelect w-full py-2 pr-4 pl-4 rounded-2xl",
                                     borderColor
                                 ].join(" "),
                                 children: [
@@ -47708,7 +47708,7 @@ var DropdownList = function(param) {
                                     }),
                                     open && /*#__PURE__*/ jsxs("div", {
                                         className: [
-                                            "absolute left-0 z-20 mt-2 w-full rounded-xl shadow-btn-2xl overflow-hidden border",
+                                            "absolute left-0 z-[99] mt-2 w-full rounded-xl shadow-btn-2xl overflow-hidden",
                                             bgClass,
                                             borderColor
                                         ].join(" "),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sunggang/ui-lib",
-  "version": "0.3.62",
+  "version": "0.3.63",
   "dependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",

package/src/lib/Form/demo.d.ts

@@ -50,6 +50,7 @@ export declare const config: (getValues: (name: string) => unknown) => (FormItem
         hoverClass: string;
         selectedClass: string;
         borderColor: string;
+        textColor: string;
     };
     className: string;
     icon?: undefined;

package/src/lib/Form/types.d.ts

@@ -120,6 +120,7 @@ export interface FormItem {
     hiddenText?: boolean;
     hiddenSearch?: boolean;
     dropStyle?: {
+        outBgClass?: string;
         bgClass?: string;
         hoverClass?: string;
         selectedClass?: string;