@wssto2/vue-core 0.16.0 → 0.18.0

package/dist/index.js

@@ -1,4 +1,4 @@
-const o = "0.16.0";
+const o = "0.18.0";
 export {
   o as version
 };

package/dist/modal/DiscardChangesModal.vue.d.ts

@@ -3,11 +3,11 @@ declare const _default: import("vue").DefineComponent<{}, {
     dismiss: () => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     cancel: () => any;
-    dismissed: () => any;
     confirm: () => any;
+    dismissed: () => any;
 }, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
     onCancel?: (() => any) | undefined;
-    onDismissed?: (() => any) | undefined;
     onConfirm?: (() => any) | undefined;
+    onDismissed?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/modal/Modal.vue.d.ts

@@ -79,12 +79,12 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     dismiss: () => Promise<boolean>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     primary: () => any;
-    presented: () => any;
     dismissed: () => any;
+    presented: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onPrimary?: (() => any) | undefined;
-    onPresented?: (() => any) | undefined;
     onDismissed?: (() => any) | undefined;
+    onPresented?: (() => any) | undefined;
 }>, {
     progress: {
         value: number;

package/dist/modal/Sheet.vue.d.ts

@@ -35,11 +35,11 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     present: typeof present;
     dismiss: typeof dismiss;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    presented: () => any;
     dismissed: () => any;
+    presented: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onPresented?: (() => any) | undefined;
     onDismissed?: (() => any) | undefined;
+    onPresented?: (() => any) | undefined;
 }>, {
     title: string;
     grouped: boolean;

package/dist/modules/identity/routes.d.ts

@@ -18,7 +18,7 @@ export declare const identityRoutes: {
     }, SessionResponse, unknown>;
     readonly loginAsReturn: import("../../client").ApiRoute<void, SessionResponse, unknown>;
     readonly usersList: import("../../client").ApiRoute<{
-        view?: "inactive" | "all" | "locked" | "active" | undefined;
+        view?: "inactive" | "all" | "active" | "locked" | undefined;
         search?: string | undefined;
         order_col?: string | undefined;
         order_dir?: string | undefined;

package/dist/modules/identity/schemas.d.ts

@@ -62,16 +62,16 @@ export type LastSignInFilter = z.infer<typeof LastSignInFilterSchema>;
 export declare const UserViewSchema: z.ZodEnum<{
     inactive: "inactive";
     all: "all";
-    locked: "locked";
     active: "active";
+    locked: "locked";
 }>;
 export type UserView = z.infer<typeof UserViewSchema>;
 export declare const ListUsersInputSchema: z.ZodObject<{
     view: z.ZodOptional<z.ZodEnum<{
         inactive: "inactive";
         all: "all";
-        locked: "locked";
         active: "active";
+        locked: "locked";
     }>>;
     search: z.ZodOptional<z.ZodString>;
     order_col: z.ZodOptional<z.ZodString>;

package/dist/{navigation-DMJ6akat.js → navigation-d-JAPBGA.js}

@@ -1,6 +1,6 @@
 import { computed as k } from "vue";
 import { d as y } from "./context-Ch1r4fdN.js";
-import { h as N } from "./platform-ORzRR3Tw.js";
+import { h as N } from "./platform-DU9QFts8.js";
 function F(l, a = {}) {
   const i = /* @__PURE__ */ new Map(), o = [];
   for (const e of l) {

package/dist/{neighbors-BpypL3Wb.js → neighbors-Dg_LU9ry.js}

@@ -2,7 +2,7 @@ import { computed as j, ref as z, shallowRef as I, watch as F, getCurrentScope a
 import { useRoute as N } from "vue-router";
 import { i as M } from "./error-CD7x0Jrz.js";
 import { w as U } from "./back-LcLlFodC.js";
-import { L as k, d as O, e as D, o as V, q as W } from "./state-QDaxntgR.js";
+import { L as k, d as O, e as D, o as V, q as W } from "./state-z1iPF1DT.js";
 function K(l, t, n, g) {
   return typeof t == "string" ? t : { ...t, query: { ...t.query, [n]: D(l, g) } };
 }

package/dist/notifications/index.js

@@ -1,4 +1,4 @@
-import { d as s, e as a, n as o, b as i, c as n, f as u } from "../index-Ct7W_gYE.js";
+import { d as s, e as a, n as o, b as i, c as n, f as u } from "../index-SLJWm40T.js";
 export {
   s as deadLettersRoutes,
   a as eventsRoutes,

package/dist/onboarding/index.js

@@ -1,7 +1,7 @@
 import { defineComponent as L, ref as d, computed as x, watch as v, nextTick as H, onBeforeUnmount as O, openBlock as F, createBlock as j, Teleport as q, createVNode as w, Transition as U, withCtx as Y, createElementBlock as G, withKeys as J, withModifiers as Q, normalizeStyle as M, unref as n, createElementVNode as l, normalizeClass as W, toDisplayString as k, renderSlot as X, createTextVNode as Z, createCommentVNode as ee } from "vue";
 import { useI18n as te } from "vue-i18n";
 import { _ as V } from "../Icon.vue_vue_type_script_lang-BhhsFYwp.js";
-import { u as ne } from "../usePreferences-BfMXVbSO.js";
+import { u as ne } from "../usePreferences-DB29UTFD.js";
 import { u as oe, a as h } from "../anchored-DpuUwf-9.js";
 const ie = (o) => typeof o == "object" && o !== null && !Array.isArray(o);
 function se(o, e) {

package/dist/options-mOOX6JSS.js

@@ -0,0 +1,214 @@
+import { defineComponent as H, useSlots as R, useAttrs as V, useId as A, computed as c, onBeforeUnmount as D, unref as t, openBlock as i, createBlock as O, mergeProps as T, createSlots as j, withCtx as $, createElementVNode as q, normalizeClass as y, renderSlot as u, createElementBlock as s, createCommentVNode as n, toDisplayString as f, createTextVNode as x, createVNode as z, mergeDefaults as E } from "vue";
+import { useI18n as M } from "vue-i18n";
+import { _ as G } from "./Icon.vue_vue_type_script_lang-BhhsFYwp.js";
+import { a as I, u as P, _ as U, b as J } from "./FormRow.vue_vue_type_script_setup_true_lang-CpgNVQF4.js";
+import { c as K, a as Q } from "./controlSurface-t7OEFESJ.js";
+const W = ["title"], X = {
+  key: 0,
+  class: "mr-1.5 inline-flex shrink-0 items-center align-middle",
+  "data-test": "field-prefix"
+}, Y = {
+  key: 1,
+  class: "mr-1"
+}, Z = {
+  key: 2,
+  class: "ml-1 text-content-muted"
+}, ee = {
+  key: 3,
+  class: "block text-body text-content-disabled"
+}, te = {
+  key: 0,
+  class: "sr-only"
+}, oe = ["data-field-error"], le = ["for"], re = {
+  key: 0,
+  class: "text-content-destructive",
+  "aria-hidden": "true"
+}, ae = {
+  key: 1,
+  class: "flex min-w-0 items-center gap-2"
+}, ie = { class: "min-w-0 flex-1" }, se = {
+  key: 0,
+  class: "mr-1.5 inline-flex shrink-0 items-center align-middle",
+  "data-test": "field-prefix"
+}, ne = ["id"], de = ["id"], be = /* @__PURE__ */ H({
+  __name: "Field",
+  props: /* @__PURE__ */ E({
+    label: {},
+    labelHidden: { type: Boolean },
+    hint: {},
+    error: {},
+    required: { type: Boolean },
+    editable: { type: Boolean },
+    disabled: { type: Boolean },
+    lockedReason: {},
+    presentation: {},
+    name: {},
+    value: { type: [String, Number, Boolean, null] },
+    prefix: {},
+    suffix: {},
+    valueStyle: {},
+    rowLayout: {},
+    rowLabelAlign: {}
+  }, { ...J, value: void 0, prefix: void 0, suffix: void 0, valueStyle: void 0, rowLayout: "entry", rowLabelAlign: "center" }),
+  setup(d) {
+    const e = d, { t: a } = M(), l = R(), g = V(), m = I(), { editable: r, locked: b } = P(e), C = A(), v = c(() => e.name ?? C), h = c(() => `${v.value}-hint`), _ = c(() => `${v.value}-error`);
+    if (m?.registerField) {
+      const o = g["data-field-key"], L = m.registerField(typeof o == "string" ? o : void 0, c(() => e.disabled));
+      D(L);
+    }
+    const p = c(() => {
+      const o = e.value;
+      return o == null ? !1 : typeof o == "string" ? o.length > 0 : typeof o == "number" ? !Number.isNaN(o) : !0;
+    }), B = c(() => typeof e.value == "boolean" ? e.value ? a("core.form.yes") : a("core.form.no") : e.value), F = c(() => !!m && !r.value && m.hideEmpty.value && !p.value && !l.readonly), w = c(() => [e.hint && r.value ? h.value : null, e.error ? _.value : null].filter(Boolean).join(" ") || void 0), k = c(() => {
+      const o = r.value ? e.rowLayout : e.rowLayout === "stacked" ? "stacked" : "value";
+      return e.labelHidden && (o === "entry" || o === "value") ? "stacked" : o;
+    }), N = c(
+      () => r.value && !b.value && e.required ? { "data-field-required": "true", "data-field-filled": p.value ? "true" : void 0 } : {}
+    );
+    return (o, L) => t(m) && !F.value ? (i(), O(U, T({ key: 0 }, N.value, {
+      label: e.label,
+      "label-hidden": e.labelHidden,
+      for: t(r) ? v.value : void 0,
+      sub: t(r) ? e.hint : void 0,
+      "sub-id": h.value,
+      required: t(r) && !t(b) && e.required,
+      layout: k.value,
+      "label-align": k.value === "entry" ? e.rowLabelAlign : void 0,
+      error: t(r) ? e.error : void 0,
+      "error-id": _.value,
+      "data-field-locked": t(b) ? "true" : void 0
+    }), j({
+      default: $(() => [
+        q("div", {
+          class: "relative w-full min-w-0",
+          title: t(b) ? e.lockedReason : void 0
+        }, [
+          q("div", {
+            class: y(t(r) ? k.value === "setting" ? "flex min-w-0 flex-col items-end" : k.value === "stacked" ? "flex min-w-0 flex-col items-stretch" : "flex min-w-0 flex-col items-start compact:items-end" : "")
+          }, [
+            t(r) ? u(o.$slots, "default", {
+              id: v.value,
+              describedby: w.value,
+              invalid: !!e.error,
+              required: e.required,
+              disabled: e.disabled
+            }, void 0, void 0, 0) : t(l).readonly ? u(o.$slots, "readonly", {}, void 0, void 0, 1) : p.value ? (i(), s("span", {
+              key: 2,
+              class: y(["block break-words text-body text-content-strong", e.valueStyle === "mono" ? "font-mono" : e.valueStyle === "numeric" ? "tabular-nums" : ""])
+            }, [
+              t(l).prefix ? (i(), s("span", X, [
+                u(o.$slots, "prefix")
+              ])) : n("", !0),
+              e.prefix ? (i(), s("span", Y, f(e.prefix), 1)) : n("", !0),
+              x(f(B.value), 1),
+              e.suffix ? (i(), s("span", Z, f(e.suffix), 1)) : n("", !0)
+            ], 2)) : (i(), s("span", ee, f(t(a)("core.state.no_value")), 1))
+          ], 2)
+        ], 8, W),
+        t(b) && e.lockedReason ? (i(), s("span", te, f(e.lockedReason), 1)) : n("", !0)
+      ]),
+      _: 2
+    }, [
+      t(r) && t(l).trailing ? {
+        name: "trailing",
+        fn: $(() => [
+          u(o.$slots, "trailing")
+        ]),
+        key: "0"
+      } : void 0,
+      t(r) && t(l).labelTrailing ? {
+        name: "label-trailing",
+        fn: $(() => [
+          u(o.$slots, "labelTrailing")
+        ]),
+        key: "1"
+      } : void 0
+    ]), 1040, ["label", "label-hidden", "for", "sub", "sub-id", "required", "layout", "label-align", "error", "error-id", "data-field-locked"])) : t(m) ? n("", !0) : (i(), s("div", T({ key: 1 }, N.value, {
+      "data-field-error": e.error ? "true" : void 0,
+      class: "flex min-w-0 flex-col gap-1"
+    }), [
+      e.label || t(r) && t(l).labelTrailing ? (i(), s("div", {
+        key: 0,
+        class: y(e.labelHidden && !(t(r) && t(l).labelTrailing) ? "contents" : "flex items-center justify-between gap-3")
+      }, [
+        e.label ? (i(), s("label", {
+          key: 0,
+          for: t(r) ? v.value : void 0,
+          class: y(e.labelHidden ? "sr-only" : "text-footnote font-medium text-content-muted")
+        }, [
+          x(f(e.label), 1),
+          t(r) && e.required ? (i(), s("span", re, " *")) : n("", !0)
+        ], 10, le)) : n("", !0),
+        t(r) ? u(o.$slots, "labelTrailing", {}, void 0, void 0, 1) : n("", !0)
+      ], 2)) : n("", !0),
+      t(r) && t(l).trailing ? (i(), s("div", ae, [
+        q("div", ie, [
+          u(o.$slots, "default", {
+            id: v.value,
+            describedby: w.value,
+            invalid: !!e.error,
+            required: e.required,
+            disabled: e.disabled
+          })
+        ]),
+        u(o.$slots, "trailing")
+      ])) : t(r) ? u(o.$slots, "default", {
+        id: v.value,
+        describedby: w.value,
+        invalid: !!e.error,
+        required: e.required,
+        disabled: e.disabled
+      }, void 0, void 0, 2) : t(l).readonly ? u(o.$slots, "readonly", {}, void 0, void 0, 3) : (i(), s("span", {
+        key: 4,
+        class: y(["text-body", p.value ? "text-content-strong" : "text-content-disabled"])
+      }, [
+        p.value && t(l).prefix ? (i(), s("span", se, [
+          u(o.$slots, "prefix")
+        ])) : n("", !0),
+        x(f(p.value ? `${e.prefix ?? ""}${B.value}${e.suffix ?? ""}` : t(a)("core.state.no_value")), 1)
+      ], 2)),
+      e.hint && t(r) ? (i(), s("p", {
+        key: 5,
+        id: h.value,
+        class: "text-footnote text-content-muted"
+      }, f(e.hint), 9, ne)) : n("", !0),
+      e.error ? (i(), s("p", {
+        key: 6,
+        id: _.value,
+        role: "alert",
+        class: "flex items-start gap-1.5 text-footnote text-content-destructive"
+      }, [
+        z(t(G), {
+          name: "alertTriangle",
+          size: 14,
+          class: "mt-px shrink-0"
+        }),
+        x(" " + f(e.error), 1)
+      ], 8, de)) : n("", !0)
+    ], 16, oe));
+  }
+}), ue = "rounded-control transition-[background-color,box-shadow,opacity] duration-motion-fast ease-motion-standard";
+function ye(d, e) {
+  const a = !!I();
+  return c(() => a ? K({ kind: d, state: e() }) : [ue, ...Q(d, e()).map(([l]) => l)].join(" "));
+}
+function ge(d) {
+  const e = /* @__PURE__ */ new Map();
+  for (const a of d) {
+    const l = a.group ?? null, g = e.get(l) ?? [];
+    g.push(a), e.set(l, g);
+  }
+  return [...e.entries()].sort(([a], [l]) => a === null ? -1 : l === null ? 1 : 0).map(([a, l]) => ({ title: a, options: l }));
+}
+function ke(d, e) {
+  const a = S(e.trim());
+  return a === "" ? d : d.filter((l) => S(l.label).includes(a) || l.description !== void 0 && S(l.description).includes(a));
+}
+const S = (d) => d.normalize("NFD").replace(/[̀-ͯ]/g, "").toLocaleLowerCase();
+export {
+  be as _,
+  S as f,
+  ge as g,
+  ke as m,
+  ye as u
+};

package/dist/overlay/AlertDialog.vue.d.ts

@@ -3,9 +3,9 @@ declare const _default: <Subject = undefined>(__VLS_props: NonNullable<Awaited<t
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly onCancel?: (() => any) | undefined;
         readonly onFailed?: ((error: unknown) => any) | undefined;
-        readonly onDismissed?: (() => any) | undefined;
         readonly onConfirm?: ((subject: Subject) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onCancel" | "onDismissed" | "onFailed" | "onConfirm"> & {
+        readonly onDismissed?: (() => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onCancel" | "onFailed" | "onConfirm" | "onDismissed"> & {
         title: string;
         message?: string;
         /** Says exactly what happens; by default "Confirm". */
@@ -25,7 +25,7 @@ declare const _default: <Subject = undefined>(__VLS_props: NonNullable<Awaited<t
     slots: {
         default?: () => unknown;
     };
-    emit: ((evt: "cancel") => void) & ((evt: "failed", error: unknown) => void) & ((evt: "dismissed") => void) & ((evt: "confirm", subject: Subject) => void);
+    emit: ((evt: "cancel") => void) & ((evt: "failed", error: unknown) => void) & ((evt: "confirm", subject: Subject) => void) & ((evt: "dismissed") => void);
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/overlay/Menu.vue.d.ts

@@ -35,16 +35,16 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     dismiss: () => void;
     toggle: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    presented: () => any;
     dismissed: () => any;
+    presented: () => any;
 }, string, import("vue").PublicProps, Readonly<{
     items: readonly MenuItem[];
     /** The accessible name of the menu. */
     label: string;
     placement?: Placement;
 }> & Readonly<{
-    onPresented?: (() => any) | undefined;
     onDismissed?: (() => any) | undefined;
+    onPresented?: (() => any) | undefined;
 }>, {
     placement: Placement;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {

package/dist/overlay/PhotoViewer.vue.d.ts

@@ -43,12 +43,12 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps,
     present: typeof present;
     dismiss: () => boolean | Promise<boolean>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    presented: () => any;
     dismissed: () => any;
+    presented: () => any;
     "update:index": (value: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    onPresented?: (() => any) | undefined;
     onDismissed?: (() => any) | undefined;
+    onPresented?: (() => any) | undefined;
     "onUpdate:index"?: ((value: number) => any) | undefined;
 }>, {
     title: string;

package/dist/overlay/Popover.vue.d.ts

@@ -54,11 +54,11 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     dismiss: () => void;
     toggle: typeof toggle;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    presented: () => any;
     dismissed: () => any;
+    presented: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onPresented?: (() => any) | undefined;
     onDismissed?: (() => any) | undefined;
+    onPresented?: (() => any) | undefined;
 }>, {
     width: "sm" | "md" | "lg" | "auto";
     placement: Placement;

package/dist/page/SectionNavigator.vue.d.ts

@@ -53,10 +53,10 @@ type __VLS_Slots = {
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     compact: "segmented" | "rows" | "auto" | "hub";
+    steps: Readonly<Record<string, SectionStep>>;
     desktop: "sidebar" | "segments" | "hub";
     backLabel: string;
     counts: Readonly<Record<string, string | number>>;
-    steps: Readonly<Record<string, SectionStep>>;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/page/SectionPanel.vue.d.ts

@@ -32,8 +32,8 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps,
     id: string;
     presentation: "card" | "section";
     subtitle: string;
-    flush: boolean;
     collapsible: boolean;
+    flush: boolean;
     headingLevel: 2 | 3 | 4;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/page/index.js

@@ -1,15 +1,15 @@
-import { _ as W, a as X, b as Y, c as Z, p as ee, u as te, d as ae } from "../AdaptivePageShell.vue_vue_type_script_setup_true_lang-d_dPurWG.js";
+import { _ as W, a as X, b as Y, c as Z, p as ee, u as te, d as ae } from "../AdaptivePageShell.vue_vue_type_script_setup_true_lang-oXWQTfBs.js";
 import { B as se, a as le, u as ne } from "../back-LcLlFodC.js";
 import { _ as ie } from "../BottomDock.vue_vue_type_script_setup_true_lang-CjN7xYEr.js";
 import { b as ue, i as de, u as pe } from "../bottomDock-BZEiOPYZ.js";
 import { _ as x } from "../BottomDockPortal.vue_vue_type_script_setup_true_lang-DmwR-2SP.js";
 import { defineComponent as _, openBlock as a, createBlock as b, withCtx as c, createElementVNode as s, normalizeStyle as k, createElementBlock as l, Fragment as y, renderList as B, normalizeClass as d, unref as v, createCommentVNode as p, toDisplayString as f, useModel as C, useId as P, useTemplateRef as S, computed as $, mergeProps as T, createSlots as w, renderSlot as m, mergeModels as A } from "vue";
 import { _ as L } from "../Icon.vue_vue_type_script_lang-BhhsFYwp.js";
-import { _ as me } from "../RecordHeader.vue_vue_type_script_setup_true_lang-Bt5mT19g.js";
+import { _ as me } from "../RecordHeader.vue_vue_type_script_setup_true_lang-B3BnYg1x.js";
 import { c as ge, i as _e, p as ve, u as he, a as xe, b as ke } from "../chrome-kMBKIB1N.js";
 import { s as D, u as I } from "../sectionIndex-BS0ic5W7.js";
 import { p as Be, a as Ce } from "../sectionIndex-BS0ic5W7.js";
-import { _ as Se } from "../SectionNavigator.vue_vue_type_script_setup_true_lang-BlCx9dVL.js";
+import { _ as Se } from "../SectionNavigator.vue_vue_type_script_setup_true_lang-DCTFxfPB.js";
 import { a as Te, _ as we } from "../SectionList.vue_vue_type_script_setup_true_lang-CodyVezo.js";
 import { _ as K } from "../Panel.vue_vue_type_script_setup_true_lang-D_Wg42hu.js";
 const M = ["aria-label"], R = ["aria-label"], z = ["aria-selected", "tabindex", "onClick"], E = { class: "relative" }, N = {