@bynder/compact-view 5.2.2 → 5.2.4

package/CollectionView.js

@@ -7,31 +7,31 @@ import { useRouter as v } from "./useRouterStore.js";
 import { useFilterAssets as w } from "./filterAssets.js";
 import { __ as x } from "./index2.js";
 import { StatefulAssetList as F } from "./StatefulAssetList.js";
-import { useAssetFilter as L } from "./AssetFilterContext.js";
-import { useSearchStateByPage as V } from "./useSearchStore.js";
-import { useSimilaritySearchStore as B } from "./useSimilaritySearchStore.js";
-import { useSimilarityAssets as N } from "./getSimilarityAssets.js";
+import { useSearchStateByPage as L } from "./useSearchStore.js";
+import { useSimilaritySearchStore as V } from "./useSimilaritySearchStore.js";
+import { useSimilarityAssets as B } from "./getSimilarityAssets.js";
+import { useAssetFilterStore as N } from "./useAssetFilterStore.js";
 function K(o) {
-  const { value: n } = V("collection"), [, r] = v(), c = k.use.collection(), { language: s, noCache: l } = A(), { assetTypes: a, tags: m, isLimited: u, selectedSmartfilterOptions: d } = L(), {
+  const { value: r } = L("collection"), [, n] = v(), c = k.use.collection(), { language: s, noCache: l } = A(), { assetTypes: a, tags: m, isLimited: u, selectedSmartfilterOptions: d } = N(), {
     isSelected: p,
     isNLSSelected: f,
-    NLSSearchText: g
-  } = B(), { connection: S } = N(), h = w(
+    NLSSearchText: S
+  } = V(), { connection: g } = B(), h = w(
     {
       collection: o.collection,
       filter: { assetTypes: a, selectedSmartfilterOptions: d, tags: m, isLimited: u },
-      searchTerm: n,
+      searchTerm: r,
       orderBy: c,
       language: s
     },
     l
-  ), C = p || f && g;
+  ), C = p || f && S;
   return /* @__PURE__ */ e(b, { children: [
     /* @__PURE__ */ e(T, { "data-testid": "collection-toolbar", children: [
       /* @__PURE__ */ e(
         $,
         {
-          onClick: () => r({ page: "collections" }),
+          onClick: () => n({ page: "collections" }),
           type: "button",
           children: [
             x("Collections"),
@@ -48,7 +48,7 @@ function K(o) {
     /* @__PURE__ */ y(
       F,
       {
-        connection: C ? S : h,
+        connection: C ? g : h,
         totalCount: o.collection.assetCount,
         showActiveFilters: !0
       }

package/ColorPicker.js

@@ -1,6 +1,6 @@
 import { jsxs as w, jsx as o, Fragment as _ } from "react/jsx-runtime";
 import { useState as v, useRef as b } from "react";
-import { useLayer as y, mergeRefs as k } from "react-laag";
+import { useLayer as y, mergeRefs as k } from "./react-laag.esm.js";
 import u from "./styled-components.browser.esm.js";
 import { token as r } from "./token.js";
 import { useId as I } from "./useId.js";

package/ColorPickerSolid.js

@@ -1,8 +1,8 @@
 import { jsxs as t, Fragment as e, jsx as r } from "react/jsx-runtime";
-import { HexColorPicker as m } from "react-colorful";
+import { HexColorPicker as m } from "./index11.js";
 import { ColorHexInput as p } from "./ColorHexInput.js";
 import { InputContainer as c } from "./InputContainer.js";
-function d({
+function s({
   value: n,
   onChange: i
 }) {
@@ -16,5 +16,5 @@ function d({
   ] });
 }
 export {
-  d as ColorPickerSolid
+  s as ColorPickerSolid
 };

package/ColorPickerWithOpacity.js

@@ -1,6 +1,6 @@
 import { jsxs as p, Fragment as c, jsx as i } from "react/jsx-runtime";
-import { HexAlphaColorPicker as m } from "react-colorful";
-import { makeHexWithOpacity as a } from "./makeHexWithOpacity.js";
+import { HexAlphaColorPicker as a } from "./index11.js";
+import { makeHexWithOpacity as m } from "./makeHexWithOpacity.js";
 import { opacityPercentageFromHex as n } from "./opacityPercentageFromHex.js";
 import { ColorHexInput as e } from "./ColorHexInput.js";
 import { InputContainer as y } from "./InputContainer.js";
@@ -10,7 +10,7 @@ function H({
   onChange: t
 }) {
   return /* @__PURE__ */ p(c, { children: [
-    /* @__PURE__ */ i(m, { color: a(o), onChange: (r) => {
+    /* @__PURE__ */ i(a, { color: m(o), onChange: (r) => {
       t({
         color: r.substring(0, 7),
         opacity: n(r)

package/Component.js

@@ -0,0 +1,158 @@
+import { __exports as f } from "./Component2.js";
+import W from "react";
+import { __require as $ } from "./index38.js";
+var C;
+function L() {
+  if (C) return f;
+  C = 1;
+  function y(e) {
+    "@babel/helpers - typeof";
+    return y = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
+      return typeof t;
+    } : function(t) {
+      return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
+    }, y(e);
+  }
+  Object.defineProperty(f, "__esModule", {
+    value: !0
+  }), f.CopyToClipboard = void 0;
+  var p = O(W), w = O($()), j = ["text", "onCopy", "options", "children"];
+  function O(e) {
+    return e && e.__esModule ? e : { default: e };
+  }
+  function _(e, t) {
+    var n = Object.keys(e);
+    if (Object.getOwnPropertySymbols) {
+      var r = Object.getOwnPropertySymbols(e);
+      t && (r = r.filter(function(o) {
+        return Object.getOwnPropertyDescriptor(e, o).enumerable;
+      })), n.push.apply(n, r);
+    }
+    return n;
+  }
+  function h(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var n = arguments[t] != null ? arguments[t] : {};
+      t % 2 ? _(Object(n), !0).forEach(function(r) {
+        b(e, r, n[r]);
+      }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : _(Object(n)).forEach(function(r) {
+        Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(n, r));
+      });
+    }
+    return e;
+  }
+  function S(e, t) {
+    if (e == null) return {};
+    var n = R(e, t), r, o;
+    if (Object.getOwnPropertySymbols) {
+      var i = Object.getOwnPropertySymbols(e);
+      for (o = 0; o < i.length; o++)
+        r = i[o], !(t.indexOf(r) >= 0) && Object.prototype.propertyIsEnumerable.call(e, r) && (n[r] = e[r]);
+    }
+    return n;
+  }
+  function R(e, t) {
+    if (e == null) return {};
+    var n = {}, r = Object.keys(e), o, i;
+    for (i = 0; i < r.length; i++)
+      o = r[i], !(t.indexOf(o) >= 0) && (n[o] = e[o]);
+    return n;
+  }
+  function x(e, t) {
+    if (!(e instanceof t))
+      throw new TypeError("Cannot call a class as a function");
+  }
+  function T(e, t) {
+    for (var n = 0; n < t.length; n++) {
+      var r = t[n];
+      r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), Object.defineProperty(e, r.key, r);
+    }
+  }
+  function E(e, t, n) {
+    return t && T(e.prototype, t), Object.defineProperty(e, "prototype", { writable: !1 }), e;
+  }
+  function k(e, t) {
+    if (typeof t != "function" && t !== null)
+      throw new TypeError("Super expression must either be null or a function");
+    e.prototype = Object.create(t && t.prototype, { constructor: { value: e, writable: !0, configurable: !0 } }), Object.defineProperty(e, "prototype", { writable: !1 }), t && s(e, t);
+  }
+  function s(e, t) {
+    return s = Object.setPrototypeOf || function(r, o) {
+      return r.__proto__ = o, r;
+    }, s(e, t);
+  }
+  function q(e) {
+    var t = I();
+    return function() {
+      var r = c(e), o;
+      if (t) {
+        var i = c(this).constructor;
+        o = Reflect.construct(r, arguments, i);
+      } else
+        o = r.apply(this, arguments);
+      return D(this, o);
+    };
+  }
+  function D(e, t) {
+    if (t && (y(t) === "object" || typeof t == "function"))
+      return t;
+    if (t !== void 0)
+      throw new TypeError("Derived constructors may only return object or undefined");
+    return v(e);
+  }
+  function v(e) {
+    if (e === void 0)
+      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+    return e;
+  }
+  function I() {
+    if (typeof Reflect > "u" || !Reflect.construct || Reflect.construct.sham) return !1;
+    if (typeof Proxy == "function") return !0;
+    try {
+      return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {
+      })), !0;
+    } catch {
+      return !1;
+    }
+  }
+  function c(e) {
+    return c = Object.setPrototypeOf ? Object.getPrototypeOf : function(n) {
+      return n.__proto__ || Object.getPrototypeOf(n);
+    }, c(e);
+  }
+  function b(e, t, n) {
+    return t in e ? Object.defineProperty(e, t, { value: n, enumerable: !0, configurable: !0, writable: !0 }) : e[t] = n, e;
+  }
+  var m = /* @__PURE__ */ (function(e) {
+    k(n, e);
+    var t = q(n);
+    function n() {
+      var r;
+      x(this, n);
+      for (var o = arguments.length, i = new Array(o), u = 0; u < o; u++)
+        i[u] = arguments[u];
+      return r = t.call.apply(t, [this].concat(i)), b(v(r), "onClick", function(d) {
+        var a = r.props, P = a.text, g = a.onCopy, B = a.children, M = a.options, l = p.default.Children.only(B), N = (0, w.default)(P, M);
+        g && g(P, N), l && l.props && typeof l.props.onClick == "function" && l.props.onClick(d);
+      }), r;
+    }
+    return E(n, [{
+      key: "render",
+      value: function() {
+        var o = this.props;
+        o.text, o.onCopy, o.options;
+        var i = o.children, u = S(o, j), d = p.default.Children.only(i);
+        return /* @__PURE__ */ p.default.cloneElement(d, h(h({}, u), {}, {
+          onClick: this.onClick
+        }));
+      }
+    }]), n;
+  })(p.default.PureComponent);
+  return f.CopyToClipboard = m, b(m, "defaultProps", {
+    onCopy: void 0,
+    options: void 0
+  }), f;
+}
+export {
+  L as __require
+};

package/Component2.js

@@ -0,0 +1,4 @@
+var o = {};
+export {
+  o as __exports
+};

package/ConfigContext.js

@@ -1,17 +1,16 @@
-import { createContext as n, useContext as c } from "react";
+import { createContext as s, useContext as c } from "react";
 const i = {
   assetTypes: [],
   language: "en_US",
-  onSuccess: (o, { selectedFile: s }) => console.log(o, s),
+  onSuccess: (t, { selectedFile: n }) => console.log(t, n),
   // eslint-disable-line no-console
   selectionMode: "MultiSelect",
   hideExternalAccess: !1
-}, t = n(i), r = t.Provider, e = () => c(t), d = () => e().assetFilter, u = () => e().selectionMode, a = () => e().hideSwitch;
+}, e = s(i), d = e.Provider, o = () => c(e), r = () => o().selectionMode, u = () => o().hideSwitch;
 export {
-  r as ConfigProvider,
+  d as ConfigProvider,
   i as defaultConfig,
-  d as useAssetFilter,
-  e as useConfig,
-  a as useHideSwitch,
-  u as useSelectionMode
+  o as useConfig,
+  u as useHideSwitch,
+  r as useSelectionMode
 };

package/Container.js

@@ -1,6 +1,6 @@
 import { jsxs as r, jsx as o } from "react/jsx-runtime";
 import i from "./styled-components.browser.esm.js";
-import { IconCancel as l } from "./index4.js";
+import { IconCancel as l } from "./index3.js";
 import { Button as c } from "./Button.js";
 import { token as t } from "./token.js";
 import { useModalContext as s } from "./Modal.js";

package/ContextAction.js

@@ -1,5 +1,5 @@
 import { jsx as n, jsxs as p } from "react/jsx-runtime";
-import { IconOpenInNew as s, IconCrop as a, IconMore as C } from "./index4.js";
+import { IconOpenInNew as s, IconCrop as a, IconMore as C } from "./index3.js";
 import { Card as t } from "./Card.js";
 import { Dropdown as o } from "./Dropdown2.js";
 import { useConfig as w } from "./ConfigContext.js";

package/ControlGroup.js

@@ -4,10 +4,10 @@ import m from "./styled-components.browser.esm.js";
 import { token as g } from "./token.js";
 import { Form as i } from "./Form.js";
 import { useId as l } from "./useId.js";
-function q({
-  children: c,
+function j({
+  children: a,
   label: r,
-  labelSecondaryText: a,
+  labelSecondaryText: c,
   isInvalid: n,
   helperText: t,
   helperTextIcon: p,
@@ -15,8 +15,8 @@ function q({
 }) {
   const e = l("control-group-label"), d = l("control-group-helper-text");
   return /* @__PURE__ */ u(i.Group, { "aria-labelledby": r ? e : void 0, "aria-describedby": t ? d : void 0, "aria-invalid": n, ...s, children: [
-    r && /* @__PURE__ */ o(i.Label, { id: e, secondaryText: a, children: r }),
-    /* @__PURE__ */ o(b, { children: h.Children.map(c, (f) => /* @__PURE__ */ o(y, { children: f })) }),
+    r && /* @__PURE__ */ o(i.Label, { id: e, secondaryText: c, children: r }),
+    /* @__PURE__ */ o(b, { children: h.Children.map(a, (f) => /* @__PURE__ */ o(y, { children: f })) }),
     t && /* @__PURE__ */ o(i.HelperText, { isInvalid: n, icon: p, id: d, children: t })
   ] });
 }
@@ -28,5 +28,5 @@ const b = m.ul.withConfig({
   componentId: "sc-166qdv5-1"
 })(["&:not(:last-child){margin-bottom:", ";}"], g.spacing2);
 export {
-  q as ControlGroup
+  j as ControlGroup
 };

package/Dat.js

@@ -1,17 +1,18 @@
-import { jsxs as C, jsx as n } from "react/jsx-runtime";
-import { useState as u, useEffect as U } from "react";
-import { createPortal as M } from "react-dom";
+import { jsxs as U, jsx as n } from "react/jsx-runtime";
+import { useState as u, useEffect as M } from "react";
+import { createPortal as P } from "react-dom";
 import v from "./styled-components.browser.esm.js";
 import { Button as c } from "./Button.js";
-import { Modal as P } from "./Modal2.js";
+import { Modal as j } from "./Modal2.js";
 import { token as y } from "./token.js";
-import { DATBuilder as S } from "./index8.js";
-import { useRootElement as j } from "./RootElementContext.js";
-import { useDat as E } from "./useDatStore.js";
-import { useAuth as I } from "./LoginContext.js";
-import { fixFontSpacesInUrl as F } from "./fixFontSpaceInUrl.js";
-function X() {
-  const l = j(), d = I(), [i, x] = u(), [a, m] = u(), {
+import { DATBuilder as E } from "./index8.js";
+import { useRootElement as I } from "./RootElementContext.js";
+import { useDat as F } from "./useDatStore.js";
+import { useSelectionStore as O } from "./useSelectionStore.js";
+import { useAuth as R } from "./LoginContext.js";
+import { fixFontSpacesInUrl as V } from "./fixFontSpaceInUrl.js";
+function oo() {
+  const l = I(), d = R(), [i, x] = u(), [s, m] = u(), {
     datUrl: k,
     assetName: g,
     datExtension: w,
@@ -19,28 +20,28 @@ function X() {
     closeDat: f,
     setTransformation: p,
     assetId: B
-  } = E();
-  U(() => {
+  } = F(), { clear: D, selectAssets: T } = O();
+  M(() => {
     const o = l.querySelector(".cv-root");
     o && x(o);
   }, [l]);
-  const s = (o, e) => {
+  const a = (o, e) => {
     if (o && t) {
-      const A = F(o);
-      p({ url: A, preset: e, asset: t.asset });
+      const S = V(o);
+      p({ url: S, preset: e, asset: t.asset }), D(), T([t.asset]);
     }
     f();
   }, h = (o, e) => {
-    b(e) && t ? m({ url: o, preset: e, asset: t.asset }) : s(o, e);
-  }, r = () => m(void 0), D = () => {
-    s(a?.url, a?.preset), r();
-  }, T = () => {
+    C(e) && t ? m({ url: o, preset: e, asset: t.asset }) : a(o, e);
+  }, r = () => m(void 0), b = () => {
+    a(s?.url, s?.preset), r();
+  }, A = () => {
     p(void 0), r(), f();
-  }, b = (o) => o.content.io.length > 0;
-  return i ? M(
-    /* @__PURE__ */ C(O, { children: [
+  }, C = (o) => o.content.io.length > 0;
+  return i ? P(
+    /* @__PURE__ */ U($, { children: [
       /* @__PURE__ */ n(
-        R,
+        q,
         {
           mediaInfo: {
             extension: [w],
@@ -54,7 +55,7 @@ function X() {
           canViewPresets: !1,
           canViewTransformations: !0,
           hideBottomBar: !0,
-          onApply: s,
+          onApply: a,
           onDone: h,
           onBack: h,
           initialTransformations: t?.preset?.content.io,
@@ -62,15 +63,15 @@ function X() {
         }
       ),
       /* @__PURE__ */ n(
-        P,
+        j,
         {
-          isOpen: !!a,
+          isOpen: !!s,
           title: "Transformations not yet applied",
           container: i,
           onClose: r,
-          actionPrimary: /* @__PURE__ */ n(c, { variant: "primary", onClick: D, children: "Apply transformations" }),
+          actionPrimary: /* @__PURE__ */ n(c, { variant: "primary", onClick: b, children: "Apply transformations" }),
           actionSecondary: /* @__PURE__ */ n(c, { variant: "secondary", onClick: r, children: "Cancel" }),
-          actionTertiary: /* @__PURE__ */ n(c, { variant: "secondary", onClick: T, children: "Discard changes" }),
+          actionTertiary: /* @__PURE__ */ n(c, { variant: "secondary", onClick: A, children: "Discard changes" }),
           children: "Transformations not yet applied. Do you want to apply transformations now, or discard changes?"
         }
       )
@@ -78,7 +79,7 @@ function X() {
     i
   ) : null;
 }
-const O = v.div`
+const $ = v.div`
 	background-color: ${y.white};
 	z-index: 999999;
 	overflow: hidden;
@@ -92,10 +93,10 @@ const O = v.div`
 	bottom: 0;
 	left: 0;
 	right: 0;
-`, R = v(S)`
+`, q = v(E)`
 	height: 100%;
 	width: 100%;
 `;
 export {
-  X as Dat
+  oo as Dat
 };

package/DatDropdownItem.js

@@ -1,7 +1,7 @@
 import { jsxs as u, Fragment as p, jsx as i } from "react/jsx-runtime";
 import { useState as d, useEffect as g } from "react";
 import b from "./styled-components.browser.esm.js";
-import { IconArrowRight as w, IconCrop as x } from "./index4.js";
+import { IconArrowRight as w, IconCrop as x } from "./index3.js";
 import { List as l } from "./List.js";
 import { Thumbnail as s } from "./Thumbnail.js";
 import { useDat as D } from "./useDatStore.js";

package/DesignSystemProvider.js

@@ -1,12 +1,12 @@
-import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import u, { useMemo as f } from "react";
+import { jsx as e, jsxs as u } from "react/jsx-runtime";
+import c, { useMemo as f } from "react";
 import { ThemeStyles as l } from "./theme.js";
 import { Button as a } from "./Button.js";
 import { LocalizationProvider as p } from "./localization.js";
-const t = 10001, v = u.createContext({
+const t = 10001, v = c.createContext({
   zIndexBase: t
 });
-function D({
+function y({
   children: n,
   noTheme: i,
   zIndexBase: r = t,
@@ -14,16 +14,16 @@ function D({
   dateFnsLocale: o,
   locale: s = "en-US"
 }) {
-  const c = f(() => ({
+  const d = f(() => ({
     zIndexBase: r,
     dateFnsLocale: o
   }), [o, r]);
-  return /* @__PURE__ */ e(v.Provider, { value: c, children: /* @__PURE__ */ e(p, { locale: s, children: /* @__PURE__ */ d(a.VersionProvider, { value: m, children: [
+  return /* @__PURE__ */ e(v.Provider, { value: d, children: /* @__PURE__ */ e(p, { locale: s, children: /* @__PURE__ */ u(a.VersionProvider, { value: m, children: [
     !i && /* @__PURE__ */ e(l, {}),
     n
   ] }) }) });
 }
 export {
   v as DesignSystemContext,
-  D as DesignSystemProvider
+  y as DesignSystemProvider
 };

package/DirectionSelect.js

@@ -1,12 +1,12 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
 import n from "./styled-components.browser.esm.js";
-import { IconSortOrder as m } from "./index4.js";
+import { IconSortOrder as m } from "./index3.js";
 import { Button as l } from "./Button.js";
-import { token as t } from "./token.js";
+import { token as e } from "./token.js";
 import { __ as r } from "./index2.js";
 import { useOrderingByPage as f } from "./useOrderingStore.js";
 import { useRouterSelectors as g } from "./useRouterStore.js";
-function k({ nlSearch: o = !1 }) {
+function k({ nlSearch: t = !1 }) {
   const c = g.use.page(), [i, s] = f(c.page), d = {
     ASC: r("Ascending"),
     DESC: r("Descending")
@@ -17,15 +17,16 @@ function k({ nlSearch: o = !1 }) {
   function a() {
     s({ field: i.field, direction: p[i.direction] });
   }
-  return /* @__PURE__ */ e(
+  return /* @__PURE__ */ o(
     S,
     {
       variant: "clean",
       isSmall: !0,
       title: d[i.direction],
       onClick: a,
-      icon: /* @__PURE__ */ e(u, { $isAscending: i.direction === "ASC" }),
-      isDisabled: o
+      icon: /* @__PURE__ */ o(u, { $isAscending: i.direction === "ASC" }),
+      isDisabled: t,
+      "data-testid": "order-direction-button"
     }
   );
 }
@@ -34,9 +35,9 @@ const S = n(l)`
 	border: 1px solid #d9dee1;
 	height: 42px;
 `, u = n(m)`
-	width: ${t.spacing6};
-	height: ${t.spacing6};
-	${(o) => o.$isAscending && "transform: scaleY(-1)"}
+	width: ${e.spacing6};
+	height: ${e.spacing6};
+	${(t) => t.$isAscending && "transform: scaleY(-1)"}
 `;
 export {
   k as DirectionSelect

package/DomainInput.js

@@ -1,35 +1,43 @@
 import { jsx as n } from "react/jsx-runtime";
-import r from "./styled-components.browser.esm.js";
+import t from "./styled-components.browser.esm.js";
 import { InputField as m } from "./InputField.js";
 import { token as h } from "./token.js";
-import { Spinner as c } from "./Spinner.js";
+import { Spinner as v } from "./Spinner.js";
 import { __ as e } from "./index2.js";
-function D({ status: i, isReadOnly: o, value: t, onChange: a, onSubmit: l }) {
-  function d(p) {
-    i === "valid" && p.keyCode === 13 && l();
+function D({ status: i, isReadOnly: o, value: r, onChange: a, onSubmit: d }) {
+  function l(p) {
+    i === "valid" && p.keyCode === 13 && d();
   }
-  return /* @__PURE__ */ n(g, { children: /* @__PURE__ */ n(
+  return /* @__PURE__ */ n(c, { children: /* @__PURE__ */ n(
     m,
     {
       type: "url",
-      value: t,
+      value: r,
       placeholder: "yourdomain.bynder.com",
       label: e("Enter the portal domain"),
       onChange: a,
-      onKeyDown: d,
+      onKeyDown: l,
       isInvalid: i === "invalid",
       helperText: i === "invalid" && e("This portal domain does not exist"),
       hasClearButton: i !== "validating" && !o,
-      iconRight: i === "validating" ? /* @__PURE__ */ n(v, { role: "alert", "aria-live": "polite", children: /* @__PURE__ */ n(c, { isRelative: !0, isNotUsingMargin: !0 }) }) : void 0,
+      iconRight: i === "validating" ? /* @__PURE__ */ n(
+        g,
+        {
+          role: "alert",
+          "aria-live": "polite",
+          "data-testid": "domain-validation-spinner",
+          children: /* @__PURE__ */ n(v, { isRelative: !0, isNotUsingMargin: !0 })
+        }
+      ) : void 0,
       isDisabled: o,
       "data-testid": "login-input"
     }
   ) });
 }
-const g = r.div`
+const c = t.div`
 	margin: ${h.spacing4} 0;
 	width: 320px;
-`, v = r.div`
+`, g = t.div`
 	height: 100%;
 	display: flex;
 	align-items: center;