azeriand-library 1.17.8 → 1.19.0

package/dist/index.esm.js

@@ -15,7 +15,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import { jsx as jsx$1, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
-import React__default, { forwardRef, useContext, isValidElement, cloneElement, Children, createContext, useState, useEffect } from "react";
+import React__default, { forwardRef, useContext, isValidElement, cloneElement, Children, createContext, useState } from "react";
 import ReactDOM from "react-dom";
 function Avatar({ src, className = "", style: style2 }) {
   return /* @__PURE__ */ jsx$1(
@@ -15788,8 +15788,6 @@ function Card({
   ...rest
 }) {
   const Component = as || "article";
-  let [classNames, setClassNames] = useState("");
-  let [cardStyle, setCardStyle] = useState({});
   const { theme, cardDefaults } = useContext(ThemeContext);
   const mergedProps = {
     appearance: appearance || cardDefaults.appearance,
@@ -15797,26 +15795,26 @@ function Card({
     intensity: intensity || cardDefaults.intensity,
     dark: dark2 !== void 0 ? dark2 : cardDefaults.theme
   };
-  useEffect(() => {
-    let intensityValue = mergedProps.intensity;
-    if (intensityValue === void 0) {
-      intensityValue = theme === "dark" ? 600 : 300;
-    }
-    setCardStyle({
-      "--glass-color": `var(--color-${mergedProps.color}-${intensityValue})`,
-      "--card-text-color": `var(--color-${mergedProps.color}-${mergedProps.dark ? "100" : "800"})`,
-      backdropFilter: mergedProps.appearance === "glass" && !noBlur ? `blur(${blur}px)` : void 0,
-      ...style2
-    });
-    let rounded = "rounded-md";
-    if (className) {
-      const roundedMatch = className.match(/rounded\-[a-z0-9]+/g);
-      if (roundedMatch) {
-        rounded = roundedMatch[roundedMatch.length - 1];
-      }
+  let intensityValue = mergedProps.intensity;
+  if (intensityValue === void 0) {
+    intensityValue = theme === "dark" ? 600 : 300;
+  }
+  const cardStyle = {
+    ...style2 || {}
+  };
+  cardStyle["--glass-color"] = `var(--color-${mergedProps.color}-${intensityValue})`;
+  cardStyle["--card-text-color"] = `var(--color-${mergedProps.color}-${mergedProps.dark ? "100" : "800"})`;
+  if (mergedProps.appearance === "glass" && !noBlur) {
+    cardStyle.backdropFilter = `blur(${blur}px)`;
+  }
+  let rounded = "rounded-md";
+  if (className) {
+    const roundedMatch = className.match(/rounded\-[a-z0-9]+/g);
+    if (roundedMatch) {
+      rounded = roundedMatch[roundedMatch.length - 1];
     }
-    setClassNames(`card ${rounded} ${mergedProps.appearance} ${className} ${noPadding ? "" : "p-[2rem]"}`);
-  }, [color2, intensity, dark2, appearance, noBlur, className, theme]);
+  }
+  const classNames = `card ${rounded} ${mergedProps.appearance} ${className || ""} ${noPadding ? "" : "p-[2rem]"}`.trim();
   return /* @__PURE__ */ jsx$1(Component, { className: classNames, style: cardStyle, onClick, ...rest, children });
 }
 function Button({ children, label, icon, position: position2 = "left", onClick, size, className, ...cardProps }) {
@@ -16017,15 +16015,28 @@ function Checkbox({ label, checkedDefault = false, onChange }) {
 function SectionName({ section, className }) {
   return /* @__PURE__ */ jsx$1("div", { className: `uppercase font-bold tracking-[0.15rem] w-fit section-name ${className}`, children: section });
 }
-function Input({ type, value, disabled, placeholder, maxLength, onChange, iconPosition = "left", centerText = false, icon, className, ...cardProps }) {
+function Input({ type = "text", value, disabled, placeholder, maxLength, onChange, iconPosition = "left", centerText = false, icon, className, ...cardProps }) {
   function inputUpdated(ev) {
     onChange == null ? void 0 : onChange(ev.target.value);
   }
-  const inputClassName = `flex justify-center items-center border-none bg-transparent py-[0.5rem] ${iconPosition && icon ? "px-[0.5rem]" : "px-[1rem]"} m-0 w-full ${centerText ? "text-center" : ""}`;
+  const normalizedValue = value ?? "";
+  const inputClassName = `flex justify-center items-center border-none bg-transparent py-[0.5rem] ${icon && iconPosition ? "px-[0.5rem]" : "px-[1rem]"} m-0 w-full ${centerText ? "text-center" : ""}`;
   const directionClassName = iconPosition === "left" ? "pl-3" : "flex-row-reverse pr-3";
   return /* @__PURE__ */ jsxs(Card, { className: `flex justify-center items-center rounded-md ${className} ${icon ? directionClassName : ""}`, noBlur: true, noPadding: true, ...cardProps, style: cardProps.style, children: [
     icon && /* @__PURE__ */ jsx$1("div", { className: "flex items-center", children: icon }),
-    /* @__PURE__ */ jsx$1("input", { className: inputClassName, onChange: inputUpdated, placeholder, value, disabled, type, maxLength, style: cardProps.style })
+    /* @__PURE__ */ jsx$1(
+      "input",
+      {
+        className: inputClassName,
+        onChange: inputUpdated,
+        placeholder,
+        value: normalizedValue,
+        disabled,
+        type,
+        maxLength,
+        style: cardProps.style
+      }
+    )
   ] });
 }
 function CustomDay(props) {