@sikka/hawa 0.43.6-next → 0.45.0-next

package/dist/phoneInput/index.mjs

@@ -1898,13 +1898,21 @@ var Select = ({
       children
     );
   };
-  const Option = ({ children, innerProps, innerRef }) => {
+  const Option = ({
+    children,
+    innerProps,
+    innerRef,
+    isFocused,
+    isSelected
+  }) => {
     return /* @__PURE__ */ React5.createElement(
       "div",
       {
         ref: innerRef,
         className: cn(
-          "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all hover:hawa-bg-primary hover:hawa-text-primary-foreground"
+          "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all",
+          isFocused ? "hawa-bg-accent hawa-text-bg-accent-foreground" : "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
+          isSelected && "hawa-bg-primary hawa-text-primary-foreground"
         ),
         ...innerProps
       },
@@ -1961,15 +1969,20 @@ var Select = ({
             container: () => cn(
               selectContainerStyles,
               props.phoneCode && phoneCodeStyles,
-              props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer",
               props.isMulti && "hawa-ps-0 "
             ),
-            placeholder: () => selectPlaceholderStyles,
+            placeholder: () => cn(
+              selectPlaceholderStyles,
+              props.disabled && "hawa-text-muted-foreground"
+            ),
             valueContainer: () => "hawa-text-foreground hawa-px-1 ",
-            singleValue: () => "hawa-text-foreground",
+            singleValue: () => cn(
+              props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
+            ),
             indicatorsContainer: () => cn(
               selectIndicatorContainerStyles,
-              props.hideIndicator ? "hawa-invisible" : "hawa-px-1"
+              props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
+              props.disabled && "hawa-opacity-30"
             )
           },
           unstyled: true,
@@ -1977,12 +1990,6 @@ var Select = ({
           components: props.hideIndicator ? { Option, Menu, IndicatorsContainer: () => null } : {
             Option,
             Menu,
-            // Control: (e) => (
-            //   <div
-            //     className={cn(e.className, "hawa-flex hawa-flex-row")}
-            //     {...e}
-            //   />
-            // ),
             ValueContainer: (e) => /* @__PURE__ */ React5.createElement(
               "div",
               {