npm - scrubbed-tailwind-components-v2 - Versions diffs - 2.0.2 - Mend

scrubbed-tailwind-components-v2 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/README.md +51 -0
package/dist/favicon.ico +0 -0
package/dist/scrubbed-tailwind-components-v2.css +1 -0
package/dist/scrubbed-tailwind-components-v2.es.js +604 -0
package/dist/scrubbed-tailwind-components-v2.umd.js +1 -0
package/package.json +46 -0

package/README.md ADDED Viewed

@@ -0,0 +1,51 @@
+# scrubbed-tailwind-components-v2
+This template should help get you started developing with Vue 3 in Vite.
+## Recommended IDE Setup
+[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
+## Customize configuration
+See [Vite Configuration Reference](https://vite.dev/config/).
+## Project Setup
+```sh
+npm install
+```
+### Compile and Hot-Reload for Development
+```sh
+npm run dev
+```
+### Compile and Minify for Production
+```sh
+npm run build
+```
+### Run Headed Component Tests with [Cypress Component Testing](https://on.cypress.io/component)
+```sh
+npm run test:unit:dev # or `npm run test:unit` for headless testing
+```
+### Run End-to-End Tests with [Cypress](https://www.cypress.io/)
+```sh
+npm run test:e2e:dev
+```
+This runs the end-to-end tests against the Vite development server.
+It is much faster than the production build.
+But it's still recommended to test the production build with `test:e2e` before deploying (e.g. in CI environments):
+```sh
+npm run build
+npm run test:e2e
+```

package/dist/favicon.ico ADDED Viewed

Binary file

package/dist/scrubbed-tailwind-components-v2.css ADDED Viewed

	@@ -0,0 +1 @@
1	+ @starting-style{.backdrop[data-v-aaece1c7]{opacity:0}}

package/dist/scrubbed-tailwind-components-v2.es.js ADDED Viewed

@@ -0,0 +1,604 @@
+import { inject as m, createElementBlock as l, openBlock as a, normalizeClass as h, unref as u, createElementVNode as d, renderSlot as i, createBlock as $, withCtx as g, ref as f, provide as w, createVNode as B, Fragment as y, Teleport as R, normalizeStyle as M, watch as N, createCommentVNode as k, resolveComponent as j, mergeProps as v, useModel as V, withDirectives as A, vModelCheckbox as G, onMounted as z, onUnmounted as E, vModelText as D, vModelRadio as W, renderList as T, toDisplayString as C, createTextVNode as H, computed as q } from "vue";
+import { RouterLink as S, useRoute as L } from "vue-router";
+const O = { class: "flex w-full items-center justify-between" }, U = { class: "flex items-center gap-2" }, Z = { class: "flex items-center gap-10" }, J = { class: "hidden gap-6 sm:flex" }, Y = {
+  __name: "AppHeader",
+  setup(e) {
+    const o = m("APP_DATA"), { isSidebarToggled: r, toggleSidebar: n } = o;
+    return (t, s) => (a(), l("header", {
+      class: h(["fixed flex h-16 w-dvw items-center bg-white/50 px-3 backdrop-blur sm:px-6", { "rounded-t-2xl": u(r) }])
+    }, [
+      d("nav", O, [
+        d("div", U, [
+          d("button", {
+            onClick: s[0] || (s[0] = (c) => u(n)()),
+            class: "block cursor-pointer rounded-full p-2 hover:bg-neutral-100 sm:hidden"
+          }, s[1] || (s[1] = [
+            d("svg", {
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              "stroke-width": "2",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              class: "lucide lucide-menu-icon lucide-menu size-5 stroke-neutral-600"
+            }, [
+              d("path", { d: "M4 12h16" }),
+              d("path", { d: "M4 18h16" }),
+              d("path", { d: "M4 6h16" })
+            ], -1)
+          ])),
+          i(t.$slots, "header-img")
+        ]),
+        d("div", Z, [
+          d("ul", J, [
+            i(t.$slots, "header-links")
+          ]),
+          i(t.$slots, "header-actions")
+        ])
+      ])
+    ], 2));
+  }
+}, F = ["href"], X = {
+  __name: "AppHeaderLink",
+  props: {
+    to: { type: String, required: !0 }
+  },
+  setup(e) {
+    const o = e;
+    return (r, n) => (a(), l("li", null, [
+      o.to.startsWith("/") ? (a(), $(u(S), {
+        key: 0,
+        class: "hover:text-primary-950 [&.router-link-active]:text-primary-950 text-xs uppercase text-neutral-600 hover:transition-all [&.router-link-active]:font-semibold",
+        to: o.to
+      }, {
+        default: g(() => [
+          i(r.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["to"])) : (a(), l("a", {
+        key: 1,
+        class: "hover:text-primary-950 text-xs uppercase text-neutral-600 hover:transition-all",
+        href: o.to
+      }, [
+        i(r.$slots, "default")
+      ], 8, F))
+    ]));
+  }
+}, Q = { class: "relative" }, K = { class: "flex" }, ee = {
+  __name: "AppLayout",
+  setup(e) {
+    const o = f(!1);
+    function r() {
+      window.innerWidth <= 640 ? (o.value = !o.value, n()) : o.value && (o.value = !1, n());
+    }
+    function n() {
+      const t = document.querySelector("body");
+      t.classList.contains("bg-black") ? t.classList.remove("bg-black") : t.classList.add("bg-black");
+    }
+    return w("APP_DATA", { isSidebarToggled: o, toggleSidebar: r }), (t, s) => (a(), l("div", {
+      class: h(["bg-white transition-all duration-500 ease-[cubic-bezier(.32,.72,0,1)]", {
+        "scale-93 origin-[center_top] translate-y-4": o.value
+      }])
+    }, [
+      d("div", Q, [
+        i(t.$slots, "header"),
+        d("div", K, [
+          i(t.$slots, "content")
+        ])
+      ])
+    ], 2));
+  }
+}, te = {
+  __name: "AppMain",
+  setup(e) {
+    const o = m("APP_DATA"), { isSidebarToggled: r } = o;
+    return (n, t) => (a(), l("main", {
+      class: h([
+        "bg-background-main fixed z-[-1] h-svh w-full overflow-auto px-6 pb-9 pt-24 sm:top-16 sm:ml-[223px] sm:h-[calc(100dvh-4rem)] sm:w-[calc(100dvw-223px)] sm:pt-9",
+        u(r) ? "overflow-hidden rounded-t-xl sm:rounded-none" : "sm:rounded-tl-2xl"
+      ])
+    }, [
+      i(n.$slots, "default")
+    ], 2));
+  }
+}, oe = { class: "group flex w-full overflow-x-auto border-b-[1px] border-neutral-200" }, re = {
+  __name: "AppNavTabs",
+  setup(e) {
+    const o = f(null);
+    function r(t, s, c) {
+      o.value.style = `left: ${t}px; top: calc(${s}px + 6px); opacity: 1; width: ${c}px`;
+    }
+    function n(t, s, c) {
+      o.value.style = `left: ${t}px; top: calc(${s}px + 6px); opacity: 0; width: ${c}px`;
+    }
+    return w("NAV_TABS", {
+      setSelectorAttributes: r,
+      resetSelectorOpacity: n
+    }), (t, s) => (a(), l("div", oe, [
+      i(t.$slots, "default"),
+      d("div", {
+        class: "bg-brand-primary-700 absolute left-0 z-[-1] h-[32px] w-10 rounded-lg opacity-0 transition-all ease-in-out",
+        ref_key: "selector",
+        ref: o
+      }, null, 512)
+    ]));
+  }
+}, ne = {
+  __name: "AppNavTab",
+  props: {
+    to: { type: String, required: !0 }
+  },
+  setup(e) {
+    const o = e, r = m("NAV_TABS"), { setSelectorAttributes: n, resetSelectorOpacity: t } = r, s = f(null);
+    return (c, p) => (a(), l("div", {
+      onMouseover: p[0] || (p[0] = (x) => u(n)(s.value.offsetLeft, s.value.offsetTop, s.value.clientWidth)),
+      onMouseleave: p[1] || (p[1] = (x) => u(t)(s.value.offsetLeft, s.value.offsetTop, s.value.clientWidth)),
+      class: "shrink-0",
+      ref_key: "el",
+      ref: s
+    }, [
+      B(u(S), {
+        class: "[&.router-link-exact-active]:text-primary-950 [&.router-link-exact-active]:border-brand-primary-700 flex h-12 shrink-0 items-center justify-between gap-2 border-b-2 border-transparent px-3 text-sm text-neutral-600 transition-all hover:font-medium hover:text-white [&.router-link-exact-active]:font-medium [&.router-link-exact-active]:hover:text-white",
+        to: o.to
+      }, {
+        default: g(() => [
+          i(c.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["to"])
+    ], 544));
+  }
+}, _ = (e, o) => {
+  const r = e.__vccOpts || e;
+  for (const [n, t] of o)
+    r[n] = t;
+  return r;
+}, se = { class: "fixed left-0 top-0 hidden w-[223px] space-y-4 bg-white px-4 py-8 sm:top-[64px] sm:block" }, ae = {
+  __name: "AppSidebar",
+  setup(e) {
+    const o = m("APP_DATA"), { isSidebarToggled: r, toggleSidebar: n } = o;
+    return (t, s) => (a(), l(y, null, [
+      d("aside", se, [
+        i(t.$slots, "default", {}, void 0, !0)
+      ]),
+      (a(), $(R, { to: "body" }, [
+        d("div", {
+          class: "shadow-t-2xl fixed bottom-0 z-50 h-[60svh] w-full space-y-4 overflow-y-scroll rounded-t-2xl bg-white p-4 transition-all duration-500 ease-[cubic-bezier(.32,.72,0,1)] [&::-webkit-scrollbar]:hidden",
+          style: M(
+            u(r) ? "transform: translateZ(0)" : "transform: translate3d(0,60svh,0)"
+          )
+        }, [
+          i(t.$slots, "default", {}, void 0, !0)
+        ], 4),
+        d("div", {
+          onClick: s[0] || (s[0] = (c) => u(n)()),
+          class: h([
+            "backdrop backdrop-blur-[0.50px] transition-all duration-300 [transition-behavior:allow-discrete]",
+            u(r) ? "fixed inset-0 z-40 block bg-black/80 opacity-100" : "hidden"
+          ])
+        }, null, 2)
+      ]))
+    ], 64));
+  }
+}, le = /* @__PURE__ */ _(ae, [["__scopeId", "data-v-aaece1c7"]]), ie = { class: "flex flex-col" }, de = {
+  __name: "AppSidebarItem",
+  setup(e) {
+    L();
+    const o = f(!1);
+    function r() {
+      o.value = !o.value;
+    }
+    return w("SIDEBAR_TOGGLE", { toggled: o, toggleSidebarItem: r }), (n, t) => (a(), l("div", ie, [
+      i(n.$slots, "default")
+    ]));
+  }
+}, ue = ["to"], ce = {
+  __name: "AppSidebarItemChild",
+  props: {
+    to: { type: String, required: !0 }
+  },
+  setup(e) {
+    const o = e;
+    return (r, n) => o.to.startsWith("/") ? (a(), $(u(S), {
+      key: 0,
+      class: "[&.router-link-exact-active]:text-primary-950 [&.router-link-exact-active]:bg-background-main text-primary-950 hover:bg-background-main block h-10 items-center gap-3 overflow-hidden text-ellipsis whitespace-nowrap rounded-lg px-3 text-xs leading-[40px] transition-all [&.router-link-exact-active]:font-medium",
+      to: o.to
+    }, {
+      default: g(() => [
+        i(r.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["to"])) : (a(), l("a", {
+      key: 1,
+      class: "text-primary-950 hover:bg-background-main block h-10 items-center gap-3 overflow-hidden text-ellipsis whitespace-nowrap rounded-lg px-3 text-xs leading-[40px] transition-all",
+      to: o.to
+    }, [
+      i(r.$slots, "default")
+    ], 8, ue));
+  }
+}, pe = {
+  __name: "AppSidebarItemChildren",
+  setup(e) {
+    const o = m("SIDEBAR_TOGGLE"), { toggled: r } = o;
+    return (n, t) => (a(), l("div", {
+      class: h(["max-h-0 overflow-y-hidden rounded-b-lg opacity-0 transition-all", { "mt-2 max-h-max overflow-y-auto px-2 opacity-100": u(r) }])
+    }, [
+      i(n.$slots, "default")
+    ], 2));
+  }
+}, me = { class: "group/sidebar-item hover:bg-background-main has-[&.router-link-active]:bg-background-main peer flex h-10 items-center justify-between rounded-lg px-3 transition-all" }, fe = ["href"], be = {
+  __name: "AppSidebarItemParent",
+  props: {
+    to: { type: String, required: !0 },
+    name: { type: String },
+    hasChildren: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const o = L(), r = e, n = m("SIDEBAR_TOGGLE"), t = m("APP_DATA"), { toggled: s, toggleSidebarItem: c } = n, { toggleSidebar: p } = t;
+    function x() {
+      o.matched.some(
+        (b) => r.name === b.name
+      ) ? s.value = !0 : s.value = !1;
+    }
+    return N(o, () => x(), { immediate: !0 }), (I, b) => (a(), l("div", me, [
+      r.to.startsWith("/") ? (a(), $(u(S), {
+        key: 0,
+        onClick: b[0] || (b[0] = (P) => u(p)()),
+        class: "[&.router-link-active]:text-primary-950 [&.router-link-active]:text-primary-950 text-primary-950 peer flex h-full w-full items-center gap-3 text-xs [&.router-link-active]:font-medium",
+        to: r.to
+      }, {
+        default: g(() => [
+          i(I.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["to"])) : (a(), l("a", {
+        key: 1,
+        class: "text-primary-950 peer flex h-full w-full items-center gap-3 text-xs",
+        href: r.to
+      }, [
+        i(I.$slots, "default")
+      ], 8, fe)),
+      r.hasChildren ? (a(), l("button", {
+        key: 2,
+        onClick: b[1] || (b[1] = (P) => u(c)()),
+        class: "cursor-pointer rounded-full p-1 transition-all hover:bg-neutral-100",
+        type: "button"
+      }, [
+        (a(), l("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "16",
+          height: "16",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          class: h(["lucide lucide-chevron-down-icon lucide-chevron-down stroke-primary-950 transition-all duration-300", { "rotate-180": u(s) }])
+        }, b[2] || (b[2] = [
+          d("path", { d: "m6 9 6 6 6-6" }, null, -1)
+        ]), 2))
+      ])) : k("", !0)
+    ]));
+  }
+}, he = { class: "hover:bg-background-main has-[&.router-link-active]:active has-[&.router-link-active]:bg-primary-700 peer flex h-10 items-center justify-between rounded-lg px-3 transition-all" }, ve = {
+  __name: "AppSidebarToggle",
+  setup(e) {
+    const o = m("SIDEBAR_TOGGLE");
+    return (r, n) => {
+      const t = j("RouterLink");
+      return a(), l("div", he, [
+        B(t, {
+          class: "text-primary-950 peer flex h-full w-full items-center gap-3 text-xs [&.router-link-active]:font-medium [&.router-link-active]:text-white",
+          to: "/"
+        }, {
+          default: g(() => [
+            i(r.$slots, "default")
+          ]),
+          _: 3
+        }),
+        d("button", {
+          onClick: n[0] || (n[0] = (s) => u(o).toggleSidebarItem()),
+          class: "cursor-pointer",
+          type: "button"
+        }, n[1] || (n[1] = [
+          d("svg", {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "16",
+            height: "16",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "2",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            class: "lucide lucide-chevron-down-icon lucide-chevron-down stroke-white"
+          }, [
+            d("path", { d: "m6 9 6 6 6-6" })
+          ], -1)
+        ]))
+      ]);
+    };
+  }
+}, ge = {}, _e = {
+  key: 0,
+  class: "text-primary-950 px-1 text-sm font-medium"
+}, xe = { class: "mt-2" };
+function ye(e, o) {
+  return a(), l("nav", null, [
+    e.$slots.title ? (a(), l("b", _e, [
+      i(e.$slots, "title")
+    ])) : k("", !0),
+    d("div", xe, [
+      i(e.$slots, "items")
+    ])
+  ]);
+}
+const ke = /* @__PURE__ */ _(ge, [["render", ye]]), $e = {}, we = { class: "rounded-full px-3 py-1 text-xs font-medium" };
+function Ae(e, o) {
+  return a(), l("div", we, [
+    i(e.$slots, "default")
+  ]);
+}
+const Se = /* @__PURE__ */ _($e, [["render", Ae]]), Ie = {
+  __name: "Button",
+  props: {
+    variant: { type: String, default: "primary" }
+  },
+  setup(e) {
+    const o = e, r = {
+      primary: [
+        "bg-brand-primary-700",
+        "text-white",
+        "active:bg-primary-950 hover:bg-primary-800"
+      ],
+      secondary: ["bg-neutral-100", "text-primary-900"],
+      outlined: [
+        "border-[1px]",
+        "border-neutral-200",
+        "text-primary-900",
+        "hover:bg-neutral-100"
+      ],
+      ghost: ["font-medium", "text-primary-900", "hover:bg-neutral-100"],
+      destructive: [
+        "bg-danger-600",
+        "text-white",
+        "active:bg-danger-600-active",
+        "hover:bg-danger-600-hovered"
+      ]
+    };
+    return (n, t) => (a(), l("button", v(n.$attrs, {
+      class: ["cursor-pointer rounded-lg px-4 py-2 text-xs transition-all disabled:cursor-not-allowed disabled:opacity-50", r[o.variant]]
+    }), [
+      i(n.$slots, "default")
+    ], 16));
+  }
+}, Te = {}, Ce = { class: "rounded-2xl bg-white p-6" };
+function Be(e, o) {
+  return a(), l("div", Ce, [
+    i(e.$slots, "default")
+  ]);
+}
+const Ve = /* @__PURE__ */ _(Te, [["render", Be]]), De = {
+  __name: "Checkbox",
+  props: {
+    modelValue: {},
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(e) {
+    const o = V(e, "modelValue"), r = f(null);
+    return (n, t) => (a(), l("button", {
+      onClick: t[1] || (t[1] = (s) => r.value.click()),
+      class: "group/checkbox bg-neutral-100 has-checked:bg-primary-700 flex size-4 cursor-pointer items-center justify-center rounded-sm transition-all"
+    }, [
+      t[2] || (t[2] = d("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "14",
+        height: "14",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round",
+        class: "lucide lucide-check-icon lucide-check hidden stroke-white group-has-[:checked]/checkbox:block"
+      }, [
+        d("path", { d: "M20 6 9 17l-5-5" })
+      ], -1)),
+      A(d("input", v(n.$attrs, {
+        "onUpdate:modelValue": t[0] || (t[0] = (s) => o.value = s),
+        type: "checkbox",
+        ref_key: "checkboxRef",
+        ref: r,
+        hidden: ""
+      }), null, 16), [
+        [G, o.value]
+      ])
+    ]));
+  }
+}, Le = { class: "pointer-events-auto fixed inset-0 z-[100] min-h-screen bg-black/80 backdrop-blur-[2px]" }, Pe = {
+  __name: "DialogBackground",
+  setup(e) {
+    return z(() => {
+      document.querySelector("body").classList.add("overflow-hidden");
+    }), E(() => {
+      document.querySelector("body").classList.remove("overflow-hidden");
+    }), (o, r) => (a(), l("div", Le, [
+      i(o.$slots, "default")
+    ]));
+  }
+}, Re = {
+  __name: "Input",
+  props: ["modelValue"],
+  setup(e) {
+    const r = f(e.modelValue);
+    return (n, t) => A((a(), l("input", {
+      "onUpdate:modelValue": t[0] || (t[0] = (s) => r.value = s),
+      onInput: t[1] || (t[1] = (s) => n.$emit("update:modelValue", s.target.value)),
+      class: "text-primary-950 focus:ring-primary-700 neutral-400:text-neutral-400 rounded-lg border-[1px] border-neutral-200 bg-white px-3 py-2 text-xs outline-none transition-all focus:ring-2 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+    }, null, 544)), [
+      [D, r.value]
+    ]);
+  }
+}, Me = {};
+function Ne(e, o) {
+  return a(), l("label", v(e.$attrs, { class: "text-primary-950 text-xs transition-all" }), [
+    i(e.$slots, "default")
+  ], 16);
+}
+const je = /* @__PURE__ */ _(Me, [["render", Ne]]), Ge = {
+  __name: "Radio",
+  props: {
+    modelValue: {},
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(e) {
+    const o = V(e, "modelValue"), r = f(null);
+    return (n, t) => (a(), l("button", {
+      onClick: t[1] || (t[1] = (s) => r.value.click()),
+      class: "group/radio bg-neutral-100 has-checked:bg-white has-checked:border-primary-700 flex size-4 cursor-pointer items-center justify-center rounded-full border-[1px] border-transparent"
+    }, [
+      t[2] || (t[2] = d("div", { class: "group-has-checked/radio:bg-primary-700 group-has-checked/radio:opacity-100 size-[10px] rounded-full opacity-0 transition-all" }, null, -1)),
+      A(d("input", v(n.$attrs, {
+        "onUpdate:modelValue": t[0] || (t[0] = (s) => o.value = s),
+        type: "radio",
+        ref_key: "radioRef",
+        ref: r,
+        hidden: ""
+      }), null, 16), [
+        [W, o.value]
+      ])
+    ]));
+  }
+}, ze = "bg-[url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiM1YjYxNmUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1jaGV2cm9uLWRvd24iPjxwYXRoIGQ9Im02IDkgNiA2IDYtNiIvPjwvc3ZnPg==')]", Ee = {
+  __name: "Select",
+  setup(e) {
+    return (o, r) => (a(), l("select", v(o.$attrs, {
+      onChange: r[0] || (r[0] = (n) => o.$emit("update:modelValue", n.target.value)),
+      class: ["border-neutral-200 text-primary-950 focus:ring-primary-700 appearance-none rounded-lg border-[1px] bg-white bg-[length:16px] bg-[right_12px_center] bg-no-repeat px-3 py-2 text-xs outline-none transition-all focus:ring-2 focus:ring-offset-2", ze]
+    }), [
+      i(o.$slots, "default")
+    ], 16));
+  }
+}, We = { class: "w-full" }, He = { class: "h-16" }, qe = { key: 0 }, Oe = {
+  key: 0,
+  class: "pe-4"
+}, Ue = {
+  __name: "Table",
+  props: {
+    columns: { type: Array, required: !0 },
+    data: { type: Array, required: !0 }
+  },
+  setup(e) {
+    const o = e;
+    return (r, n) => (a(), l("table", We, [
+      d("thead", null, [
+        d("tr", He, [
+          (a(!0), l(y, null, T(o.columns, (t) => (a(), l("th", {
+            key: t.key,
+            class: "text-xs font-medium text-neutral-600 first-of-type:ps-4"
+          }, C(t.label), 1))), 128)),
+          r.$slots.actions ? (a(), l("th", qe)) : k("", !0)
+        ])
+      ]),
+      d("tbody", null, [
+        (a(!0), l(y, null, T(o.data, (t, s) => (a(), l("tr", {
+          key: s,
+          class: "odd:bg-background-main/50 hover:bg-background-main min-h-16 rounded-md transition-all"
+        }, [
+          (a(!0), l(y, null, T(o.columns, (c) => (a(), l("td", {
+            key: c.key,
+            class: "text-primary-950 py-4 text-xs first-of-type:rounded-s-md first-of-type:ps-4 last-of-type:rounded-e-md last-of-type:pe-4"
+          }, [
+            i(r.$slots, c.key, { row: t }, () => [
+              H(C(t[c.key]), 1)
+            ])
+          ]))), 128)),
+          r.$slots.actions ? (a(), l("td", Oe, [
+            i(r.$slots, "actions", { row: t })
+          ])) : k("", !0)
+        ]))), 128))
+      ])
+    ]));
+  }
+}, Ze = { class: "bg-neutral-100/50 overflow-x-scroll rounded-xl p-1 [&::-webkit-scrollbar]:hidden" }, Je = {
+  __name: "Tabs",
+  props: {
+    default: { default: null }
+  },
+  setup(e) {
+    const r = f(e.default);
+    function n(t) {
+      r.value = t;
+    }
+    return w("TAB_DATA", { currentValue: r, setCurrentValue: n }), (t, s) => (a(), l("div", Ze, [
+      i(t.$slots, "default")
+    ]));
+  }
+}, Ye = {
+  __name: "TabItem",
+  props: {
+    value: { required: !0 }
+  },
+  setup(e) {
+    const o = e, r = m("TAB_DATA"), { currentValue: n, setCurrentValue: t } = r, s = q(() => n.value === o.value ? ["bg-white", "font-medium", "text-primary-700", "shadow-xl"] : "text-neutral-600");
+    return (c, p) => (a(), l("button", {
+      onClick: p[0] || (p[0] = (x) => u(t)(o.value)),
+      class: h(["h-8 cursor-pointer rounded-lg px-3 text-xs transition-all disabled:cursor-not-allowed disabled:opacity-50", s.value])
+    }, [
+      i(c.$slots, "default")
+    ], 2));
+  }
+}, Fe = {
+  __name: "TextArea",
+  props: ["modelValue"],
+  setup(e) {
+    const r = f(e.modelValue);
+    return (n, t) => A((a(), l("textarea", v({
+      onInput: t[0] || (t[0] = (s) => n.$emit("update:modelValue", s.target.value))
+    }, n.$attrs, {
+      "onUpdate:modelValue": t[1] || (t[1] = (s) => r.value = s),
+      class: "border-neutral-200 text-primary-950 neutral-400:text-neutral-400 focus:ring-primary-700 rounded-lg border-[1px] px-3 py-2 text-xs outline-none transition-all focus:ring-2 focus:ring-offset-2"
+    }), null, 16)), [
+      [D, r.value]
+    ]);
+  }
+}, Ke = {
+  install(e) {
+    e.component("AppHeader", Y), e.component("AppHeaderLink", X), e.component("AppLayout", ee), e.component("AppMain", te), e.component("AppNavTabs", re), e.component("AppNavTab", ne), e.component("AppSidebar", le), e.component("AppSidebarItem", de), e.component("AppSidebarItemChild", ce), e.component("AppSidebarItemChildren", pe), e.component("AppSidebarItemParent", be), e.component("AppSidebarToggle", ve), e.component("AppSidebarNavSection", ke), e.component("Badge", Se), e.component("Button", Ie), e.component("Checkbox", De), e.component("Card", Ve), e.component("DialogBackground", Pe), e.component("Input", Re), e.component("Label", je), e.component("Radio", Ge), e.component("Select", Ee), e.component("Table", Ue), e.component("Tabs", Je), e.component("TabItem", Ye), e.component("TextArea", Fe);
+  }
+};
+export {
+  Y as AppHeader,
+  X as AppHeaderLink,
+  ee as AppLayout,
+  te as AppMain,
+  ne as AppNavTab,
+  re as AppNavTabs,
+  le as AppSidebar,
+  de as AppSidebarItem,
+  ce as AppSidebarItemChild,
+  pe as AppSidebarItemChildren,
+  be as AppSidebarItemParent,
+  ke as AppSidebarNavSection,
+  ve as AppSidebarToggle,
+  Se as Badge,
+  Ie as Button,
+  Ve as Card,
+  De as Checkbox,
+  Pe as DialogBackground,
+  Re as Input,
+  je as Label,
+  Ge as Radio,
+  Ee as Select,
+  Ye as TabItem,
+  Ue as Table,
+  Je as Tabs,
+  Fe as TextArea,
+  Ke as default
+};

package/dist/scrubbed-tailwind-components-v2.umd.js ADDED Viewed

@@ -0,0 +1 @@

package/package.json ADDED Viewed

@@ -0,0 +1,46 @@
+{
+  "name": "scrubbed-tailwind-components-v2",
+  "version": "2.0.2",
+  "private": false,
+  "type": "module",
+  "main": "dist/scrubbed-tailwind-components-v2.umd.js",
+  "module": "dist/scrubbed-tailwind-components-v2.es.js",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/scrubbed-tailwind-components-v2.es.js",
+      "require": "./dist/scrubbed-tailwind-components-v2.umd.js",
+      "default": "./dist/scrubbed-tailwind-components-v2.es.js"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "prepare": "cypress install",
+    "test:e2e": "start-server-and-test preview http://localhost:4173 'cypress run --e2e'",
+    "test:e2e:dev": "start-server-and-test 'vite dev --port 4173' http://localhost:4173 'cypress open --e2e'",
+    "test:unit": "cypress run --component",
+    "test:unit:dev": "cypress open --component",
+    "format": "prettier --write src/"
+  },
+  "dependencies": {},
+  "peerDependencies": {
+    "vue": "^3.5.13",
+    "vue-router": "^4.5.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.2.3",
+    "@vitejs/plugin-vue-jsx": "^4.1.2",
+    "cypress": "^14.2.1",
+    "prettier": "^3.6.0",
+    "prettier-plugin-classnames": "^0.7.8",
+    "prettier-plugin-tailwindcss": "^0.6.13",
+    "start-server-and-test": "^2.0.11",
+    "vite": "^6.2.4",
+    "vite-plugin-vue-devtools": "^7.7.2",
+    "vue-router": "^4.5.0"
+  }
+}