@assure-one/design-system 1.31.0 → 1.32.0

package/dist/testing/index.js

@@ -0,0 +1,452 @@
+import { act } from 'react';
+
+// src/testing/jest-preset.ts
+var PACKAGE = "@assure-one/design-system";
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function trimSeparators(path) {
+  return path.replace(/[\\/]+$/, "");
+}
+function moduleDir() {
+  if (typeof __dirname === "string") return trimSeparators(__dirname);
+  const path = decodeURIComponent(new URL(".", import.meta.url).pathname);
+  const native = /^\/[A-Za-z]:\//.test(path) ? path.slice(1).replace(/\//g, "\\") : path;
+  return trimSeparators(native);
+}
+function publishedLocations() {
+  const dir = moduleDir();
+  const sep = dir.includes("\\") && !dir.includes("/") ? "\\" : "/";
+  return {
+    distDir: dir.replace(/[\\/][^\\/]+$/, ""),
+    setupFile: `${dir}${sep}setup.cjs`,
+    styleStub: `${dir}${sep}style-stub.cjs`
+  };
+}
+function exemptFromIgnorePattern(pattern, distDir) {
+  const sep = "[\\\\/]";
+  const byName = `${sep}@assure-one${sep}design-system${sep}dist${sep}`;
+  const byPath = escapeRegExp(trimSeparators(distDir)) + sep;
+  return `^(?!.*(?:${byPath}|${byName}))[\\s\\S]*?(?:${pattern})`;
+}
+function createDesignSystemPreset(locations) {
+  return (config, options = {}) => async () => {
+    const resolved = (typeof config === "function" ? await config() : config) ?? {};
+    const { distDir, setupFile, styleStub } = locations();
+    const file = (name) => `${trimSeparators(distDir)}/${name}`;
+    const ignore = resolved.transformIgnorePatterns ?? ["/node_modules/"];
+    const shims = options.polyfills === false ? [] : [setupFile];
+    const own = {
+      [`^${escapeRegExp(PACKAGE)}$`]: file("index.js"),
+      [`^${escapeRegExp(PACKAGE)}/tokens$`]: file("tokens/index.js"),
+      [`^${escapeRegExp(PACKAGE)}/styles\\.css$`]: styleStub
+    };
+    return {
+      ...resolved,
+      // Jest uses the first matching key, so these come first. Spreading
+      // them again keeps their values when the app maps the same key to a stub.
+      moduleNameMapper: { ...own, ...resolved.moduleNameMapper, ...own },
+      transformIgnorePatterns: ignore.map((pattern) => exemptFromIgnorePattern(pattern, distDir)),
+      setupFiles: [...shims, ...resolved.setupFiles ?? []]
+    };
+  };
+}
+var withAssureDesignSystem = createDesignSystemPreset(publishedLocations);
+
+// src/testing/polyfills.ts
+var TOP_LAYER = /* @__PURE__ */ Symbol.for("@assure-one/design-system/testing:top-layer-guard");
+var TOP_LAYER_SELECTORS = /* @__PURE__ */ new Set([":modal", ":fullscreen", ":popover-open"]);
+function installDomPolyfills(options = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return [];
+  const installed = [];
+  const g = globalThis;
+  const w = window;
+  if (typeof g.ResizeObserver === "undefined") {
+    g.ResizeObserver = class ResizeObserver {
+      observe() {
+      }
+      unobserve() {
+      }
+      disconnect() {
+      }
+    };
+    installed.push("ResizeObserver");
+  }
+  if (typeof w.matchMedia !== "function") {
+    const matches3 = options.matchMedia ?? (() => false);
+    w.matchMedia = (query) => ({
+      matches: matches3(query),
+      media: query,
+      onchange: null,
+      addListener() {
+      },
+      removeListener() {
+      },
+      addEventListener() {
+      },
+      removeEventListener() {
+      },
+      dispatchEvent: () => false
+    });
+    installed.push("matchMedia");
+  }
+  if (typeof g.PointerEvent === "undefined") {
+    g.PointerEvent = class PointerEvent extends MouseEvent {
+      pointerId;
+      pointerType;
+      width;
+      height;
+      pressure;
+      isPrimary;
+      constructor(type, init = {}) {
+        super(type, init);
+        this.pointerId = init.pointerId ?? 1;
+        this.pointerType = init.pointerType ?? "mouse";
+        this.width = init.width ?? 1;
+        this.height = init.height ?? 1;
+        this.pressure = init.pressure ?? 0;
+        this.isPrimary = init.isPrimary ?? true;
+      }
+    };
+    installed.push("PointerEvent");
+  }
+  const proto = window.Element.prototype;
+  const methods = [
+    ["hasPointerCapture", () => false],
+    ["setPointerCapture", () => void 0],
+    ["releasePointerCapture", () => void 0],
+    ["scrollIntoView", () => void 0]
+  ];
+  for (const [name, impl] of methods) {
+    if (typeof proto[name] !== "function") {
+      proto[name] = impl;
+      installed.push(name);
+    }
+  }
+  const matches2 = proto.matches;
+  if (/\bjsdom\b/.test(window.navigator.userAgent) && typeof matches2 === "function" && !matches2[TOP_LAYER]) {
+    const guarded = Object.assign(
+      function(selector) {
+        return TOP_LAYER_SELECTORS.has(String(selector).trim()) ? false : matches2.call(this, selector);
+      },
+      { [TOP_LAYER]: true }
+    );
+    proto.matches = guarded;
+    installed.push("topLayerSelectors");
+  }
+  if (typeof g.DOMRect === "undefined") {
+    class DOMRectShim {
+      x;
+      y;
+      width;
+      height;
+      constructor(x = 0, y = 0, width = 0, height = 0) {
+        this.x = x;
+        this.y = y;
+        this.width = width;
+        this.height = height;
+      }
+      get left() {
+        return Math.min(this.x, this.x + this.width);
+      }
+      get right() {
+        return Math.max(this.x, this.x + this.width);
+      }
+      get top() {
+        return Math.min(this.y, this.y + this.height);
+      }
+      get bottom() {
+        return Math.max(this.y, this.y + this.height);
+      }
+      static fromRect(rect = {}) {
+        return new DOMRectShim(rect.x, rect.y, rect.width, rect.height);
+      }
+      toJSON() {
+        const { x, y, width, height, left, right, top, bottom } = this;
+        return { x, y, width, height, left, right, top, bottom };
+      }
+    }
+    g.DOMRect = DOMRectShim;
+    installed.push("DOMRect");
+  }
+  return installed;
+}
+
+// src/testing/toast-recorder.ts
+var REGION = '[role="region"][aria-live]';
+var VARIANT_CLASSES = [
+  ["bg-success-bg", "success"],
+  ["bg-warning-bg", "warning"],
+  ["bg-info/12", "info"]
+];
+function text(node) {
+  return (node?.textContent ?? "").replace(/\s+/g, " ").trim();
+}
+function isElement(node) {
+  return !!node && node.nodeType === Node.ELEMENT_NODE;
+}
+function searchable(node) {
+  const t = node.nodeType;
+  return t === Node.ELEMENT_NODE || t === Node.DOCUMENT_NODE || t === Node.DOCUMENT_FRAGMENT_NODE ? node : null;
+}
+function isToast(node, parent) {
+  return isElement(node) && node.hasAttribute("data-state") && isElement(parent) && parent.matches(REGION);
+}
+function read(el) {
+  const role = el.getAttribute("role") ?? "status";
+  if (role === "group") {
+    return { title: "", description: "", variant: "custom", role, action: null, text: text(el) };
+  }
+  const chip = el.querySelector('span[aria-hidden="true"]');
+  const body = chip?.nextElementSibling ?? null;
+  const paragraphs = Array.from(body?.querySelectorAll(":scope > p") ?? []);
+  const title = paragraphs.find((p) => p.classList.contains("font-semibold"));
+  const description = paragraphs.find((p) => p !== title);
+  const action = body?.querySelector(":scope > button") ?? null;
+  let variant = "default";
+  if (role === "alert") variant = "destructive";
+  else if (chip?.querySelector(".animate-spin")) variant = "loading";
+  else {
+    for (const [cls, v] of VARIANT_CLASSES) if (chip?.classList.contains(cls)) variant = v;
+  }
+  const parts = [text(title), text(description), text(action)];
+  return {
+    title: parts[0],
+    description: parts[1],
+    variant,
+    role,
+    action: action ? parts[2] : null,
+    text: parts.filter(Boolean).join(" ")
+  };
+}
+function createToastRecorder(options = {}) {
+  const root = options.root ?? document.body;
+  const entries = [];
+  const known = /* @__PURE__ */ new Set();
+  const add = (el) => {
+    if (known.has(el)) return;
+    known.add(el);
+    entries.push({ el, snapshot: read(el) });
+  };
+  const within = (node) => {
+    searchable(node)?.querySelectorAll(`${REGION} > [data-state]`).forEach(add);
+  };
+  const handle = (records) => {
+    for (const record of records) {
+      record.addedNodes.forEach((node) => {
+        if (isToast(node, record.target)) add(node);
+      });
+    }
+    for (const record of records) record.addedNodes.forEach(within);
+    for (const entry of entries) if (entry.el.isConnected) entry.snapshot = read(entry.el);
+  };
+  const observer = new MutationObserver(handle);
+  observer.observe(root, { childList: true, subtree: true, characterData: true, attributes: true });
+  let active = true;
+  within(root);
+  const sync = () => {
+    if (active) handle(observer.takeRecords());
+  };
+  const view = () => entries.map(({ el, snapshot }) => ({
+    ...snapshot,
+    open: el.isConnected && el.dataset.state === "open"
+  }));
+  return {
+    get toasts() {
+      sync();
+      return view();
+    },
+    get visible() {
+      const open = searchable(root)?.querySelectorAll(
+        `${REGION} > [data-state="open"]`
+      );
+      return Array.from(open ?? []).map((el) => ({ ...read(el), open: true }));
+    },
+    last() {
+      sync();
+      return view().at(-1);
+    },
+    find(match) {
+      sync();
+      const test = (value) => typeof match === "string" ? value.includes(match) : match.test(value);
+      return view().find((t) => test(t.title) || test(t.description) || test(t.text));
+    },
+    clear() {
+      sync();
+      entries.length = 0;
+    },
+    stop() {
+      sync();
+      active = false;
+      observer.disconnect();
+    }
+  };
+}
+function normalise(text2) {
+  return (text2 ?? "").replace(/\s+/g, " ").trim();
+}
+function matches(text2, match) {
+  return typeof match === "string" ? text2 === normalise(match) : match.test(text2);
+}
+function describe(match) {
+  return typeof match === "string" ? JSON.stringify(match) : String(match);
+}
+function accessibleText(element) {
+  const labelledBy = element.getAttribute("aria-labelledby");
+  if (labelledBy) {
+    const doc = element.ownerDocument;
+    const text2 = labelledBy.split(/\s+/).map((id) => doc.getElementById(id)?.textContent ?? "").join(" ");
+    if (normalise(text2)) return normalise(text2);
+  }
+  return normalise(element.getAttribute("aria-label") ?? element.textContent);
+}
+function isDisabled(element) {
+  return element.hasAttribute("disabled") || element.getAttribute("aria-disabled") === "true" || element.hasAttribute("data-disabled");
+}
+function press(target, key) {
+  const view = target.ownerDocument.defaultView ?? window;
+  const init = { key, code: key === " " ? "Space" : key, bubbles: true, cancelable: true };
+  target.dispatchEvent(new view.KeyboardEvent("keydown", init));
+  target.dispatchEvent(new view.KeyboardEvent("keyup", init));
+}
+async function flush() {
+  await act(async () => {
+    await Promise.resolve();
+  });
+}
+async function waitUntil(find, maxFlushes) {
+  for (let i = 0; i <= maxFlushes; i++) {
+    const found = find();
+    if (found) return found;
+    await flush();
+  }
+  return null;
+}
+function resolveTrigger(target, name, role) {
+  if (typeof target.getByRole === "function") {
+    if (name === void 0)
+      throw new Error(`A ${role} name is required when passing a query object.`);
+    return target.getByRole(role, { name });
+  }
+  return target;
+}
+function popupOf(trigger, role) {
+  const doc = trigger.ownerDocument;
+  const id = trigger.getAttribute("aria-controls");
+  const controlled = id ? doc.getElementById(id) : null;
+  if (controlled?.getAttribute("role") === role) return controlled;
+  if (controlled) {
+    const inner = controlled.querySelector(`[role="${role}"]`);
+    if (inner) return inner;
+  }
+  return null;
+}
+async function selectOption(target, ...rest) {
+  const byQuery = typeof target.getByRole === "function";
+  const label = byQuery ? rest[0] : void 0;
+  const option = byQuery ? rest[1] : rest[0];
+  const settings = (byQuery ? rest[2] : rest[1]) ?? {};
+  const maxFlushes = settings.maxFlushes ?? 20;
+  const trigger = resolveTrigger(target, label, "combobox");
+  if (isDisabled(trigger)) {
+    throw new Error(
+      `selectOption: the select ${describe(label ?? accessibleText(trigger))} is disabled.`
+    );
+  }
+  if (trigger.getAttribute("aria-expanded") !== "true") {
+    await act(async () => {
+      trigger.focus();
+      press(trigger, "Enter");
+    });
+  }
+  const listbox = await waitUntil(() => popupOf(trigger, "listbox"), maxFlushes);
+  if (!listbox) {
+    throw new Error(
+      "selectOption: the list did not open. The helper supports the design-system Select (a combobox trigger that controls a listbox)."
+    );
+  }
+  const all = Array.from(listbox.querySelectorAll('[role="option"]'));
+  const wanted = all.find((el) => matches(accessibleText(el), option));
+  if (!wanted) {
+    const available = all.map((el) => JSON.stringify(accessibleText(el))).join(", ");
+    await act(async () => press(listbox, "Escape"));
+    throw new Error(
+      `selectOption: no option matches ${describe(option)}. Options: ${available || "(none)"}.`
+    );
+  }
+  if (isDisabled(wanted)) {
+    await act(async () => press(listbox, "Escape"));
+    throw new Error(`selectOption: the option ${describe(option)} is disabled.`);
+  }
+  await act(async () => {
+    wanted.focus();
+    press(wanted, "Enter");
+  });
+  const closed = await waitUntil(() => popupOf(trigger, "listbox") ? null : true, maxFlushes);
+  if (!closed)
+    throw new Error(`selectOption: the list stayed open after choosing ${describe(option)}.`);
+}
+async function openMenu(target, ...rest) {
+  const byQuery = typeof target.getByRole === "function";
+  const name = byQuery ? rest[0] : void 0;
+  const settings = (byQuery ? rest[1] : rest[0]) ?? {};
+  const maxFlushes = settings.maxFlushes ?? 20;
+  const trigger = resolveTrigger(target, name, "button");
+  if (isDisabled(trigger)) {
+    throw new Error(
+      `openMenu: the trigger ${describe(name ?? accessibleText(trigger))} is disabled.`
+    );
+  }
+  if (trigger.getAttribute("aria-expanded") !== "true") {
+    await act(async () => {
+      trigger.focus();
+      press(trigger, "ArrowDown");
+    });
+  }
+  const menu = await waitUntil(() => popupOf(trigger, "menu"), maxFlushes);
+  if (!menu) {
+    throw new Error(
+      "openMenu: the menu did not open. The helper supports the design-system DropdownMenu (a trigger with aria-haspopup that controls a menu)."
+    );
+  }
+  const items = () => Array.from(
+    menu.querySelectorAll(
+      '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]'
+    )
+  );
+  const getItem = (itemName) => {
+    const found = items().find((el) => matches(accessibleText(el), itemName));
+    if (!found) {
+      const available = items().map((el) => JSON.stringify(accessibleText(el))).join(", ");
+      throw new Error(
+        `openMenu: no item matches ${describe(itemName)}. Items: ${available || "(none)"}.`
+      );
+    }
+    return found;
+  };
+  const waitClosed = async (what) => {
+    const closed = await waitUntil(() => menu.isConnected ? null : true, maxFlushes);
+    if (!closed) throw new Error(`openMenu: the menu stayed open after ${what}.`);
+  };
+  return {
+    element: menu,
+    items,
+    getItem,
+    async select(itemName) {
+      const item = getItem(itemName);
+      if (isDisabled(item))
+        throw new Error(`openMenu: the item ${describe(itemName)} is disabled.`);
+      await act(async () => {
+        item.focus();
+        press(item, "Enter");
+      });
+      await waitUntil(() => menu.isConnected ? null : true, maxFlushes);
+    },
+    async close() {
+      await act(async () => press(menu, "Escape"));
+      await waitClosed("Escape");
+    }
+  };
+}
+
+export { createToastRecorder, installDomPolyfills, openMenu, selectOption, withAssureDesignSystem };

package/dist/testing/setup.cjs

@@ -0,0 +1,123 @@
+'use strict';
+
+// src/testing/polyfills.ts
+var TOP_LAYER = /* @__PURE__ */ Symbol.for("@assure-one/design-system/testing:top-layer-guard");
+var TOP_LAYER_SELECTORS = /* @__PURE__ */ new Set([":modal", ":fullscreen", ":popover-open"]);
+function installDomPolyfills(options = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return [];
+  const installed = [];
+  const g = globalThis;
+  const w = window;
+  if (typeof g.ResizeObserver === "undefined") {
+    g.ResizeObserver = class ResizeObserver {
+      observe() {
+      }
+      unobserve() {
+      }
+      disconnect() {
+      }
+    };
+    installed.push("ResizeObserver");
+  }
+  if (typeof w.matchMedia !== "function") {
+    const matches2 = options.matchMedia ?? (() => false);
+    w.matchMedia = (query) => ({
+      matches: matches2(query),
+      media: query,
+      onchange: null,
+      addListener() {
+      },
+      removeListener() {
+      },
+      addEventListener() {
+      },
+      removeEventListener() {
+      },
+      dispatchEvent: () => false
+    });
+    installed.push("matchMedia");
+  }
+  if (typeof g.PointerEvent === "undefined") {
+    g.PointerEvent = class PointerEvent extends MouseEvent {
+      pointerId;
+      pointerType;
+      width;
+      height;
+      pressure;
+      isPrimary;
+      constructor(type, init = {}) {
+        super(type, init);
+        this.pointerId = init.pointerId ?? 1;
+        this.pointerType = init.pointerType ?? "mouse";
+        this.width = init.width ?? 1;
+        this.height = init.height ?? 1;
+        this.pressure = init.pressure ?? 0;
+        this.isPrimary = init.isPrimary ?? true;
+      }
+    };
+    installed.push("PointerEvent");
+  }
+  const proto = window.Element.prototype;
+  const methods = [
+    ["hasPointerCapture", () => false],
+    ["setPointerCapture", () => void 0],
+    ["releasePointerCapture", () => void 0],
+    ["scrollIntoView", () => void 0]
+  ];
+  for (const [name, impl] of methods) {
+    if (typeof proto[name] !== "function") {
+      proto[name] = impl;
+      installed.push(name);
+    }
+  }
+  const matches = proto.matches;
+  if (/\bjsdom\b/.test(window.navigator.userAgent) && typeof matches === "function" && !matches[TOP_LAYER]) {
+    const guarded = Object.assign(
+      function(selector) {
+        return TOP_LAYER_SELECTORS.has(String(selector).trim()) ? false : matches.call(this, selector);
+      },
+      { [TOP_LAYER]: true }
+    );
+    proto.matches = guarded;
+    installed.push("topLayerSelectors");
+  }
+  if (typeof g.DOMRect === "undefined") {
+    class DOMRectShim {
+      x;
+      y;
+      width;
+      height;
+      constructor(x = 0, y = 0, width = 0, height = 0) {
+        this.x = x;
+        this.y = y;
+        this.width = width;
+        this.height = height;
+      }
+      get left() {
+        return Math.min(this.x, this.x + this.width);
+      }
+      get right() {
+        return Math.max(this.x, this.x + this.width);
+      }
+      get top() {
+        return Math.min(this.y, this.y + this.height);
+      }
+      get bottom() {
+        return Math.max(this.y, this.y + this.height);
+      }
+      static fromRect(rect = {}) {
+        return new DOMRectShim(rect.x, rect.y, rect.width, rect.height);
+      }
+      toJSON() {
+        const { x, y, width, height, left, right, top, bottom } = this;
+        return { x, y, width, height, left, right, top, bottom };
+      }
+    }
+    g.DOMRect = DOMRectShim;
+    installed.push("DOMRect");
+  }
+  return installed;
+}
+
+// src/testing/setup.ts
+installDomPolyfills();

package/dist/testing/setup.js

@@ -0,0 +1,121 @@
+// src/testing/polyfills.ts
+var TOP_LAYER = /* @__PURE__ */ Symbol.for("@assure-one/design-system/testing:top-layer-guard");
+var TOP_LAYER_SELECTORS = /* @__PURE__ */ new Set([":modal", ":fullscreen", ":popover-open"]);
+function installDomPolyfills(options = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return [];
+  const installed = [];
+  const g = globalThis;
+  const w = window;
+  if (typeof g.ResizeObserver === "undefined") {
+    g.ResizeObserver = class ResizeObserver {
+      observe() {
+      }
+      unobserve() {
+      }
+      disconnect() {
+      }
+    };
+    installed.push("ResizeObserver");
+  }
+  if (typeof w.matchMedia !== "function") {
+    const matches2 = options.matchMedia ?? (() => false);
+    w.matchMedia = (query) => ({
+      matches: matches2(query),
+      media: query,
+      onchange: null,
+      addListener() {
+      },
+      removeListener() {
+      },
+      addEventListener() {
+      },
+      removeEventListener() {
+      },
+      dispatchEvent: () => false
+    });
+    installed.push("matchMedia");
+  }
+  if (typeof g.PointerEvent === "undefined") {
+    g.PointerEvent = class PointerEvent extends MouseEvent {
+      pointerId;
+      pointerType;
+      width;
+      height;
+      pressure;
+      isPrimary;
+      constructor(type, init = {}) {
+        super(type, init);
+        this.pointerId = init.pointerId ?? 1;
+        this.pointerType = init.pointerType ?? "mouse";
+        this.width = init.width ?? 1;
+        this.height = init.height ?? 1;
+        this.pressure = init.pressure ?? 0;
+        this.isPrimary = init.isPrimary ?? true;
+      }
+    };
+    installed.push("PointerEvent");
+  }
+  const proto = window.Element.prototype;
+  const methods = [
+    ["hasPointerCapture", () => false],
+    ["setPointerCapture", () => void 0],
+    ["releasePointerCapture", () => void 0],
+    ["scrollIntoView", () => void 0]
+  ];
+  for (const [name, impl] of methods) {
+    if (typeof proto[name] !== "function") {
+      proto[name] = impl;
+      installed.push(name);
+    }
+  }
+  const matches = proto.matches;
+  if (/\bjsdom\b/.test(window.navigator.userAgent) && typeof matches === "function" && !matches[TOP_LAYER]) {
+    const guarded = Object.assign(
+      function(selector) {
+        return TOP_LAYER_SELECTORS.has(String(selector).trim()) ? false : matches.call(this, selector);
+      },
+      { [TOP_LAYER]: true }
+    );
+    proto.matches = guarded;
+    installed.push("topLayerSelectors");
+  }
+  if (typeof g.DOMRect === "undefined") {
+    class DOMRectShim {
+      x;
+      y;
+      width;
+      height;
+      constructor(x = 0, y = 0, width = 0, height = 0) {
+        this.x = x;
+        this.y = y;
+        this.width = width;
+        this.height = height;
+      }
+      get left() {
+        return Math.min(this.x, this.x + this.width);
+      }
+      get right() {
+        return Math.max(this.x, this.x + this.width);
+      }
+      get top() {
+        return Math.min(this.y, this.y + this.height);
+      }
+      get bottom() {
+        return Math.max(this.y, this.y + this.height);
+      }
+      static fromRect(rect = {}) {
+        return new DOMRectShim(rect.x, rect.y, rect.width, rect.height);
+      }
+      toJSON() {
+        const { x, y, width, height, left, right, top, bottom } = this;
+        return { x, y, width, height, left, right, top, bottom };
+      }
+    }
+    g.DOMRect = DOMRectShim;
+    installed.push("DOMRect");
+  }
+  return installed;
+}
+
+// src/testing/setup.ts
+installDomPolyfills();

package/dist/testing/style-stub.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+// src/testing/style-stub.ts
+var styles = {};
+var style_stub_default = styles;
+
+module.exports = style_stub_default;