@fewangsit/wangsvue-presets 1.0.107-alpha.1 → 1.0.107-alpha.2

package/globalsettings/index.es.js

@@ -1,7 +1,7 @@
 var z = Object.defineProperty;
-var _ = (e, t, a) => t in e ? z(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a;
-var b = (e, t, a) => _(e, typeof t != "symbol" ? t + "" : t, a);
-const A = {
+var A = (e, t, a) => t in e ? z(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a;
+var b = (e, t, a) => A(e, typeof t != "symbol" ? t + "" : t, a);
+const _ = {
   accordiontab: {
     header: ({ props: e }) => ({
       class: [
@@ -112,7 +112,7 @@ const A = {
     "icon-class": "w-[10px] h-[10px] !text-[10px]",
     "data-wv-section": "removebutton"
   })
-}, S = {
+}, N = {
   root: ({ context: e }) => ({
     class: [
       // Font
@@ -150,7 +150,7 @@ const A = {
       }
     ]
   })
-}, T = {
+}, S = {
   root: ({ props: e, context: t }) => ({
     class: [
       "relative",
@@ -467,7 +467,7 @@ const A = {
       }
     ]
   })
-}, N = {
+}, T = {
   root: ({ props: e }) => ({
     class: [
       "rounded ring-1 ring-success-500 p-[5px] ring-inset",
@@ -501,7 +501,7 @@ const A = {
     ],
     "data-wv-section": "icon"
   })
-}, V = {
+}, I = {
   buttontrigger: {
     root: ({ context: e }) => ({
       class: [
@@ -550,7 +550,7 @@ const A = {
   inputtext: {
     class: "!h-max !py-0 !px-0"
   }
-}, I = {
+}, F = {
   root: ["w-max"],
   button: {
     class: [
@@ -559,7 +559,7 @@ const A = {
     "data-sp-section": "button-split"
   },
   menuButton: "!rounded-ss-none !rounded-es-none"
-}, h = navigator.userAgent.includes("Chrome"), F = {
+}, h = navigator.userAgent.includes("Chrome"), U = {
   root: ({ props: e }) => ({
     class: [
       // Display and Position
@@ -1147,7 +1147,7 @@ const A = {
     leaveActiveClass: "transition-opacity duration-100 ease-linear",
     leaveToClass: "opacity-0"
   }
-}, E = {
+}, V = {
   root: {
     class: [
       //Shape
@@ -1176,7 +1176,7 @@ const A = {
   footer: {
     class: ["inline-flex gap-1 text-xs items-center"]
   }
-}, U = {
+}, E = {
   root: {
     class: [
       // Flexbox
@@ -1290,7 +1290,7 @@ const A = {
       }
     ]
   })
-}, B = {
+}, G = {
   button: ({ props: e, buttonClass: t }) => ({
     class: [
       t,
@@ -1439,7 +1439,7 @@ const A = {
   tooltipicon: {
     class: "text-primary-500 w-[10px] h-[10px]"
   }
-}, $ = {
+}, B = {
   copybutton: {
     class: "peer-hover:visible scale-125 !absolute top-2 right-2 z-50"
   },
@@ -1483,7 +1483,7 @@ const A = {
       { invisible: e.dragable === !1 }
     ]
   })
-}, G = {
+}, O = {
   root: {
     "data-wv-name": "datatable",
     "data-wv-section": "root",
@@ -1938,7 +1938,7 @@ const A = {
     class: "flex items-end justify-end gap-1 !mt-0",
     "data-wv-section": "dialog-confirm-footer"
   }
-}, M = {
+}, $ = {
   root: {
     class: ["max-w-[90vw]"],
     style: (e) => `width: ${e}`,
@@ -2274,7 +2274,7 @@ const A = {
     leaveActiveClass: "transition-opacity duration-100 ease-linear",
     leaveToClass: "opacity-0"
   }
-}, O = {
+}, M = {
   root: ({ props: e, state: t }) => ({
     class: [
       // Display and Position
@@ -2465,7 +2465,7 @@ const A = {
   loadingplaceholder: {
     class: "text-general-200 font-light"
   }
-}, D = {
+}, W = {
   // :class="['ts-form', { 'sticky-buttons': props.stickyButtons }]"
   root: () => ({
     class: [
@@ -2506,7 +2506,7 @@ const A = {
   "validator-message": {
     class: ["static w-max transform-none"]
   }
-}, W = [
+}, D = [
   {
     "ring-1 p-[1px]": navigator.userAgent.includes("Firefox"),
     "ring-[0.5px] p-[0.5px]": !navigator.userAgent.includes("Firefox")
@@ -4008,10 +4008,10 @@ const A = {
     ]
   })
 };
-function x(e, t) {
+function m(e, t) {
   return { [e]: t }[e];
 }
-x("WANGS-TAB-MENU", {
+m("WANGS-TAB-MENU", {
   root: {
     class: "overflow-x-visible"
   },
@@ -4095,7 +4095,7 @@ x("WANGS-TAB-MENU", {
     class: ["grow border-b-2 border-grayscale-400", { hidden: e.type === "pill" || e.useTrailingLine === !1 || e.type === "segmented" }]
   })
 });
-x("WANGS-INPUT-OTP", {
+m("WANGS-INPUT-OTP", {
   root: {
     class: [
       // Alignment
@@ -4314,9 +4314,9 @@ const l = class l {
   }
 };
 b(l, "SINGLETON_KEY", "__WANGS_UI_ROUTER_INSTANCE__");
-let m = l;
-new m();
-const oe = x("WANGS-TAB-MENU", {
+let x = l;
+new x();
+const oe = m("WANGS-TAB-MENU", {
   root: {
     class: "overflow-x-auto",
     style: "scrollbar-width: none"
@@ -4422,7 +4422,7 @@ const oe = x("WANGS-TAB-MENU", {
       // Shape
       "rounded",
       "appearance-none",
-      ...W,
+      ...D,
       {
         "!ring-danger-500": e.invalidInput
       },
@@ -4700,7 +4700,7 @@ const oe = x("WANGS-TAB-MENU", {
       "break-words"
     ]
   }
-}, be = {
+}, me = {
   root: {
     class: [
       "relative",
@@ -4955,7 +4955,7 @@ const oe = x("WANGS-TAB-MENU", {
       }
     ]
   })
-}, me = {
+}, be = {
   root: ({ props: e, state: t }) => ({
     class: [
       // Display and Position
@@ -5566,7 +5566,7 @@ const oe = x("WANGS-TAB-MENU", {
   animation: {
     class: ["w-[700px] h-auto"]
   }
-}, _e = {
+}, Ae = {
   root: {
     class: "flex items-center gap-1"
   },
@@ -5600,23 +5600,77 @@ const oe = x("WANGS-TAB-MENU", {
       class: "flex flex-col gap-0.5 items-center justify-center"
     }
   }
-}, Ae = {
-  badge: S,
+}, _e = m("WANGS-INPUT-OTP", {
+  root: {
+    class: [
+      // Alignment
+      "flex items-center",
+      "gap-1.5",
+      "w-max"
+    ]
+  },
+  input: ({ props: e, context: t, parent: a }) => ({
+    class: [
+      // Font
+      "text-[14px] leading-none font-medium",
+      // Flex & Alignment
+      { "flex-1 w-[1%]": a.tagName == "WANGS-INPUT-GROUP" },
+      "text-center",
+      // Spacing
+      "m-0",
+      // Size
+      "w-[42px] h-[42px]",
+      // Shape
+      { "rounded-md": a.tagName !== "WANGS-INPUT-GROUP" },
+      {
+        "first:rounded-l-md rounded-none last:rounded-r-md": a.tagName == "WANGS-INPUT-GROUP"
+      },
+      {
+        "border-0 border-y border-l last:border-r": a.tagName == "WANGS-INPUT-GROUP"
+      },
+      // Colors
+      "text-general-800 dark:text-general-800",
+      "placeholder:text-surface-400 dark:placeholder:text-surface-500",
+      "bg-white dark:bg-white",
+      {
+        "ring-1": navigator.userAgent.includes("Firefox"),
+        "ring-[0.5px]": !navigator.userAgent.includes("Firefox")
+      },
+      { "ring-general-200 dark:ring-general-200": !e.invalid },
+      // Invalid State
+      { "ring-danger-500 dark:ring-danger-500": e.invalid },
+      // States
+      {
+        "hover:bg-primary-50/30 hover:ring-primary-500 dark:hover:ring-primary-400": !t.disabled && !e.invalid,
+        "focus:bg-primary-50/30 focus:ring-primary-500 dark:focus:ring-primary-400": !t.disabled && !e.invalid,
+        "focus:outline-none focus:outline-offset-0": !t.disabled,
+        "opacity-60 select-none pointer-events-none cursor-default": t.disabled
+      },
+      // Filled State *for FloatLabel
+      { filled: a.tagName == "WANGS-FLOAT-LABEL" && t.filled },
+      // Misc
+      "appearance-none",
+      "transition-colors duration-200"
+    ]
+  })
+}), Ne = {
+  badge: N,
   ripple: le,
   tooltip: fe
 }, Te = {
   global: H,
-  directives: Ae,
+  directives: Ne,
   // Forms
-  form: D,
+  form: W,
   filtercontainer: je,
-  dropdown: O,
+  dropdown: M,
   inputnumber: Q,
   inputphonenumber: X,
   inputcurrency: pe,
   inputtext: j,
   inputbadge: q,
-  calendar: F,
+  inputotp: _e,
+  calendar: U,
   checkbox: c,
   buttonradio: ie,
   multiselect: n,
@@ -5624,7 +5678,7 @@ const oe = x("WANGS-TAB-MENU", {
   toggleswitch: u,
   inputgroup: J,
   inputgroupaddon: Z,
-  treeselect: me,
+  treeselect: be,
   tristatecheckbox: xe,
   textarea: de,
   password: ne,
@@ -5632,22 +5686,22 @@ const oe = x("WANGS-TAB-MENU", {
   fileupload: ke,
   fieldwrapper: Ce,
   // Buttons
-  button: T,
-  buttondownload: N,
+  button: S,
+  buttondownload: T,
   buttonbulkaction: ve,
-  buttonsearch: V,
-  buttonsplit: I,
+  buttonsearch: I,
+  buttonsplit: F,
   buttonfilter: P,
   // Data
   paginator: re,
-  datatable: G,
+  datatable: O,
   customcolumn: L,
-  tree: be,
+  tree: me,
   timeline: ce,
-  changelog: B,
+  changelog: G,
   // Panels
-  accordion: A,
-  card: E,
+  accordion: _,
+  card: V,
   // Menu
   menu: ee,
   steps: se,
@@ -5656,21 +5710,21 @@ const oe = x("WANGS-TAB-MENU", {
   // Overlays
   dialog: C,
   dialogconfirm: R,
-  dialogform: M,
+  dialogform: $,
   overlaypanel: ae,
   // Messages
   message: te,
   inlinemessage: Y,
   toast: ue,
   // Media
-  carousel: U,
+  carousel: E,
   // Misc
   badge: d,
   badgegroup: ye,
   image: K,
   loading: ze,
-  codesnippet: $,
-  username: _e
+  codesnippet: B,
+  username: Ae
 };
 export {
   Te as default

package/globalsettings/index.js

@@ -59,6 +59,7 @@ var filtercontainer_1 = require("./filtercontainer");
 var toggleswitch_1 = require("./toggleswitch");
 var loading_1 = require("./loading");
 var username_1 = require("./username");
+var inputotp_1 = require("./inputotp");
 var directives = {
     badge: index_js_3.default,
     ripple: index_js_35.default,
@@ -76,6 +77,7 @@ var globalsettings = {
     inputcurrency: inputcurrency_1.default,
     inputtext: index_js_27.default,
     inputbadge: index_js_22.default,
+    inputotp: inputotp_1.default,
     calendar: index_1.default,
     checkbox: index_js_12.default,
     buttonradio: index_js_34.default,