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

package/fixedasset/loading/index.js

@@ -5,6 +5,7 @@ var preset = {
         class: [
             'w-screen h-screen fixed top-0 left-0 z-[9999999]',
             'bg-white',
+            'text-base',
             'flex flex-col items-center justify-center',
             'transition-opacity',
         ],

package/fixedasset/style.css

@@ -2408,6 +2408,10 @@
   gap: 0.25rem;
 }
 
+.gap-1\.5{
+  gap: 0.375rem;
+}
+
 .gap-2{
   gap: 0.5rem;
 }
@@ -4827,49 +4831,49 @@
   font-family: 'Manrope', sans-serif !important;
 }
 
-h1,
+h1,
 .heading-1{
   font-size: 22px !important;
   font-weight: 600 !important;
   line-height: 1.75rem;
 }
 
-h2,
+h2,
 .heading-2{
   font-size: 1.125rem !important;
   font-weight: 600 !important;
   line-height: 1.5rem;
 }
 
-h3,
+h3,
 .heading-3{
   font-size: 1rem !important;
   font-weight: 500 !important;
   line-height: 1.25rem;
 }
 
-h4,
+h4,
 .heading-4{
   font-size: 0.875rem !important;
   font-weight: 500 !important;
   line-height: 1rem;
 }
 
-p,
+p,
 .p{
   font-size: 0.75rem !important;
   font-weight: 500 !important;
   line-height: 1rem;
 }
 
-h5,
+h5,
 .heading-5{
   font-size: 0.75rem !important;
   font-weight: 600 !important;
   line-height: 1rem;
 }
 
-h6,
+h6,
 .heading-6{
   font-size: 10px !important;
   font-weight: 600 !important;
@@ -4880,7 +4884,7 @@ h6,
   scrollbar-width: none;
 }
 
-.scrollbar-w-thin,
+.scrollbar-w-thin,
 .p-virtualscroller {
   scrollbar-width: thin;
 }
@@ -6710,4 +6714,4 @@ h6,
 
 .\[\&_ul\]\:pl-6 ul{
   padding-left: 1.5rem;
-}
+}

package/globalsettings/colors.config.json

@@ -1,97 +1,97 @@
-{
-  "danger-50": "#ffe5e9",
-  "danger-100": "#ffccd3",
-  "danger-200": "#ff99a7",
-  "danger-300": "#ff667a",
-  "danger-400": "#ff334e",
-  "danger-500": "#ff0022",
-  "danger-600": "#cc001b",
-  "danger-700": "#990014",
-  "danger-800": "#66000e",
-  "danger-900": "#330007",
-  "danger-950": "#190003",
-
-  "warning-50": "#fff9e5",
-  "warning-100": "#fff4cc",
-  "warning-200": "#ffe999",
-  "warning-300": "#ffde66",
-  "warning-400": "#ffd333",
-  "warning-500": "#ffc700",
-  "warning-600": "#cca000",
-  "warning-700": "#997800",
-  "warning-800": "#665000",
-  "warning-900": "#332800",
-  "warning-950": "#191400",
-
-  "success-50": "#dbffee",
-  "success-100": "#b8ffdc",
-  "success-200": "#75ffbc",
-  "success-300": "#2eff9a",
-  "success-400": "#00eb79",
-  "success-500": "#00a455",
-  "success-600": "#008545",
-  "success-700": "#006132",
-  "success-800": "#004222",
-  "success-900": "#001f10",
-  "success-950": "#000f08",
-
-  "grayscale-50": "#f7f7f7",
-  "grayscale-100": "#f2f2f2",
-  "grayscale-200": "#e5e6e6",
-  "grayscale-300": "#d8d9d9",
-  "grayscale-400": "#cbcccd",
-  "grayscale-500": "#bdbebf",
-  "grayscale-600": "#97999b",
-  "grayscale-700": "#717374",
-  "grayscale-800": "#4b4d4e",
-  "grayscale-900": "#262627",
-  "grayscale-950": "#121212",
-
-  "general-50": "#ebeaf0",
-  "general-100": "#dad9e3",
-  "general-200": "#b5b3c7",
-  "general-300": "#908cab",
-  "general-400": "#6c688d",
-  "general-500": "#4e4b66",
-  "general-600": "#3f3c52",
-  "general-700": "#2f2d3e",
-  "general-800": "#201e29",
-  "general-900": "#100f15",
-  "general-950": "#070609",
-
-  "primary-50": "#ebeaf0",
-  "primary-100": "#dad9e3",
-  "primary-200": "#b5b3c7",
-  "primary-300": "#908cab",
-  "primary-400": "#6c688d",
-  "primary-500": "#201e29",
-  "primary-600": "#100f15",
-  "primary-700": "#070609",
-  "primary-800": "#050407",
-  "primary-900": "#030204",
-  "primary-950": "#020103",
-
-  "fixed-primary-50": "#e5f0ff",
-  "fixed-primary-100": "#cce0ff",
-  "fixed-primary-200": "#94bfff",
-  "fixed-primary-300": "#61a0ff",
-  "fixed-primary-400": "#2e82ff",
-  "fixed-primary-500": "#0063f7",
-  "fixed-primary-600": "#0050c7",
-  "fixed-primary-700": "#003b94",
-  "fixed-primary-800": "#002761",
-  "fixed-primary-900": "#001433",
-  "fixed-primary-950": "#000a19",
-
-  "supply-primary-50": "#ECFDF5",
-  "supply-primary-100": "#d1fae5",
-  "supply-primary-200": "#a7f3d0",
-  "supply-primary-300": "#6ee7b7",
-  "supply-primary-400": "#34d399",
-  "supply-primary-500": "#10b981",
-  "supply-primary-600": "#059669",
-  "supply-primary-700": "#047857",
-  "supply-primary-800": "#065F46",
-  "supply-primary-900": "#064E3B",
-  "supply-primary-950": "#022C22"
-}
+{
+  "danger-50": "#ffe5e9",
+  "danger-100": "#ffccd3",
+  "danger-200": "#ff99a7",
+  "danger-300": "#ff667a",
+  "danger-400": "#ff334e",
+  "danger-500": "#ff0022",
+  "danger-600": "#cc001b",
+  "danger-700": "#990014",
+  "danger-800": "#66000e",
+  "danger-900": "#330007",
+  "danger-950": "#190003",
+
+  "warning-50": "#fff9e5",
+  "warning-100": "#fff4cc",
+  "warning-200": "#ffe999",
+  "warning-300": "#ffde66",
+  "warning-400": "#ffd333",
+  "warning-500": "#ffc700",
+  "warning-600": "#cca000",
+  "warning-700": "#997800",
+  "warning-800": "#665000",
+  "warning-900": "#332800",
+  "warning-950": "#191400",
+
+  "success-50": "#dbffee",
+  "success-100": "#b8ffdc",
+  "success-200": "#75ffbc",
+  "success-300": "#2eff9a",
+  "success-400": "#00eb79",
+  "success-500": "#00a455",
+  "success-600": "#008545",
+  "success-700": "#006132",
+  "success-800": "#004222",
+  "success-900": "#001f10",
+  "success-950": "#000f08",
+
+  "grayscale-50": "#f7f7f7",
+  "grayscale-100": "#f2f2f2",
+  "grayscale-200": "#e5e6e6",
+  "grayscale-300": "#d8d9d9",
+  "grayscale-400": "#cbcccd",
+  "grayscale-500": "#bdbebf",
+  "grayscale-600": "#97999b",
+  "grayscale-700": "#717374",
+  "grayscale-800": "#4b4d4e",
+  "grayscale-900": "#262627",
+  "grayscale-950": "#121212",
+
+  "general-50": "#ebeaf0",
+  "general-100": "#dad9e3",
+  "general-200": "#b5b3c7",
+  "general-300": "#908cab",
+  "general-400": "#6c688d",
+  "general-500": "#4e4b66",
+  "general-600": "#3f3c52",
+  "general-700": "#2f2d3e",
+  "general-800": "#201e29",
+  "general-900": "#100f15",
+  "general-950": "#070609",
+
+  "primary-50": "#ebeaf0",
+  "primary-100": "#dad9e3",
+  "primary-200": "#b5b3c7",
+  "primary-300": "#908cab",
+  "primary-400": "#6c688d",
+  "primary-500": "#201e29",
+  "primary-600": "#100f15",
+  "primary-700": "#070609",
+  "primary-800": "#050407",
+  "primary-900": "#030204",
+  "primary-950": "#020103",
+
+  "fixed-primary-50": "#e5f0ff",
+  "fixed-primary-100": "#cce0ff",
+  "fixed-primary-200": "#94bfff",
+  "fixed-primary-300": "#61a0ff",
+  "fixed-primary-400": "#2e82ff",
+  "fixed-primary-500": "#0063f7",
+  "fixed-primary-600": "#0050c7",
+  "fixed-primary-700": "#003b94",
+  "fixed-primary-800": "#002761",
+  "fixed-primary-900": "#001433",
+  "fixed-primary-950": "#000a19",
+
+  "supply-primary-50": "#ECFDF5",
+  "supply-primary-100": "#d1fae5",
+  "supply-primary-200": "#a7f3d0",
+  "supply-primary-300": "#6ee7b7",
+  "supply-primary-400": "#34d399",
+  "supply-primary-500": "#10b981",
+  "supply-primary-600": "#059669",
+  "supply-primary-700": "#047857",
+  "supply-primary-800": "#065F46",
+  "supply-primary-900": "#064E3B",
+  "supply-primary-950": "#022C22"
+}

package/globalsettings/index.d.ts

@@ -10,6 +10,7 @@ declare namespace globalsettings {
     export { inputcurrency };
     export { inputtext };
     export { inputbadge };
+    export { inputotp };
     export { calendar };
     export { checkbox };
     export { buttonradio };
@@ -72,6 +73,7 @@ import inputphonenumber from './inputphonenumber/index.js';
 import inputcurrency from './inputcurrency';
 import inputtext from './inputtext/index.js';
 import inputbadge from './inputbadge/index.js';
+import inputotp from './inputotp';
 import calendar from './calendar/index';
 import checkbox from './checkbox/index.js';
 import buttonradio from './buttonradio/index.js';

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
@@ -5559,6 +5559,7 @@ const oe = x("WANGS-TAB-MENU", {
     class: [
       "w-screen h-screen fixed top-0 left-0 z-[9999999]",
       "bg-white",
+      "text-base",
       "flex flex-col items-center justify-center",
       "transition-opacity"
     ]
@@ -5566,7 +5567,7 @@ const oe = x("WANGS-TAB-MENU", {
   animation: {
     class: ["w-[700px] h-auto"]
   }
-}, _e = {
+}, Ae = {
   root: {
     class: "flex items-center gap-1"
   },
@@ -5600,23 +5601,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 +5679,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 +5687,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 +5711,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,