@romainbx/wpic-components 0.0.74 → 0.0.75

package/dist/wpic-components.js

@@ -2174,18 +2174,18 @@ const Og = ["is", "type", "disabled"], Mg = {
     }, u = {
       pmi: "bg-violet-800 border border-violet-800 focus:bg-violet-800 text-white disabled:bg-zinc-100 disabled:text-zinc-400 disabled:border-zinc-100 enabled:hover:bg-violet-900 enabled:hover:border-violet-900 active:scale-95 enabled:transform",
       // 'wpic-tools': 'border-none! bg-linear-to-b from-lime-500 to-lime-500 text-white disabled:text-white/50 border-none shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:active:shadow-inner enabled:hover:from-lime-400 enabled:hover:to-lime-400 enabled:active:text-white/80 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] dark:from-lime-700 dark:to-lime-700 dark:enabled:active:shadow-inner dark:enabled:hover:from-lime-600 dark:enabled:hover:to-lime-600'
-      "wpic-tools": "border-none! bg-linear-to-b bg-lime-500 text-white disabled:text-white/50 border-none shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:active:shadow-inner enabled:hover:bg-lime-400 enabled:active:text-white/80 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] dark:bg-lime-700 dark:enabled:active:shadow-inner dark:enabled:hover:bg-lime-600"
+      "wpic-tools": "border-none! bg-linear-to-b bg-wpic-600 text-white disabled:text-white/50 border-none shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:active:shadow-inner enabled:hover:bg-wpic-500 enabled:active:text-white/80 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] dark:bg-wpic-700 dark:enabled:active:shadow-inner dark:enabled:hover:bg-wpic-600"
     }, d = {
       pmi: "bg-white text-violet-800 border-zinc-400 dark:border-zinc-700 dark:text-zinc-200 dark:bg-zinc-700 dark:hover:bg-zinc-600 dark:hover:border-zinc-600 disabled:text-zinc-400 active:scale-95 enabled:transform",
       // 'wpic-tools': 'border-none! bg-linear-to-b from-gray-500 to-gray-600 text-white disabled:text-white/50 shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:active:shadow-inner enabled:hover:from-gray-400 enabled:hover:to-gray-500 enabled:active:text-white/80 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] dark:from-gray-700 dark:to-gray-700 dark:enabled:active:shadow-inner dark:enabled:hover:from-gray-600 dark:enabled:hover:to-gray-600'
-      "wpic-tools": "border-none! bg-linear-to-b bg-gray-500 text-white disabled:text-white/50 shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:active:shadow-inner enabled:hover:bg-gray-400 enabled:active:text-white/80 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] dark:bg-gray-700 dark:enabled:active:shadow-inner dark:enabled:hover:bg-gray-600"
+      "wpic-tools": "border-none! bg-linear-to-b bg-gray-400 text-white disabled:text-white/50 shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:active:shadow-inner enabled:hover:bg-gray-300 enabled:active:text-white/80 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] dark:bg-gray-800 dark:enabled:active:shadow-inner dark:enabled:hover:bg-gray-700"
     }, f = {
       pmi: "",
       "wpic-tools": "border-none! text-white bg-linear-to-b bg-red-500 disabled:text-red-600/50 border-red-500 enabled:hover:bg-red-400 shadow-[0_1px_0_0_--theme(--color-white/30%)_inset,0_-1px_1px_0_--theme(--color-black/5%)_inset] enabled:hover:border-red-600 enabled:active:shadow-inner enabled:active:text-white/80 enabled:active:bg-red-700 enabled:active:border-red-700 dark:bg-red-400/70 dark:border-red-400/70"
     }, h = {
       pmi: "border-zinc-300 dark:border-zinc-700 dark:text-zinc-300",
       // 'wpic-tools': 'border-gray-200 bg-white shadow-sm text-gray-700 enabled:hover:bg-gray-300 enabled:hover:border-gray-300 enabled:active:bg-gray-200 enabled:active:border-gray-200 enabled:active:shadow-inner disabled:bg-gray-100 disabled:text-zinc-400 disabled:border-0 dark:bg-gray-930 dark:border-gray-930 dark:text-gray-300 dark:enabled:hover:bg-gray-920 dark:enabled:hover:border-gray-920 dark:enabled:active:bg-gray-930 dark:enabled:active:border-gray-930 dark:disabled:text-gray-700 dark:disabled:bg-gray-940'
-      "wpic-tools": " text-gray-950 disabled:text-gray-950/50 border-none ring-1 ring-black/5 shadow-xs enabled:hover:bg-gray-50 enabled:active:text-gray-950/60 dark:bg-gray-900 dark:text-white dark:disabled:text-white/50 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] enabled:active:shadow-inner dark:hover:bg-gray-800 dark:enabled:active:text-white/80"
+      "wpic-tools": " text-gray-950 disabled:text-gray-950/50 border-none ring-1 ring-black/5 shadow-xs enabled:hover:bg-gray-50 enabled:active:text-gray-950/60 bg-white dark:bg-transparent dark:ring-1 dark:ring-gray-800 dark:text-white dark:disabled:text-white/50 dark:shadow-[0_1px_0_0_--theme(--color-white/5%)_inset,0_0_0_1px_--theme(--color-white/2%)_inset] enabled:active:shadow-inner dark:hover:bg-white/10 dark:enabled:active:text-white/80"
     }, p = {
       pmi: "text-violet-800 hover:underline",
       "wpic-tools": "text-lime-800 hover:underline"
@@ -23796,14 +23796,16 @@ const Fp = /* @__PURE__ */ ye(X4, [["render", nD]]), rD = { class: "flex gap-3"
       ])
     ], 2));
   }
-}), $D = { class: "wpic-tabs flex border-b-2 dark:border-gray-930 overflow-x-auto overflow-y-hidden" }, AD = ["onClick"], ED = {
+}), $D = ["onClick"], AD = {
   name: "WpicTabs"
-}, DD = /* @__PURE__ */ Object.assign(ED, {
+}, ED = /* @__PURE__ */ Object.assign(AD, {
   props: {
     modelValue: {
       type: String,
       required: !0
     },
+    pills: Boolean,
+    contrastPills: Boolean,
     nowrap: Boolean
   },
   emits: ["update:modelValue"],
@@ -23814,12 +23816,19 @@ const Fp = /* @__PURE__ */ ye(X4, [["render", nD]]), rD = { class: "flex gap-3"
       i.value.push(l);
     }, a = de(() => n.modelValue);
     return Si("addTab", s), Si("modelValue", a), (l, c) => (x(), C($e, null, [
-      T("div", $D, [
+      T("div", {
+        class: G(["wpic-tabs flex dark:border-gray-930 overflow-x-auto overflow-y-hidden", { "border-b-[1px]": !t.pills }])
+      }, [
         (x(!0), C($e, null, We(i.value, (u) => (x(), C("div", {
           key: u.name,
-          class: G(["border-b items-center flex leading-snug cursor-pointer py-3 px-6 -mb-[2px] font-medium", {
-            "dark:border-gray-930": u.name != t.modelValue,
-            "border-b-2 text-lime-500 border-b-lime-500 dark:text-lime-600 dark:border-b-lime-600": u.name === t.modelValue,
+          class: G(["items-center flex leading-snug cursor-pointer px-6 -mb-[px]", {
+            "py-2": t.pills,
+            "border-b-[2px] border-transparent py-3": !t.pills,
+            "dark:border-gray-930 hover:text-gray-800 dark:hover:text-gray-400 hover:border-gray-200": u.name != t.modelValue,
+            "text-wpic-500 border-b-wpic-500 dark:text-wpic-600 dark:border-b-wpic-600": !t.pills && u.name === t.modelValue,
+            "rounded-lg": t.pills,
+            "bg-black/5 dark:bg-white/10 text-gray-800 dark:!text-gray-300": t.pills && u.name === t.modelValue,
+            "bg-gray-900 dark:bg-gray-300! text-white! dark:text-gray-800!": t.pills && t.contrastPills && u.name === t.modelValue,
             "text-gray-500 dark:text-gray-500": !u.disabled,
             "text-gray-300 dark:text-gray-700": u.disabled
           }]),
@@ -23830,16 +23839,16 @@ const Fp = /* @__PURE__ */ ye(X4, [["render", nD]]), rD = { class: "flex gap-3"
               class: G({ "whitespace-nowrap text-ellipsis overflow-hidden": t.nowrap })
             }, be(u.label), 3)
           ])
-        ], 10, AD))), 128))
-      ]),
+        ], 10, $D))), 128))
+      ], 2),
       T("div", null, [
         Me(l.$slots, "default")
       ])
     ], 64));
   }
-}), ND = {
+}), DD = {
   name: "WpicTabPane"
-}, LD = /* @__PURE__ */ Object.assign(ND, {
+}, ND = /* @__PURE__ */ Object.assign(DD, {
   props: {
     label: {
       type: String,
@@ -23873,76 +23882,76 @@ const Fp = /* @__PURE__ */ ye(X4, [["render", nD]]), rD = { class: "flex gap-3"
       Me(o.$slots, "default")
     ], 2)) : re("", !0);
   }
-}), ID = {}, BD = {
+}), LD = {}, ID = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "none",
   viewBox: "0 0 24 24",
   "stroke-width": "1.5",
   stroke: "currentColor"
-}, PD = /* @__PURE__ */ T("path", {
+}, BD = /* @__PURE__ */ T("path", {
   "stroke-linecap": "round",
   "stroke-linejoin": "round",
   d: "M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126ZM12 15.75h.007v.008H12v-.008Z"
-}, null, -1), VD = [
-  PD
+}, null, -1), PD = [
+  BD
 ];
-function RD(t, e) {
-  return x(), C("svg", BD, VD);
+function VD(t, e) {
+  return x(), C("svg", ID, PD);
 }
-const _D = /* @__PURE__ */ ye(ID, [["render", RD]]), jD = {}, zD = {
+const RD = /* @__PURE__ */ ye(LD, [["render", VD]]), _D = {}, jD = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "none",
   viewBox: "0 0 24 24",
   "stroke-width": "1.5",
   stroke: "currentColor"
-}, FD = /* @__PURE__ */ T("path", {
+}, zD = /* @__PURE__ */ T("path", {
   "stroke-linecap": "round",
   "stroke-linejoin": "round",
   d: "m11.25 11.25.041-.02a.75.75 0 0 1 1.063.852l-.708 2.836a.75.75 0 0 0 1.063.853l.041-.021M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9-3.75h.008v.008H12V8.25Z"
-}, null, -1), HD = [
-  FD
+}, null, -1), FD = [
+  zD
 ];
-function WD(t, e) {
-  return x(), C("svg", zD, HD);
+function HD(t, e) {
+  return x(), C("svg", jD, FD);
 }
-const qD = /* @__PURE__ */ ye(jD, [["render", WD]]), UD = {}, KD = {
+const WD = /* @__PURE__ */ ye(_D, [["render", HD]]), qD = {}, UD = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "none",
   viewBox: "0 0 24 24",
   "stroke-width": "1.5",
   stroke: "currentColor"
-}, YD = /* @__PURE__ */ T("path", {
+}, KD = /* @__PURE__ */ T("path", {
   "stroke-linecap": "round",
   "stroke-linejoin": "round",
   d: "M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
-}, null, -1), JD = [
-  YD
+}, null, -1), YD = [
+  KD
 ];
-function GD(t, e) {
-  return x(), C("svg", KD, JD);
+function JD(t, e) {
+  return x(), C("svg", UD, YD);
 }
-const ZD = /* @__PURE__ */ ye(UD, [["render", GD]]), XD = {}, QD = {
+const GD = /* @__PURE__ */ ye(qD, [["render", JD]]), ZD = {}, XD = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "none",
   viewBox: "0 0 24 24",
   "stroke-width": "1.5",
   stroke: "currentColor"
-}, e6 = /* @__PURE__ */ T("path", {
+}, QD = /* @__PURE__ */ T("path", {
   "stroke-linecap": "round",
   "stroke-linejoin": "round",
   d: "m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
-}, null, -1), t6 = [
-  e6
+}, null, -1), e6 = [
+  QD
 ];
-function n6(t, e) {
-  return x(), C("svg", QD, t6);
+function t6(t, e) {
+  return x(), C("svg", XD, e6);
 }
-const r6 = /* @__PURE__ */ ye(XD, [["render", n6]]), i6 = { class: "w-6" }, o6 = { class: "flex-1" }, s6 = {
+const n6 = /* @__PURE__ */ ye(ZD, [["render", t6]]), r6 = { class: "w-6" }, i6 = { class: "flex-1" }, o6 = {
   key: 0,
   class: "mb-2"
-}, a6 = {
+}, s6 = {
   name: "WpicAlert"
-}, l6 = /* @__PURE__ */ Object.assign(a6, {
+}, a6 = /* @__PURE__ */ Object.assign(s6, {
   props: {
     title: String,
     text: String,
@@ -23961,23 +23970,23 @@ const r6 = /* @__PURE__ */ ye(XD, [["render", n6]]), i6 = { class: "w-6" }, o6 =
         "bg-green-50 text-green-950 dark:text-green-200 dark:bg-green-950 text-opacity-75": t.success
       }])
     }, [
-      T("div", i6, [
-        t.warning ? (x(), ve(_D, {
+      T("div", r6, [
+        t.warning ? (x(), ve(RD, {
           key: 0,
           class: "w-full aspect-square"
-        })) : t.info ? (x(), ve(qD, {
+        })) : t.info ? (x(), ve(WD, {
           key: 1,
           class: "w-full aspect-square"
-        })) : t.success ? (x(), ve(ZD, {
+        })) : t.success ? (x(), ve(GD, {
           key: 2,
           class: "w-full aspect-square"
-        })) : t.error ? (x(), ve(r6, {
+        })) : t.error ? (x(), ve(n6, {
           key: 3,
           class: "w-full aspect-square"
         })) : re("", !0)
       ]),
-      T("div", o6, [
-        t.title ? (x(), C("div", s6, be(t.title), 1)) : re("", !0),
+      T("div", i6, [
+        t.title ? (x(), C("div", o6, be(t.title), 1)) : re("", !0),
         T("span", {
           class: G(["", {
             "text-gray-950 dark:text-gray-200 text-opacity-75": !t.warning && !t.info && !t.error && !t.success,
@@ -24021,19 +24030,19 @@ function Hp() {
     }
   };
 }
-const c6 = {
+const l6 = {
   key: 0,
   class: "confirm-modal-overlay z-40"
-}, u6 = { class: "bg-white dark:border dark:border-gray-900 dark:bg-gray-940 p-6 rounded-lg w-128 flex flex-col" }, d6 = { class: "text-lg font-semibold mb-6" }, f6 = { class: "mb-12" }, h6 = { class: "flex justify-end" }, p6 = {
+}, c6 = { class: "bg-white dark:border dark:border-gray-900 dark:bg-gray-940 p-6 rounded-lg w-128 flex flex-col" }, u6 = { class: "text-lg font-semibold mb-6" }, d6 = { class: "mb-12" }, f6 = { class: "flex justify-end" }, h6 = {
   name: "WpicConfirm"
-}, m6 = /* @__PURE__ */ Object.assign(p6, {
+}, p6 = /* @__PURE__ */ Object.assign(h6, {
   setup(t) {
     const { visible: e, title: n, text: r, positive: i, negative: o, onConfirm: s, onCancel: a } = Hp();
-    return (l, c) => B(e) ? (x(), C("div", c6, [
-      T("div", u6, [
-        T("div", d6, be(B(n)), 1),
-        T("div", f6, be(B(r)), 1),
-        T("div", h6, [
+    return (l, c) => B(e) ? (x(), C("div", l6, [
+      T("div", c6, [
+        T("div", u6, be(B(n)), 1),
+        T("div", d6, be(B(r)), 1),
+        T("div", f6, [
           le(To, { onClick: B(a) }, {
             default: Se(() => [
               Ie("Cancel")
@@ -24054,15 +24063,15 @@ const c6 = {
       ])
     ])) : re("", !0);
   }
-}), g6 = /* @__PURE__ */ ye(m6, [["__scopeId", "data-v-613542ab"]]), ia = { WpicColorPicker: wf, WpicAlert: l6, WpicToggleSwitch: bf, WpicAdvDateField: xD, WpicCalendar: Wl, WpicTextarea: xf, WpicDialog: TD, WpicSlidePanel: kD, WpicDateField: aD, WpicFormInput: Ki, WpicButton: To, WpicBadge: A4, WpicTextEditor: a4, WpicInputGroup: Bg, WpicButtonGroup: Dg, WpicForm: Vg, WpicFormField: kf, WpicSpinner: Gr, WpicTooltip: Sf, WpicPopover: mr, WpicChoiceList: vf, WpicCard: t5, WpicCardSection: o5, WpicProgressBar: c5, WpicTag: f5, WpicTagGroup: p5, WpicPagination: J5, WpicLoadingPanel: w5, WpicTable: wS, WpicTableColumn: kS, WpicTabs: DD, WpicTabPane: LD, WpicConfirm: g6 };
+}), m6 = /* @__PURE__ */ ye(p6, [["__scopeId", "data-v-613542ab"]]), ia = { WpicColorPicker: wf, WpicAlert: a6, WpicToggleSwitch: bf, WpicAdvDateField: xD, WpicCalendar: Wl, WpicTextarea: xf, WpicDialog: TD, WpicSlidePanel: kD, WpicDateField: aD, WpicFormInput: Ki, WpicButton: To, WpicBadge: A4, WpicTextEditor: a4, WpicInputGroup: Bg, WpicButtonGroup: Dg, WpicForm: Vg, WpicFormField: kf, WpicSpinner: Gr, WpicTooltip: Sf, WpicPopover: mr, WpicChoiceList: vf, WpicCard: t5, WpicCardSection: o5, WpicProgressBar: c5, WpicTag: f5, WpicTagGroup: p5, WpicPagination: J5, WpicLoadingPanel: w5, WpicTable: wS, WpicTableColumn: kS, WpicTabs: ED, WpicTabPane: ND, WpicConfirm: m6 };
 function Wp(t, e) {
   for (const n in e)
     Object.prototype.hasOwnProperty.call(e, n) && (typeof e[n] == "object" && t[n] ? Wp(t[n], e[n]) : t[n] = e[n]);
 }
-const y6 = {
+const g6 = {
   useConfirm: Hp
 };
-function v6(t, e) {
+function y6(t, e) {
   Wp(pe, e);
   for (const n in ia)
     if (ia.hasOwnProperty(n)) {
@@ -24070,12 +24079,12 @@ function v6(t, e) {
       t.component(r.name, r);
     }
 }
-const w6 = {
-  install: v6,
-  composables: y6,
+const x6 = {
+  install: y6,
+  composables: g6,
   options: pe
 };
 export {
-  w6 as default,
+  x6 as default,
   Hp as useConfirm
 };