@vespiario-thailand/design-system 1.3.13 → 1.3.14

package/dist/vespa-design-system.js

@@ -23030,9 +23030,9 @@ const i5 = (r) => {
     onlyIcon: z = !1,
     ...R
   } = r, P = (le, K) => le + K, V = {
-    small: z ? "min-h-32" : "min-h-32 font-normal font-vespa-thai-italic italic text-body-small",
-    medium: z ? "min-h-32" : "min-h-40 font-normal font-vespa-thai-italic italic text-body",
-    large: z ? "min-h-32" : "min-h-40 font-bold not-italic text-body"
+    small: z ? "min-h-[32px]" : "min-h-[32px] font-normal font-vespa-thai-italic italic text-body-small",
+    medium: z ? "min-h-[32px]" : "min-h-[40px] font-normal font-vespa-thai-italic italic text-body",
+    large: z ? "min-h-[32px]" : "min-h-[40px] font-bold not-italic text-body"
   }, B = {
     primary: M && N ? `bg-${p}-${g} text-${M}-${N}` : `bg-${p}-${g} text-light-100`,
     secondary: `bg-light-100 text-${p}-${g}`,
@@ -23476,7 +23476,7 @@ const _h = ee(
       "div",
       {
         ref: i,
-        className: Ie("flex h-full min-h-40 w-full flex-col items-center justify-center", u),
+        className: Ie("flex h-full min-h-[40px] w-full flex-col items-center justify-center", u),
         ...d,
         children: [
           /* @__PURE__ */ _(en, { icon: "icon-cloud-download", color: "green", shade: 500, size: "24" }),
@@ -23497,7 +23497,7 @@ const $h = ee((r, i) => {
       ...p,
       children: [
         /* @__PURE__ */ _(en, { icon: "icon-cloud-upload", color: "light", shade: 500, size: "24" }),
-        d || /* @__PURE__ */ mt("div", { className: "flex min-h-40 flex-col items-center", children: [
+        d || /* @__PURE__ */ mt("div", { className: "flex min-h-[40px] flex-col items-center", children: [
           /* @__PURE__ */ mt("span", { className: "mt-16 font-bold", children: [
             /* @__PURE__ */ _("span", { className: "text-light-800", children: "Drag & drop an image, or" }),
             /* @__PURE__ */ _("span", { className: "text-light-500", children: " Browse" })
@@ -23635,7 +23635,7 @@ const KE = ee((r, i) => {
   return /* @__PURE__ */ mt("div", { ...M, ref: i, className: Ie("", o), children: [
     /* @__PURE__ */ _(CC, { className: "min-h-[290px]", isError: u, onUpload: w, children: /* @__PURE__ */ _(CC.Inactive, { size: "600x600", ratio: "1:1", onError: N }) }),
     u && /* @__PURE__ */ _("p", { className: "mt-12 text-caption text-yellow-600", children: "This media file doesn‘t exist, please upload file again" }),
-    /* @__PURE__ */ mt("div", { className: "mt-12 flex min-h-40 items-center", children: [
+    /* @__PURE__ */ mt("div", { className: "mt-12 flex min-h-[40px] items-center", children: [
       /* @__PURE__ */ _("div", { className: "flex-1", children: /* @__PURE__ */ _("p", { className: "pt-4 text-body-small text-light-600", children: "Preview:" }) }),
       /* @__PURE__ */ _("div", { className: "flex-initial", children: /* @__PURE__ */ _("div", { className: "h-36 w-36 overflow-hidden rounded-full", children: d !== "" ? /* @__PURE__ */ _("img", { src: d, alt: v }) : /* @__PURE__ */ _(q0, { className: "h-full w-full", imageNotFound: u }) }) })
     ] })
@@ -23664,7 +23664,7 @@ const XE = ee(
         ref: i,
         type: "button",
         ...o,
-        className: "flex min-h-40 w-full items-center justify-center rounded py-6 px-34 font-vespa-thai-italic text-blue-500 disabled:cursor-not-allowed disabled:text-blue-700 [&:not(:disabled)]:hover:bg-light-200 [&:not(:disabled)]:active:bg-light-300",
+        className: "flex min-h-[40px] w-full items-center justify-center rounded py-6 px-34 font-vespa-thai-italic text-blue-500 disabled:cursor-not-allowed disabled:text-blue-700 [&:not(:disabled)]:hover:bg-light-200 [&:not(:disabled)]:active:bg-light-300",
         children: /* @__PURE__ */ _("span", { className: "flex-1 pt-4", children: "DISCARD" })
       }
     );
@@ -23679,7 +23679,7 @@ const ZE = ee((r, i) => {
       ref: i,
       type: "button",
       ...o,
-      className: "flex min-h-40 w-full items-center  justify-center rounded bg-blue-500 py-6 px-34 font-vespa-thai-italic text-light-100 disabled:cursor-not-allowed disabled:text-blue-700 [&:not(:disabled)]:hover:bg-blue-600 [&:not(:disabled)]:active:bg-blue-700",
+      className: "flex min-h-[40px] w-full items-center  justify-center rounded bg-blue-500 py-6 px-34 font-vespa-thai-italic text-light-100 disabled:cursor-not-allowed disabled:text-blue-700 [&:not(:disabled)]:hover:bg-blue-600 [&:not(:disabled)]:active:bg-blue-700",
       children: /* @__PURE__ */ _("span", { className: "flex-1 pt-4", children: "APPLY" })
     }
   );
@@ -25835,7 +25835,7 @@ const s_ = () => {
     /* @__PURE__ */ mt("div", { className: "mt-12 flex items-center", children: [
       /* @__PURE__ */ _("div", { className: "flex-1", children: /* @__PURE__ */ _("p", { className: "pt-4 text-body-small text-light-600", children: "HEX:" }) }),
       /* @__PURE__ */ mt("div", { className: "flex flex-initial items-center gap-4", children: [
-        /* @__PURE__ */ mt("div", { className: "flex min-h-40 max-w-[150px] items-center gap-8 border border-light-200 py-4 px-12 focus-within:border-blue-500", children: [
+        /* @__PURE__ */ mt("div", { className: "flex min-h-[40px] max-w-[150px] items-center gap-8 border border-light-200 py-4 px-12 focus-within:border-blue-500", children: [
           /* @__PURE__ */ _(
             "span",
             {
@@ -30308,7 +30308,7 @@ const c4 = ee((r, i) => {
       "button",
       {
         ref: O.setReference,
-        className: "flex items-center w-fit min-w-[94.56px] outline-none",
+        className: "flex items-center w-fit min-w-[94px] outline-none",
         ...V({
           onClick() {
             x(!0), N(!M);
@@ -30607,7 +30607,7 @@ const f4 = ee((r, i) => {
       )
     }
   ) });
-  return /* @__PURE__ */ mt("div", { ref: i, className: Ie("min-w-288px]", g), ...M, children: [
+  return /* @__PURE__ */ mt("div", { ref: i, className: Ie("min-w-[288px]", g), ...M, children: [
     /* @__PURE__ */ mt("div", { className: "flex gap-8 items-center", ref: z.setPositionReference, children: [
       /* @__PURE__ */ _(
         F0,
@@ -30970,7 +30970,7 @@ const y4 = ee(
         ref: i,
         size: v,
         className: Oa(
-          "h-40 min-w-40 border border-light-300 bg-light-100 px-8 pt-3 text-center text-light-800 outline-none",
+          "h-40 min-w-[40px] border border-light-300 bg-light-100 px-8 pt-3 text-center text-light-800 outline-none",
           "placeholder:text-light-300",
           "focus:border-blue-500",
           "disabled:cursor-not-allowed disabled:bg-light-200",
@@ -31035,7 +31035,7 @@ const J6 = ee((r, i) => {
       ...g,
       ref: i,
       className: Ie(
-        d ? "min-h-60" : "min-h-48",
+        d ? "min-h-[60px]" : "min-h-[48px]",
         "flex cursor-pointer items-center px-8 py-12 hover:bg-shade-dark-100 active:bg-shade-dark-200",
         p
       ),
@@ -31061,7 +31061,7 @@ const eF = ee((r, i) => {
       ...g,
       ref: i,
       className: Ie(
-        "flex min-h-60 cursor-pointer items-center px-12 py-8 hover:bg-shade-dark-100 active:bg-shade-dark-200",
+        "flex min-h-[60px] cursor-pointer items-center px-12 py-8 hover:bg-shade-dark-100 active:bg-shade-dark-200",
         p
       ),
       children: [
@@ -35130,9 +35130,9 @@ const zD = fr({}), sI = ee((r, i) => {
 sI.displayName = "TextFieldSlug";
 const cI = ee((r, i) => {
   const { isBorder: o = !1, children: u, className: d, shadow: v = "none", size: p = "medium", ...g } = r, M = {
-    small: "min-h-36 text-caption",
-    medium: "min-h-40 text-body-small",
-    large: "min-h-44 text-body"
+    small: "min-h-[36px] text-caption",
+    medium: "min-h-[40px] text-body-small",
+    large: "min-h-[44px] text-body"
   }, N = {
     none: "",
     100: "shadow-100",