@dillingerstaffing/strand-vue 0.4.1 → 0.5.1

package/dist/index.js

@@ -1,9 +1,9 @@
-import { defineComponent as h, computed as c, openBlock as n, createElementBlock as l, normalizeClass as b, createCommentVNode as $, createElementVNode as f, normalizeStyle as S, renderSlot as g, useSlots as E, ref as x, watch as z, onMounted as L, toDisplayString as _, Fragment as k, renderList as w, createTextVNode as N, mergeProps as y, inject as A, provide as F, onUnmounted as V, nextTick as K } from "vue";
+import { defineComponent as h, computed as c, openBlock as n, createElementBlock as l, normalizeClass as b, createCommentVNode as p, createElementVNode as f, normalizeStyle as S, renderSlot as g, useSlots as E, ref as x, watch as z, onMounted as L, toDisplayString as _, Fragment as y, renderList as w, createTextVNode as T, mergeProps as k, inject as A, provide as F, onUnmounted as V, nextTick as K } from "vue";
 const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   key: 0,
   class: "strand-btn__spinner",
   "aria-hidden": "true"
-}, na = /* @__PURE__ */ h({
+}, ra = /* @__PURE__ */ h({
   __name: "Button",
   props: {
     variant: { default: "primary" },
@@ -16,7 +16,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   },
   emits: ["click"],
   setup(e, { emit: t }) {
-    const a = e, r = t, s = c(() => a.disabled || a.loading), o = c(
+    const a = e, r = t, s = c(() => a.disabled || a.loading), i = c(
       () => [
         "strand-btn",
         `strand-btn--${a.variant}`,
@@ -26,23 +26,23 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         a.loading && "strand-btn--loading"
       ].filter(Boolean).join(" ")
     );
-    function d(i) {
-      s.value || r("click", i);
+    function d(o) {
+      s.value || r("click", o);
     }
-    return (i, u) => (n(), l("button", {
+    return (o, u) => (n(), l("button", {
       type: e.type,
-      class: b(o.value),
+      class: b(i.value),
       disabled: s.value,
       "aria-disabled": s.value ? "true" : void 0,
       "aria-busy": e.loading ? "true" : void 0,
       onClick: d
     }, [
-      e.loading ? (n(), l("span", P)) : $("", !0),
+      e.loading ? (n(), l("span", P)) : p("", !0),
       f("span", {
         class: "strand-btn__content",
         style: S(e.loading ? { visibility: "hidden" } : void 0)
       }, [
-        g(i.$slots, "default")
+        g(o.$slots, "default")
       ], 4)
     ], 10, M));
   }
@@ -54,7 +54,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   key: 1,
   class: "strand-input__trailing",
   "aria-hidden": "true"
-}, la = /* @__PURE__ */ h({
+}, oa = /* @__PURE__ */ h({
   __name: "Input",
   props: {
     type: { default: "text" },
@@ -64,7 +64,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   },
   emits: ["update:modelValue"],
   setup(e, { emit: t }) {
-    const a = e, r = t, s = E(), o = c(
+    const a = e, r = t, s = E(), i = c(
       () => [
         "strand-input",
         a.error && "strand-input--error",
@@ -73,16 +73,16 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         !!s.trailing && "strand-input--has-trailing"
       ].filter(Boolean).join(" ")
     );
-    function d(i) {
-      const u = i.target;
+    function d(o) {
+      const u = o.target;
       r("update:modelValue", u.value);
     }
-    return (i, u) => (n(), l("div", {
-      class: b(o.value)
+    return (o, u) => (n(), l("div", {
+      class: b(i.value)
     }, [
-      i.$slots.leading ? (n(), l("span", q, [
-        g(i.$slots, "leading")
-      ])) : $("", !0),
+      o.$slots.leading ? (n(), l("span", q, [
+        g(o.$slots, "leading")
+      ])) : p("", !0),
       f("input", {
         type: e.type,
         class: "strand-input__field",
@@ -91,16 +91,16 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         value: e.modelValue,
         onInput: d
       }, null, 40, U),
-      i.$slots.trailing ? (n(), l("span", G, [
-        g(i.$slots, "trailing")
-      ])) : $("", !0)
+      o.$slots.trailing ? (n(), l("span", G, [
+        g(o.$slots, "trailing")
+      ])) : p("", !0)
     ], 2));
   }
 }), H = ["disabled", "aria-invalid", "maxlength", "value"], W = {
   key: 0,
   class: "strand-textarea__count",
   "aria-live": "polite"
-}, ra = /* @__PURE__ */ h({
+}, ia = /* @__PURE__ */ h({
   __name: "Textarea",
   props: {
     autoResize: { type: Boolean, default: !1 },
@@ -112,7 +112,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   },
   emits: ["update:modelValue"],
   setup(e, { emit: t }) {
-    const a = e, r = t, s = x(null), o = c(
+    const a = e, r = t, s = x(null), i = c(
       () => [
         "strand-textarea",
         a.error && "strand-textarea--error",
@@ -122,19 +122,19 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     ), d = c(
       () => typeof a.modelValue == "string" ? a.modelValue.length : 0
     );
-    function i() {
+    function o() {
       a.autoResize && s.value && (s.value.style.height = "auto", s.value.style.height = `${s.value.scrollHeight}px`);
     }
     function u(m) {
       const v = m.target;
-      r("update:modelValue", v.value), i();
+      r("update:modelValue", v.value), o();
     }
     return z(() => a.modelValue, () => {
-      i();
+      o();
     }), L(() => {
-      i();
+      o();
     }), (m, v) => (n(), l("div", {
-      class: b(o.value)
+      class: b(i.value)
     }, [
       f("textarea", {
         ref_key: "textareaRef",
@@ -146,14 +146,14 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         value: e.modelValue,
         onInput: u
       }, null, 40, H),
-      e.showCount && e.maxLength != null ? (n(), l("span", W, _(d.value) + "/" + _(e.maxLength), 1)) : $("", !0)
+      e.showCount && e.maxLength != null ? (n(), l("span", W, _(d.value) + "/" + _(e.maxLength), 1)) : p("", !0)
     ], 2));
   }
 }), Z = ["value", "disabled", "aria-invalid"], J = {
   key: 0,
   value: "",
   disabled: ""
-}, Q = ["value"], ia = /* @__PURE__ */ h({
+}, Q = ["value"], da = /* @__PURE__ */ h({
   __name: "Select",
   props: {
     options: {},
@@ -171,11 +171,11 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         a.disabled && "strand-select--disabled"
       ].filter(Boolean).join(" ")
     );
-    function o(d) {
-      const i = d.target;
-      r("update:modelValue", i.value);
+    function i(d) {
+      const o = d.target;
+      r("update:modelValue", o.value);
     }
-    return (d, i) => (n(), l("div", {
+    return (d, o) => (n(), l("div", {
       class: b(s.value)
     }, [
       f("select", {
@@ -183,15 +183,15 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         value: e.modelValue,
         disabled: e.disabled,
         "aria-invalid": e.error ? "true" : void 0,
-        onChange: o
+        onChange: i
       }, [
-        e.placeholder ? (n(), l("option", J, _(e.placeholder), 1)) : $("", !0),
-        (n(!0), l(k, null, w(e.options, (u) => (n(), l("option", {
+        e.placeholder ? (n(), l("option", J, _(e.placeholder), 1)) : p("", !0),
+        (n(!0), l(y, null, w(e.options, (u) => (n(), l("option", {
           key: u.value,
           value: u.value
         }, _(u.label), 9, Q))), 128))
       ], 40, Z),
-      i[0] || (i[0] = f("span", {
+      o[0] || (o[0] = f("span", {
         class: "strand-select__arrow",
         "aria-hidden": "true"
       }, null, -1))
@@ -213,7 +213,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
 }, te = {
   key: 0,
   class: "strand-checkbox__label"
-}, oa = /* @__PURE__ */ h({
+}, ca = /* @__PURE__ */ h({
   __name: "Checkbox",
   props: {
     checked: { type: Boolean, default: !1 },
@@ -229,7 +229,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     }), z(() => a.indeterminate, (m) => {
       s.value && (s.value.indeterminate = m);
     });
-    const o = c(
+    const i = c(
       () => [
         "strand-checkbox",
         a.checked && "strand-checkbox--checked",
@@ -239,14 +239,14 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     ), d = c(
       () => a.indeterminate ? "mixed" : a.checked ? "true" : "false"
     );
-    function i(m) {
+    function o(m) {
       a.disabled || r("change", m);
     }
     function u(m) {
       m.key === " " && !a.disabled && (m.preventDefault(), s.value && s.value.click());
     }
     return (m, v) => (n(), l("label", {
-      class: b(o.value),
+      class: b(i.value),
       onKeydown: u
     }, [
       f("input", {
@@ -258,7 +258,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         disabled: e.disabled,
         "aria-checked": d.value,
         role: "checkbox",
-        onChange: i
+        onChange: o
       }, null, 40, X),
       f("span", Y, [
         e.indeterminate ? (n(), l("svg", ee, [...v[0] || (v[0] = [
@@ -279,15 +279,15 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
             "stroke-linecap": "round",
             "stroke-linejoin": "round"
           }, null, -1)
-        ])])) : $("", !0)
+        ])])) : p("", !0)
       ]),
-      e.label ? (n(), l("span", te, _(e.label), 1)) : $("", !0)
+      e.label ? (n(), l("span", te, _(e.label), 1)) : p("", !0)
     ], 34));
   }
 }), se = ["checked", "disabled", "name", "value"], ne = {
   key: 0,
   class: "strand-radio__label"
-}, da = /* @__PURE__ */ h({
+}, ua = /* @__PURE__ */ h({
   __name: "Radio",
   props: {
     checked: { type: Boolean, default: !1 },
@@ -305,10 +305,10 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         a.disabled && "strand-radio--disabled"
       ].filter(Boolean).join(" ")
     );
-    function o(d) {
+    function i(d) {
       a.disabled || r("change", d);
     }
-    return (d, i) => (n(), l("label", {
+    return (d, o) => (n(), l("label", {
       class: b(s.value)
     }, [
       f("input", {
@@ -318,21 +318,21 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         disabled: e.disabled,
         name: e.name,
         value: e.value,
-        onChange: o
+        onChange: i
       }, null, 40, se),
-      i[0] || (i[0] = f("span", {
+      o[0] || (o[0] = f("span", {
         class: "strand-radio__control",
         "aria-hidden": "true"
       }, [
         f("span", { class: "strand-radio__dot" })
       ], -1)),
-      e.label ? (n(), l("span", ne, _(e.label), 1)) : $("", !0)
+      e.label ? (n(), l("span", ne, _(e.label), 1)) : p("", !0)
     ], 2));
   }
 }), le = ["aria-checked", "disabled"], re = {
   key: 0,
   class: "strand-switch__label"
-}, ca = /* @__PURE__ */ h({
+}, fa = /* @__PURE__ */ h({
   __name: "Switch",
   props: {
     checked: { type: Boolean, default: !1 },
@@ -348,13 +348,13 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         a.disabled && "strand-switch--disabled"
       ].filter(Boolean).join(" ")
     );
-    function o() {
+    function i() {
       a.disabled || r("change", !a.checked);
     }
-    function d(i) {
-      (i.key === " " || i.key === "Enter") && !a.disabled && (i.preventDefault(), r("change", !a.checked));
+    function d(o) {
+      (o.key === " " || o.key === "Enter") && !a.disabled && (o.preventDefault(), r("change", !a.checked));
     }
-    return (i, u) => (n(), l("label", {
+    return (o, u) => (n(), l("label", {
       class: b(s.value)
     }, [
       f("button", {
@@ -363,7 +363,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         class: "strand-switch__track",
         "aria-checked": e.checked ? "true" : "false",
         disabled: e.disabled,
-        onClick: o,
+        onClick: i,
         onKeydown: d
       }, [...u[0] || (u[0] = [
         f("span", {
@@ -371,10 +371,10 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
           "aria-hidden": "true"
         }, null, -1)
       ])], 40, le),
-      e.label ? (n(), l("span", re, _(e.label), 1)) : $("", !0)
+      e.label ? (n(), l("span", re, _(e.label), 1)) : p("", !0)
     ], 2));
   }
-}), ie = ["min", "max", "step", "value", "disabled", "aria-valuemin", "aria-valuemax", "aria-valuenow"], ua = /* @__PURE__ */ h({
+}), oe = ["min", "max", "step", "value", "disabled", "aria-valuemin", "aria-valuemax", "aria-valuenow"], va = /* @__PURE__ */ h({
   __name: "Slider",
   props: {
     min: { default: 0 },
@@ -391,11 +391,11 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         a.disabled && "strand-slider--disabled"
       ].filter(Boolean).join(" ")
     );
-    function o(d) {
-      const i = d.target;
-      r("update:modelValue", Number(i.value));
+    function i(d) {
+      const o = d.target;
+      r("update:modelValue", Number(o.value));
     }
-    return (d, i) => (n(), l("div", {
+    return (d, o) => (n(), l("div", {
       class: b(s.value)
     }, [
       f("input", {
@@ -409,15 +409,15 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         "aria-valuemin": e.min,
         "aria-valuemax": e.max,
         "aria-valuenow": e.modelValue,
-        onInput: o
-      }, null, 40, ie)
+        onInput: i
+      }, null, 40, oe)
     ], 2));
   }
-}), oe = ["for"], de = {
+}), ie = ["for"], de = {
   key: 0,
   class: "strand-form-field__required",
   "aria-hidden": "true"
-}, ce = { class: "strand-form-field__control" }, ue = ["id"], fe = ["id"], fa = /* @__PURE__ */ h({
+}, ce = { class: "strand-form-field__control" }, ue = ["id"], fe = ["id"], ma = /* @__PURE__ */ h({
   __name: "FormField",
   props: {
     label: {},
@@ -440,9 +440,9 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         class: "strand-form-field__label",
         for: e.htmlFor
       }, [
-        N(_(e.label) + " ", 1),
-        e.required ? (n(), l("span", de, " * ")) : $("", !0)
-      ], 8, oe),
+        T(_(e.label) + " ", 1),
+        e.required ? (n(), l("span", de, " * ")) : p("", !0)
+      ], 8, ie),
       f("div", ce, [
         g(r.$slots, "default")
       ]),
@@ -455,10 +455,10 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         key: 1,
         class: "strand-form-field__hint",
         id: `${e.htmlFor}-hint`
-      }, _(e.hint), 9, fe)) : $("", !0)
+      }, _(e.hint), 9, fe)) : p("", !0)
     ], 2));
   }
-}), va = /* @__PURE__ */ h({
+}), ha = /* @__PURE__ */ h({
   __name: "Card",
   props: {
     variant: { default: "elevated" },
@@ -474,11 +474,11 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         t.className
       ].filter(Boolean).join(" ")
     );
-    return (r, s) => (n(), l("div", y({ class: a.value }, r.$attrs), [
+    return (r, s) => (n(), l("div", k({ class: a.value }, r.$attrs), [
       g(r.$slots, "default")
     ], 16));
   }
-}), ve = ["aria-label"], ma = /* @__PURE__ */ h({
+}), ve = ["aria-label"], _a = /* @__PURE__ */ h({
   __name: "Badge",
   props: {
     variant: { default: "count" },
@@ -488,7 +488,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     className: { default: "" }
   },
   setup(e) {
-    const t = e, a = E(), r = c(() => !!a.default), s = c(() => t.variant === "count" ? t.count != null && t.count > t.maxCount ? `${t.maxCount}+` : t.count : null), o = c(() => {
+    const t = e, a = E(), r = c(() => !!a.default), s = c(() => t.variant === "count" ? t.count != null && t.count > t.maxCount ? `${t.maxCount}+` : t.count : null), i = c(() => {
       if (t.variant === "dot") return "Status indicator";
       if (t.count != null) return `${t.count} notifications`;
     }), d = c(
@@ -497,14 +497,14 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         `strand-badge--${t.variant}`,
         `strand-badge--${t.status}`
       ].filter(Boolean).join(" ")
-    ), i = c(
+    ), o = c(
       () => r.value ? ["strand-badge", t.className].filter(Boolean).join(" ") : ["strand-badge", "strand-badge--inline", t.className].filter(Boolean).join(" ")
     );
-    return (u, m) => (n(), l("span", y({ class: i.value }, u.$attrs), [
+    return (u, m) => (n(), l("span", k({ class: o.value }, u.$attrs), [
       g(u.$slots, "default"),
       f("span", {
         class: b(d.value),
-        "aria-label": o.value,
+        "aria-label": i.value,
         role: "status"
       }, _(s.value), 11, ve)
     ], 16));
@@ -513,7 +513,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   key: 1,
   class: "strand-avatar__initials",
   "aria-hidden": "true"
-}, ha = /* @__PURE__ */ h({
+}, ba = /* @__PURE__ */ h({
   __name: "Avatar",
   props: {
     src: {},
@@ -525,28 +525,28 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   setup(e) {
     const t = e, a = x(!1), r = () => {
       a.value = !0;
-    }, s = c(() => t.src && !a.value), o = c(() => t.initials.slice(0, 2).toUpperCase()), d = c(
+    }, s = c(() => t.src && !a.value), i = c(() => t.initials.slice(0, 2).toUpperCase()), d = c(
       () => [
         "strand-avatar",
         `strand-avatar--${t.size}`,
         t.className
       ].filter(Boolean).join(" ")
     );
-    return (i, u) => (n(), l("div", y({
+    return (o, u) => (n(), l("div", k({
       class: d.value,
       role: "img",
-      "aria-label": e.alt || o.value
-    }, i.$attrs), [
+      "aria-label": e.alt || i.value
+    }, o.$attrs), [
       s.value ? (n(), l("img", {
         key: 0,
         class: "strand-avatar__img",
         src: e.src,
         alt: e.alt,
         onError: r
-      }, null, 40, he)) : (n(), l("span", _e, _(o.value), 1))
+      }, null, 40, he)) : (n(), l("span", _e, _(i.value), 1))
     ], 16, me));
   }
-}), be = { class: "strand-tag__text" }, _a = /* @__PURE__ */ h({
+}), be = { class: "strand-tag__text" }, pa = /* @__PURE__ */ h({
   __name: "Tag",
   props: {
     variant: { default: "solid" },
@@ -564,16 +564,16 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         a.className
       ].filter(Boolean).join(" ")
     );
-    return (o, d) => (n(), l("span", y({ class: s.value }, o.$attrs), [
+    return (i, d) => (n(), l("span", k({ class: s.value }, i.$attrs), [
       f("span", be, [
-        g(o.$slots, "default")
+        g(i.$slots, "default")
       ]),
       e.removable ? (n(), l("button", {
         key: 0,
         type: "button",
         class: "strand-tag__remove",
         "aria-label": "Remove",
-        onClick: d[0] || (d[0] = (i) => r("remove"))
+        onClick: d[0] || (d[0] = (o) => r("remove"))
       }, [...d[1] || (d[1] = [
         f("svg", {
           width: "12",
@@ -589,13 +589,13 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
             "stroke-linecap": "round"
           })
         ], -1)
-      ])])) : $("", !0)
+      ])])) : p("", !0)
     ], 16));
   }
-}), pe = { class: "strand-table" }, $e = { class: "strand-table__head" }, ge = ["aria-label", "onClick"], ye = {
+}), pe = { class: "strand-table" }, $e = { class: "strand-table__head" }, ge = ["aria-label", "onClick"], ke = {
   class: "strand-table__sort-indicator",
   "aria-hidden": "true"
-}, ke = { class: "strand-table__body" }, ba = /* @__PURE__ */ h({
+}, ye = { class: "strand-table__body" }, $a = /* @__PURE__ */ h({
   __name: "Table",
   props: {
     columns: {},
@@ -603,23 +603,23 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   },
   emits: ["sort"],
   setup(e, { emit: t }) {
-    const a = t, r = x(null), s = x("asc"), o = c(
+    const a = t, r = x(null), s = x("asc"), i = c(
       () => ["strand-table-wrapper"].filter(Boolean).join(" ")
     );
     function d(u) {
       const m = r.value === u && s.value === "asc" ? "desc" : "asc";
       r.value = u, s.value = m, a("sort", u, m);
     }
-    function i(u) {
+    function o(u) {
       return r.value === u ? s.value === "asc" ? "↑" : "↓" : "↕";
     }
     return (u, m) => (n(), l("div", {
-      class: b(o.value)
+      class: b(i.value)
     }, [
       f("table", pe, [
         f("thead", $e, [
           f("tr", null, [
-            (n(!0), l(k, null, w(e.columns, (v) => (n(), l("th", {
+            (n(!0), l(y, null, w(e.columns, (v) => (n(), l("th", {
               key: v.key,
               class: "strand-table__th",
               style: S(v.width ? { width: v.width } : void 0)
@@ -631,29 +631,29 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
                 "aria-label": `Sort by ${v.header}`,
                 onClick: (B) => d(v.key)
               }, [
-                N(_(v.header) + " ", 1),
-                f("span", ye, _(i(v.key)), 1)
-              ], 8, ge)) : (n(), l(k, { key: 1 }, [
-                N(_(v.header), 1)
+                T(_(v.header) + " ", 1),
+                f("span", ke, _(o(v.key)), 1)
+              ], 8, ge)) : (n(), l(y, { key: 1 }, [
+                T(_(v.header), 1)
               ], 64))
             ], 4))), 128))
           ])
         ]),
-        f("tbody", ke, [
-          (n(!0), l(k, null, w(e.data, (v, B) => (n(), l("tr", {
+        f("tbody", ye, [
+          (n(!0), l(y, null, w(e.data, (v, B) => (n(), l("tr", {
             key: B,
             class: "strand-table__row"
           }, [
-            (n(!0), l(k, null, w(e.columns, (p) => (n(), l("td", {
-              key: p.key,
+            (n(!0), l(y, null, w(e.columns, ($) => (n(), l("td", {
+              key: $.key,
               class: "strand-table__td"
-            }, _(v[p.key]), 1))), 128))
+            }, _(v[$.key]), 1))), 128))
           ]))), 128))
         ])
       ])
     ], 2));
   }
-}), Be = { class: "strand-data-readout__label" }, we = { class: "strand-data-readout__value" }, pa = /* @__PURE__ */ h({
+}), Be = { class: "strand-data-readout__label" }, we = { class: "strand-data-readout__value" }, ga = /* @__PURE__ */ h({
   __name: "DataReadout",
   props: {
     label: {},
@@ -669,12 +669,33 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         t.className
       ].filter(Boolean).join(" ")
     );
-    return (r, s) => (n(), l("div", y({ class: a.value }, r.$attrs), [
+    return (r, s) => (n(), l("div", k({ class: a.value }, r.$attrs), [
       f("span", Be, _(e.label), 1),
       f("span", we, _(e.value), 1)
     ], 16));
   }
-}), $a = /* @__PURE__ */ h({
+}), xe = {
+  key: 0,
+  class: "strand-code-block__label"
+}, Ce = { class: "strand-code-block__pre" }, ka = /* @__PURE__ */ h({
+  __name: "CodeBlock",
+  props: {
+    code: {},
+    language: {},
+    className: { default: "" }
+  },
+  setup(e) {
+    const t = e, a = c(
+      () => ["strand-code-block", t.className].filter(Boolean).join(" ")
+    );
+    return (r, s) => (n(), l("div", k({ class: a.value }, r.$attrs), [
+      e.language ? (n(), l("span", xe, _(e.language), 1)) : p("", !0),
+      f("pre", Ce, [
+        f("code", null, _(e.code), 1)
+      ])
+    ], 16));
+  }
+}), ya = /* @__PURE__ */ h({
   __name: "Stack",
   props: {
     direction: { default: "vertical" },
@@ -697,14 +718,14 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     ), r = c(() => ({
       gap: `var(--strand-space-${t.gap})`
     }));
-    return (s, o) => (n(), l("div", y({
+    return (s, i) => (n(), l("div", k({
       class: a.value,
       style: r.value
     }, s.$attrs), [
       g(s.$slots, "default")
     ], 16));
   }
-}), ga = /* @__PURE__ */ h({
+}), Ba = /* @__PURE__ */ h({
   __name: "Grid",
   props: {
     columns: { default: 1 },
@@ -718,14 +739,14 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       gridTemplateColumns: `repeat(${t.columns}, 1fr)`,
       gap: `var(--strand-space-${t.gap})`
     }));
-    return (s, o) => (n(), l("div", y({
+    return (s, i) => (n(), l("div", k({
       class: a.value,
       style: r.value
     }, s.$attrs), [
       g(s.$slots, "default")
     ], 16));
   }
-}), ya = /* @__PURE__ */ h({
+}), wa = /* @__PURE__ */ h({
   __name: "Container",
   props: {
     size: { default: "default" },
@@ -739,11 +760,11 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         t.className
       ].filter(Boolean).join(" ")
     );
-    return (r, s) => (n(), l("div", y({ class: a.value }, r.$attrs), [
+    return (r, s) => (n(), l("div", k({ class: a.value }, r.$attrs), [
       g(r.$slots, "default")
     ], 16));
   }
-}), xe = { class: "strand-divider__label" }, ka = /* @__PURE__ */ h({
+}), je = { class: "strand-divider__label" }, xa = /* @__PURE__ */ h({
   __name: "Divider",
   props: {
     direction: { default: "horizontal" },
@@ -754,7 +775,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     const t = e, a = c(() => t.direction === "vertical"), r = c(() => !a.value && !!t.label);
     c(() => !a.value && !t.label);
     const s = c(() => a.value ? ["strand-divider", "strand-divider--vertical", t.className].filter(Boolean).join(" ") : r.value ? ["strand-divider", "strand-divider--horizontal", "strand-divider--labeled", t.className].filter(Boolean).join(" ") : ["strand-divider", "strand-divider--horizontal", t.className].filter(Boolean).join(" "));
-    return (o, d) => a.value ? (n(), l("div", {
+    return (i, d) => a.value ? (n(), l("div", {
       key: 0,
       class: b(s.value),
       role: "separator",
@@ -766,7 +787,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       "aria-orientation": "horizontal"
     }, [
       d[0] || (d[0] = f("span", { class: "strand-divider__line" }, null, -1)),
-      f("span", xe, _(e.label), 1),
+      f("span", je, _(e.label), 1),
       d[1] || (d[1] = f("span", { class: "strand-divider__line" }, null, -1))
     ], 2)) : (n(), l("hr", {
       key: 2,
@@ -775,7 +796,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       "aria-orientation": "horizontal"
     }, null, 2));
   }
-}), Ba = /* @__PURE__ */ h({
+}), Ca = /* @__PURE__ */ h({
   __name: "Section",
   props: {
     variant: { default: "standard" },
@@ -791,11 +812,11 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         t.className
       ].filter(Boolean).join(" ")
     );
-    return (r, s) => (n(), l("section", y({ class: a.value }, r.$attrs), [
+    return (r, s) => (n(), l("section", k({ class: a.value }, r.$attrs), [
       g(r.$slots, "default")
     ], 16));
   }
-}), Ce = ["href"], wa = /* @__PURE__ */ h({
+}), Ne = ["href"], ja = /* @__PURE__ */ h({
   __name: "Link",
   props: {
     href: {},
@@ -806,7 +827,7 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
     const t = e, a = c(
       () => ["strand-link", t.className].filter(Boolean).join(" ")
     );
-    return (r, s) => (n(), l("a", y({
+    return (r, s) => (n(), l("a", k({
       href: e.href,
       class: a.value
     }, {
@@ -814,9 +835,9 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       ...r.$attrs
     }), [
       g(r.$slots, "default")
-    ], 16, Ce));
+    ], 16, Ne));
   }
-}), je = ["id", "aria-selected", "aria-controls", "tabindex", "onClick"], Te = ["id", "aria-labelledby", "hidden"], xa = /* @__PURE__ */ h({
+}), Te = ["id", "aria-selected", "aria-controls", "tabindex", "onClick"], Se = ["id", "aria-labelledby", "hidden"], Na = /* @__PURE__ */ h({
   __name: "Tabs",
   props: {
     tabs: {},
@@ -824,17 +845,17 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   },
   emits: ["change"],
   setup(e, { emit: t }) {
-    const a = e, r = t, s = x(null), o = c(() => ["strand-tabs"].filter(Boolean).join(" "));
+    const a = e, r = t, s = x(null), i = c(() => ["strand-tabs"].filter(Boolean).join(" "));
     function d(u) {
       var v, B;
       const m = a.tabs[u];
       if (m) {
         r("change", m.id);
-        const p = (v = s.value) == null ? void 0 : v.querySelectorAll('[role="tab"]');
-        (B = p == null ? void 0 : p[u]) == null || B.focus();
+        const $ = (v = s.value) == null ? void 0 : v.querySelectorAll('[role="tab"]');
+        (B = $ == null ? void 0 : $[u]) == null || B.focus();
       }
     }
-    function i(u) {
+    function o(u) {
       const m = a.tabs.findIndex((B) => B.id === a.activeTab);
       let v = null;
       switch (u.key) {
@@ -856,15 +877,15 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       u.preventDefault(), d(v);
     }
     return (u, m) => (n(), l("div", {
-      class: b(o.value)
+      class: b(i.value)
     }, [
       f("div", {
         ref_key: "tablistRef",
         ref: s,
         role: "tablist",
-        onKeydown: i
+        onKeydown: o
       }, [
-        (n(!0), l(k, null, w(e.tabs, (v) => (n(), l("button", {
+        (n(!0), l(y, null, w(e.tabs, (v) => (n(), l("button", {
           key: v.id,
           id: `tab-${v.id}`,
           role: "tab",
@@ -877,9 +898,9 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
           "aria-controls": `panel-${v.id}`,
           tabindex: v.id === e.activeTab ? 0 : -1,
           onClick: (B) => r("change", v.id)
-        }, _(v.label), 11, je))), 128))
+        }, _(v.label), 11, Te))), 128))
       ], 544),
-      (n(!0), l(k, null, w(e.tabs, (v) => (n(), l("div", {
+      (n(!0), l(y, null, w(e.tabs, (v) => (n(), l("div", {
         key: v.id,
         id: `panel-${v.id}`,
         role: "tabpanel",
@@ -888,18 +909,18 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
         tabindex: 0
       }, [
         g(u.$slots, `panel-${v.id}`)
-      ], 8, Te))), 128))
+      ], 8, Se))), 128))
     ], 2));
   }
-}), Ne = { class: "strand-breadcrumb__list" }, Se = {
+}), ze = { class: "strand-breadcrumb__list" }, Ve = {
   key: 0,
   class: "strand-breadcrumb__separator",
   "aria-hidden": "true"
-}, ze = {
+}, De = {
   key: 1,
   class: "strand-breadcrumb__current",
   "aria-current": "page"
-}, Ve = ["href"], Ca = /* @__PURE__ */ h({
+}, Ie = ["href"], Ta = /* @__PURE__ */ h({
   __name: "Breadcrumb",
   props: {
     items: {},
@@ -913,31 +934,31 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       "aria-label": "Breadcrumb",
       class: b(t.value)
     }, [
-      f("ol", Ne, [
-        (n(!0), l(k, null, w(e.items, (s, o) => (n(), l("li", {
-          key: `${s.label}-${o}`,
+      f("ol", ze, [
+        (n(!0), l(y, null, w(e.items, (s, i) => (n(), l("li", {
+          key: `${s.label}-${i}`,
           class: "strand-breadcrumb__item"
         }, [
-          o > 0 ? (n(), l("span", Se, _(e.separator), 1)) : $("", !0),
-          o === e.items.length - 1 ? (n(), l("span", ze, _(s.label), 1)) : (n(), l("a", {
+          i > 0 ? (n(), l("span", Ve, _(e.separator), 1)) : p("", !0),
+          i === e.items.length - 1 ? (n(), l("span", De, _(s.label), 1)) : (n(), l("a", {
             key: 2,
             href: s.href,
             class: "strand-breadcrumb__link"
-          }, _(s.label), 9, Ve))
+          }, _(s.label), 9, Ie))
         ]))), 128))
       ])
     ], 2));
   }
-}), De = { class: "strand-nav__inner" }, Ie = {
+}), Re = { class: "strand-nav__inner" }, Ee = {
   key: 0,
   class: "strand-nav__logo"
-}, Re = { class: "strand-nav__items" }, Ee = ["href", "aria-current"], Le = {
+}, Le = { class: "strand-nav__items" }, Oe = ["href", "aria-current"], Ae = {
   key: 1,
   class: "strand-nav__actions"
-}, Oe = ["aria-expanded", "aria-label"], Ae = {
+}, Fe = ["aria-expanded", "aria-label"], Ke = {
   key: 0,
   class: "strand-nav__mobile-menu"
-}, Fe = ["href", "aria-current"], ja = /* @__PURE__ */ h({
+}, Me = ["href", "aria-current"], Sa = /* @__PURE__ */ h({
   __name: "Nav",
   props: {
     items: { default: () => [] }
@@ -948,16 +969,16 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
       t.value = !t.value;
     }
     const r = c(() => ["strand-nav"].filter(Boolean).join(" "));
-    return (s, o) => (n(), l("nav", {
+    return (s, i) => (n(), l("nav", {
       class: b(r.value),
       "aria-label": "Main navigation"
     }, [
-      f("div", De, [
-        s.$slots.logo ? (n(), l("div", Ie, [
+      f("div", Re, [
+        s.$slots.logo ? (n(), l("div", Ee, [
           g(s.$slots, "logo")
-        ])) : $("", !0),
-        f("div", Re, [
-          (n(!0), l(k, null, w(e.items, (d) => (n(), l("a", {
+        ])) : p("", !0),
+        f("div", Le, [
+          (n(!0), l(y, null, w(e.items, (d) => (n(), l("a", {
             key: d.href,
             href: d.href,
             class: b([
@@ -965,26 +986,26 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
               d.active && "strand-nav__link--active"
             ].filter(Boolean).join(" ")),
             "aria-current": d.active ? "page" : void 0
-          }, _(d.label), 11, Ee))), 128))
+          }, _(d.label), 11, Oe))), 128))
         ]),
-        s.$slots.actions ? (n(), l("div", Le, [
+        s.$slots.actions ? (n(), l("div", Ae, [
           g(s.$slots, "actions")
-        ])) : $("", !0),
+        ])) : p("", !0),
         f("button", {
           type: "button",
           class: "strand-nav__hamburger",
           "aria-expanded": t.value ? "true" : "false",
           "aria-label": t.value ? "Close menu" : "Menu",
           onClick: a
-        }, [...o[0] || (o[0] = [
+        }, [...i[0] || (i[0] = [
           f("span", {
             class: "strand-nav__hamburger-icon",
             "aria-hidden": "true"
           }, null, -1)
-        ])], 8, Oe)
+        ])], 8, Fe)
       ]),
-      t.value ? (n(), l("div", Ae, [
-        (n(!0), l(k, null, w(e.items, (d) => (n(), l("a", {
+      t.value ? (n(), l("div", Ke, [
+        (n(!0), l(y, null, w(e.items, (d) => (n(), l("a", {
           key: d.href,
           href: d.href,
           class: b([
@@ -992,11 +1013,11 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
             d.active && "strand-nav__mobile-link--active"
           ].filter(Boolean).join(" ")),
           "aria-current": d.active ? "page" : void 0
-        }, _(d.label), 11, Fe))), 128))
-      ])) : $("", !0)
+        }, _(d.label), 11, Me))), 128))
+      ])) : p("", !0)
     ], 2));
   }
-}), Ke = ["aria-live"], Me = { class: "strand-toast__message" }, Ta = /* @__PURE__ */ h({
+}), Pe = ["aria-live"], qe = { class: "strand-toast__message" }, za = /* @__PURE__ */ h({
   __name: "Toast",
   props: {
     status: { default: "info" },
@@ -1006,50 +1027,50 @@ const M = ["type", "disabled", "aria-disabled", "aria-busy"], P = {
   setup(e, { emit: t }) {
     const a = e, r = t, s = c(
       () => a.status === "error" || a.status === "warning"
-    ), o = c(
+    ), i = c(
       () => ["strand-toast", `strand-toast--${a.status}`].filter(Boolean).join(" ")
     );
-    return (d, i) => (n(), l("div", {
-      class: b(o.value),
+    return (d, o) => (n(), l("div", {
+      class: b(i.value),
       role: "status",
       "aria-live": s.value ? "assertive" : "polite"
     }, [
-      f("span", Me, _(e.message), 1),
+      f("span", qe, _(e.message), 1),
       f("button", {
         type: "button",
         class: "strand-toast__dismiss",
         "aria-label": "Dismiss",
-        onClick: i[0] || (i[0] = (u) => r("dismiss"))
+        onClick: o[0] || (o[0] = (u) => r("dismiss"))
       }, " × ")
-    ], 10, Ke));
+    ], 10, Pe));
   }
 });
 /*! Strand Vue | MIT License | dillingerstaffing.com */
 const O = Symbol("StrandToast");
-function Na() {
+function Va() {
   const e = A(O);
   if (!e)
     throw new Error("useToast must be used within a ToastProvider");
   return e;
 }
-const Pe = {
+const Ue = {
   key: 0,
   class: "strand-toast__container"
-}, qe = ["aria-live"], Ue = { class: "strand-toast__message" }, Ge = ["onClick"], Sa = /* @__PURE__ */ h({
+}, Ge = ["aria-live"], He = { class: "strand-toast__message" }, We = ["onClick"], Da = /* @__PURE__ */ h({
   __name: "ToastProvider",
   setup(e) {
     let t = 0;
     const a = x([]), r = /* @__PURE__ */ new Map();
-    function s(i) {
-      const u = r.get(i);
-      u !== void 0 && (clearTimeout(u), r.delete(i)), a.value = a.value.filter((m) => m.id !== i);
+    function s(o) {
+      const u = r.get(o);
+      u !== void 0 && (clearTimeout(u), r.delete(o)), a.value = a.value.filter((m) => m.id !== o);
     }
-    function o(i) {
+    function i(o) {
       const u = {
         id: ++t,
-        message: i.message,
-        status: i.status ?? "info",
-        duration: i.duration ?? 5e3
+        message: o.message,
+        status: o.status ?? "info",
+        duration: o.duration ?? 5e3
       };
       if (a.value = [...a.value, u], u.duration > 0) {
         const m = setTimeout(() => {
@@ -1058,35 +1079,35 @@ const Pe = {
         r.set(u.id, m);
       }
     }
-    F(O, { toast: o }), V(() => {
-      for (const i of r.values())
-        clearTimeout(i);
+    F(O, { toast: i }), V(() => {
+      for (const o of r.values())
+        clearTimeout(o);
       r.clear();
     });
-    function d(i) {
-      return i === "error" || i === "warning";
+    function d(o) {
+      return o === "error" || o === "warning";
     }
-    return (i, u) => (n(), l(k, null, [
-      g(i.$slots, "default"),
-      a.value.length > 0 ? (n(), l("div", Pe, [
-        (n(!0), l(k, null, w(a.value, (m) => (n(), l("div", {
+    return (o, u) => (n(), l(y, null, [
+      g(o.$slots, "default"),
+      a.value.length > 0 ? (n(), l("div", Ue, [
+        (n(!0), l(y, null, w(a.value, (m) => (n(), l("div", {
           key: m.id,
           class: b(["strand-toast", `strand-toast--${m.status}`].join(" ")),
           role: "status",
           "aria-live": d(m.status) ? "assertive" : "polite"
         }, [
-          f("span", Ue, _(m.message), 1),
+          f("span", He, _(m.message), 1),
           f("button", {
             type: "button",
             class: "strand-toast__dismiss",
             "aria-label": "Dismiss",
             onClick: (v) => s(m.id)
-          }, " × ", 8, Ge)
-        ], 10, qe))), 128))
-      ])) : $("", !0)
+          }, " × ", 8, We)
+        ], 10, Ge))), 128))
+      ])) : p("", !0)
     ], 64));
   }
-}), He = ["role"], We = { class: "strand-alert__content" }, za = /* @__PURE__ */ h({
+}), Ze = ["role"], Je = { class: "strand-alert__content" }, Ia = /* @__PURE__ */ h({
   __name: "Alert",
   props: {
     status: { default: "info" },
@@ -1096,7 +1117,7 @@ const Pe = {
   setup(e, { emit: t }) {
     const a = e, r = t, s = c(
       () => a.status === "error" || a.status === "warning" ? "alert" : "status"
-    ), o = c(
+    ), i = c(
       () => [
         "strand-alert",
         `strand-alert--${a.status}`
@@ -1105,12 +1126,12 @@ const Pe = {
     function d() {
       r("dismiss");
     }
-    return (i, u) => (n(), l("div", {
-      class: b(o.value),
+    return (o, u) => (n(), l("div", {
+      class: b(i.value),
       role: s.value
     }, [
-      f("div", We, [
-        g(i.$slots, "default")
+      f("div", Je, [
+        g(o.$slots, "default")
       ]),
       e.dismissible ? (n(), l("button", {
         key: 0,
@@ -1118,13 +1139,13 @@ const Pe = {
         class: "strand-alert__dismiss",
         "aria-label": "Dismiss",
         onClick: d
-      }, " × ")) : $("", !0)
-    ], 10, He));
+      }, " × ")) : p("", !0)
+    ], 10, Ze));
   }
-}), Ze = ["aria-labelledby"], Je = {
+}), Qe = ["aria-labelledby"], Xe = {
   key: 0,
   class: "strand-dialog__header"
-}, Qe = { class: "strand-dialog__body" }, R = 'a[href], button:not(:disabled), textarea:not(:disabled), input:not(:disabled), select:not(:disabled), [tabindex]:not([tabindex="-1"])', Va = /* @__PURE__ */ h({
+}, Ye = { class: "strand-dialog__body" }, R = 'a[href], button:not(:disabled), textarea:not(:disabled), input:not(:disabled), select:not(:disabled), [tabindex]:not([tabindex="-1"])', Ra = /* @__PURE__ */ h({
   __name: "Dialog",
   props: {
     open: { type: Boolean },
@@ -1136,17 +1157,17 @@ const Pe = {
   setup(e, { emit: t }) {
     const a = e, r = t;
     let s = 0;
-    const o = `strand-dialog-title-${++s}`, d = x(null);
-    let i = null, u = "";
+    const i = `strand-dialog-title-${++s}`, d = x(null);
+    let o = null, u = "";
     const m = c(
       () => ["strand-dialog__panel"].filter(Boolean).join(" ")
     );
-    function v(p) {
-      if (p.key === "Escape" && a.closeOnEscape) {
-        p.stopPropagation(), r("close");
+    function v($) {
+      if ($.key === "Escape" && a.closeOnEscape) {
+        $.stopPropagation(), r("close");
         return;
       }
-      if (p.key === "Tab") {
+      if ($.key === "Tab") {
         const C = d.value;
         if (!C) return;
         const j = Array.from(
@@ -1154,29 +1175,29 @@ const Pe = {
         );
         if (j.length === 0) return;
         const D = j[0], I = j[j.length - 1];
-        p.shiftKey ? document.activeElement === D && (p.preventDefault(), I.focus()) : document.activeElement === I && (p.preventDefault(), D.focus());
+        $.shiftKey ? document.activeElement === D && ($.preventDefault(), I.focus()) : document.activeElement === I && ($.preventDefault(), D.focus());
       }
     }
-    function B(p) {
-      a.closeOnOutsideClick && p.target === p.currentTarget && r("close");
+    function B($) {
+      a.closeOnOutsideClick && $.target === $.currentTarget && r("close");
     }
     return z(
       () => a.open,
-      async (p) => {
-        if (p) {
-          i = document.activeElement, u = document.body.style.overflow, document.body.style.overflow = "hidden", await K();
+      async ($) => {
+        if ($) {
+          o = document.activeElement, u = document.body.style.overflow, document.body.style.overflow = "hidden", await K();
           const C = d.value;
           if (C) {
             const j = C.querySelectorAll(R);
             j.length > 0 ? j[0].focus() : C.focus();
           }
         } else
-          document.body.style.overflow = u, i && i instanceof HTMLElement && i.focus();
+          document.body.style.overflow = u, o && o instanceof HTMLElement && o.focus();
       },
       { immediate: !0 }
     ), V(() => {
       a.open && (document.body.style.overflow = u);
-    }), (p, C) => e.open ? (n(), l("div", {
+    }), ($, C) => e.open ? (n(), l("div", {
       key: 0,
       class: "strand-dialog__backdrop",
       onClick: B,
@@ -1188,28 +1209,28 @@ const Pe = {
         class: b(m.value),
         role: "dialog",
         "aria-modal": "true",
-        "aria-labelledby": e.title ? o : void 0,
+        "aria-labelledby": e.title ? i : void 0,
         tabindex: -1
       }, [
-        e.title ? (n(), l("div", Je, [
+        e.title ? (n(), l("div", Xe, [
           f("h2", {
-            id: o,
+            id: i,
             class: "strand-dialog__title"
           }, _(e.title), 1)
-        ])) : $("", !0),
+        ])) : p("", !0),
         f("button", {
           type: "button",
           class: "strand-dialog__close",
           "aria-label": "Close",
           onClick: C[0] || (C[0] = (j) => r("close"))
         }, " × "),
-        f("div", Qe, [
-          g(p.$slots, "default")
+        f("div", Ye, [
+          g($.$slots, "default")
         ])
-      ], 10, Ze)
-    ], 32)) : $("", !0);
+      ], 10, Qe)
+    ], 32)) : p("", !0);
   }
-}), Xe = ["aria-hidden"], Da = /* @__PURE__ */ h({
+}), ea = ["aria-hidden"], Ea = /* @__PURE__ */ h({
   __name: "Tooltip",
   props: {
     content: {},
@@ -1220,17 +1241,17 @@ const Pe = {
     const t = e;
     let a = 0;
     const r = `strand-tooltip-${++a}`, s = x(!1);
-    let o = null;
+    let i = null;
     function d() {
-      o = setTimeout(() => {
+      i = setTimeout(() => {
         s.value = !0;
       }, t.delay);
     }
-    function i() {
-      o !== null && (clearTimeout(o), o = null), s.value = !1;
+    function o() {
+      i !== null && (clearTimeout(i), i = null), s.value = !1;
     }
     V(() => {
-      o !== null && clearTimeout(o);
+      i !== null && clearTimeout(i);
     });
     const u = c(
       () => ["strand-tooltip__wrapper"].filter(Boolean).join(" ")
@@ -1245,9 +1266,9 @@ const Pe = {
       class: b(u.value),
       "aria-describedby": r,
       onMouseenter: d,
-      onMouseleave: i,
+      onMouseleave: o,
       onFocus: d,
-      onBlur: i
+      onBlur: o
     }, [
       g(v.$slots, "default"),
       f("span", {
@@ -1255,10 +1276,10 @@ const Pe = {
         class: b(m.value),
         role: "tooltip",
         "aria-hidden": !s.value
-      }, _(e.content), 11, Xe)
+      }, _(e.content), 11, ea)
     ], 34));
   }
-}), Ye = ["aria-valuenow"], ea = ["width", "height", "viewBox"], aa = ["cx", "cy", "r"], ta = ["cx", "cy", "r", "stroke-dasharray", "stroke-dashoffset", "transform"], T = 3, Ia = /* @__PURE__ */ h({
+}), aa = ["aria-valuenow"], ta = ["width", "height", "viewBox"], sa = ["cx", "cy", "r"], na = ["cx", "cy", "r", "stroke-dasharray", "stroke-dashoffset", "transform"], N = 3, La = /* @__PURE__ */ h({
   __name: "Progress",
   props: {
     variant: { default: "bar" },
@@ -1275,10 +1296,10 @@ const Pe = {
         !r.value && "strand-progress--indeterminate",
         t.className
       ].filter(Boolean).join(" ")
-    ), o = c(() => a[t.size] ?? a.md), d = c(() => (o.value - T) / 2), i = c(() => 2 * Math.PI * d.value), u = c(
-      () => r.value ? i.value - i.value * t.value / 100 : 0
+    ), i = c(() => a[t.size] ?? a.md), d = c(() => (i.value - N) / 2), o = c(() => 2 * Math.PI * d.value), u = c(
+      () => r.value ? o.value - o.value * t.value / 100 : 0
     );
-    return (m, v) => (n(), l("div", y({
+    return (m, v) => (n(), l("div", k({
       class: s.value,
       role: "progressbar",
       "aria-valuemin": 0,
@@ -1287,39 +1308,39 @@ const Pe = {
     }, m.$attrs), [
       e.variant === "ring" ? (n(), l("svg", {
         key: 0,
-        width: o.value,
-        height: o.value,
-        viewBox: `0 0 ${o.value} ${o.value}`,
+        width: i.value,
+        height: i.value,
+        viewBox: `0 0 ${i.value} ${i.value}`,
         class: "strand-progress__ring"
       }, [
         f("circle", {
-          cx: o.value / 2,
-          cy: o.value / 2,
+          cx: i.value / 2,
+          cy: i.value / 2,
           r: d.value,
           fill: "none",
-          "stroke-width": T,
+          "stroke-width": N,
           class: "strand-progress__track"
-        }, null, 8, aa),
+        }, null, 8, sa),
         f("circle", {
-          cx: o.value / 2,
-          cy: o.value / 2,
+          cx: i.value / 2,
+          cy: i.value / 2,
           r: d.value,
           fill: "none",
-          "stroke-width": T,
-          "stroke-dasharray": i.value,
+          "stroke-width": N,
+          "stroke-dasharray": o.value,
           "stroke-dashoffset": r.value ? u.value : void 0,
           "stroke-linecap": "round",
           class: "strand-progress__fill",
-          transform: `rotate(-90 ${o.value / 2} ${o.value / 2})`
-        }, null, 8, ta)
-      ], 8, ea)) : (n(), l("div", {
+          transform: `rotate(-90 ${i.value / 2} ${i.value / 2})`
+        }, null, 8, na)
+      ], 8, ta)) : (n(), l("div", {
         key: 1,
         class: "strand-progress__fill",
         style: S(r.value ? { width: `${e.value}%` } : void 0)
       }, null, 4))
-    ], 16, Ye));
+    ], 16, aa));
   }
-}), Ra = /* @__PURE__ */ h({
+}), Oa = /* @__PURE__ */ h({
   __name: "Spinner",
   props: {
     size: { default: "md" },
@@ -1333,7 +1354,7 @@ const Pe = {
         t.className
       ].filter(Boolean).join(" ")
     );
-    return (r, s) => (n(), l("span", y({
+    return (r, s) => (n(), l("span", k({
       class: a.value,
       role: "status"
     }, r.$attrs), [...s[0] || (s[0] = [
@@ -1344,7 +1365,7 @@ const Pe = {
       f("span", { class: "strand-spinner__sr-only" }, "Loading", -1)
     ])], 16));
   }
-}), Ea = /* @__PURE__ */ h({
+}), Aa = /* @__PURE__ */ h({
   __name: "Skeleton",
   props: {
     variant: { default: "text" },
@@ -1364,50 +1385,51 @@ const Pe = {
         "strand-skeleton--shimmer",
         t.className
       ].filter(Boolean).join(" ")
-    ), o = c(() => ({
+    ), i = c(() => ({
       width: a.value,
       height: r.value
     }));
-    return (d, i) => (n(), l("div", y({
+    return (d, o) => (n(), l("div", k({
       class: s.value,
       "aria-hidden": "true",
-      style: o.value
+      style: i.value
     }, d.$attrs), null, 16));
   }
 });
 export {
-  za as Alert,
-  ha as Avatar,
-  ma as Badge,
-  Ca as Breadcrumb,
-  na as Button,
-  va as Card,
-  oa as Checkbox,
-  ya as Container,
-  pa as DataReadout,
-  Va as Dialog,
-  ka as Divider,
-  fa as FormField,
-  ga as Grid,
-  la as Input,
-  wa as Link,
-  ja as Nav,
-  Ia as Progress,
-  da as Radio,
-  Ba as Section,
-  ia as Select,
-  Ea as Skeleton,
-  ua as Slider,
-  Ra as Spinner,
-  $a as Stack,
-  ca as Switch,
-  ba as Table,
-  xa as Tabs,
-  _a as Tag,
-  ra as Textarea,
-  Ta as Toast,
-  Sa as ToastProvider,
-  Da as Tooltip,
-  Na as useToast
+  Ia as Alert,
+  ba as Avatar,
+  _a as Badge,
+  Ta as Breadcrumb,
+  ra as Button,
+  ha as Card,
+  ca as Checkbox,
+  ka as CodeBlock,
+  wa as Container,
+  ga as DataReadout,
+  Ra as Dialog,
+  xa as Divider,
+  ma as FormField,
+  Ba as Grid,
+  oa as Input,
+  ja as Link,
+  Sa as Nav,
+  La as Progress,
+  ua as Radio,
+  Ca as Section,
+  da as Select,
+  Aa as Skeleton,
+  va as Slider,
+  Oa as Spinner,
+  ya as Stack,
+  fa as Switch,
+  $a as Table,
+  Na as Tabs,
+  pa as Tag,
+  ia as Textarea,
+  za as Toast,
+  Da as ToastProvider,
+  Ea as Tooltip,
+  Va as useToast
 };
 //# sourceMappingURL=index.js.map