@photoroom/ui 0.1.1 → 0.1.3

package/index511.mjs

@@ -1,262 +0,0 @@
-import { warning as b, invariant as S } from "./index489.mjs";
-import { createBox as P } from "./index512.mjs";
-import { isRefObject as T } from "./index513.mjs";
-import { initPrefersReducedMotion as y } from "./index514.mjs";
-import { hasReducedMotionListener as F, prefersReducedMotion as R } from "./index515.mjs";
-import { SubscriptionManager as j } from "./index516.mjs";
-import { motionValue as w } from "./index517.mjs";
-import { isWillChangeMotionValue as N } from "./index518.mjs";
-import { isMotionValue as c } from "./index492.mjs";
-import { transformProps as E } from "./index519.mjs";
-import { isControllingVariants as x, isVariantNode as B } from "./index520.mjs";
-import { isVariantLabel as L } from "./index521.mjs";
-import { updateMotionValuesFromProps as I } from "./index522.mjs";
-import { resolveVariantFromProps as O } from "./index523.mjs";
-import { warnOnce as A } from "./index524.mjs";
-import { featureDefinitions as g } from "./index525.mjs";
-import { variantProps as M } from "./index526.mjs";
-import { visualElementStore as f } from "./index527.mjs";
-import { frame as m, cancelFrame as V } from "./index528.mjs";
-const C = Object.keys(g), U = C.length, v = [
-  "AnimationStart",
-  "AnimationComplete",
-  "Update",
-  "BeforeLayoutMeasure",
-  "LayoutMeasure",
-  "LayoutAnimationStart",
-  "LayoutAnimationComplete"
-], _ = M.length;
-class ot {
-  constructor({ parent: t, props: e, presenceContext: i, reducedMotionConfig: s, visualState: r }, u = {}) {
-    this.current = null, this.children = /* @__PURE__ */ new Set(), this.isVariantNode = !1, this.isControllingVariants = !1, this.shouldReduceMotion = null, this.values = /* @__PURE__ */ new Map(), this.features = {}, this.valueSubscriptions = /* @__PURE__ */ new Map(), this.prevMotionValues = {}, this.events = {}, this.propEventSubscriptions = {}, this.notifyUpdate = () => this.notify("Update", this.latestValues), this.render = () => {
-      this.current && (this.triggerBuild(), this.renderInstance(this.current, this.renderState, this.props.style, this.projection));
-    }, this.scheduleRender = () => m.render(this.render, !1, !0);
-    const { latestValues: h, renderState: n } = r;
-    this.latestValues = h, this.baseTarget = { ...h }, this.initialValues = e.initial ? { ...h } : {}, this.renderState = n, this.parent = t, this.props = e, this.presenceContext = i, this.depth = t ? t.depth + 1 : 0, this.reducedMotionConfig = s, this.options = u, this.isControllingVariants = x(e), this.isVariantNode = B(e), this.isVariantNode && (this.variantChildren = /* @__PURE__ */ new Set()), this.manuallyAnimateOnMount = !!(t && t.current);
-    const { willChange: o, ...p } = this.scrapeMotionValuesFromProps(e, {});
-    for (const a in p) {
-      const l = p[a];
-      h[a] !== void 0 && c(l) && (l.set(h[a], !1), N(o) && o.add(a));
-    }
-  }
-  /**
-   * This method takes React props and returns found MotionValues. For example, HTML
-   * MotionValues will be found within the style prop, whereas for Three.js within attribute arrays.
-   *
-   * This isn't an abstract method as it needs calling in the constructor, but it is
-   * intended to be one.
-   */
-  scrapeMotionValuesFromProps(t, e) {
-    return {};
-  }
-  mount(t) {
-    this.current = t, f.set(t, this), this.projection && !this.projection.instance && this.projection.mount(t), this.parent && this.isVariantNode && !this.isControllingVariants && (this.removeFromVariantTree = this.parent.addVariantChild(this)), this.values.forEach((e, i) => this.bindToMotionValue(i, e)), F.current || y(), this.shouldReduceMotion = this.reducedMotionConfig === "never" ? !1 : this.reducedMotionConfig === "always" ? !0 : R.current, process.env.NODE_ENV !== "production" && A(this.shouldReduceMotion !== !0, "You have Reduced Motion enabled on your device. Animations may not appear as expected."), this.parent && this.parent.children.add(this), this.update(this.props, this.presenceContext);
-  }
-  unmount() {
-    f.delete(this.current), this.projection && this.projection.unmount(), V(this.notifyUpdate), V(this.render), this.valueSubscriptions.forEach((t) => t()), this.removeFromVariantTree && this.removeFromVariantTree(), this.parent && this.parent.children.delete(this);
-    for (const t in this.events)
-      this.events[t].clear();
-    for (const t in this.features)
-      this.features[t].unmount();
-    this.current = null;
-  }
-  bindToMotionValue(t, e) {
-    const i = E.has(t), s = e.on("change", (u) => {
-      this.latestValues[t] = u, this.props.onUpdate && m.update(this.notifyUpdate, !1, !0), i && this.projection && (this.projection.isTransformDirty = !0);
-    }), r = e.on("renderRequest", this.scheduleRender);
-    this.valueSubscriptions.set(t, () => {
-      s(), r();
-    });
-  }
-  sortNodePosition(t) {
-    return !this.current || !this.sortInstanceNodePosition || this.type !== t.type ? 0 : this.sortInstanceNodePosition(this.current, t.current);
-  }
-  loadFeatures({ children: t, ...e }, i, s, r) {
-    let u, h;
-    if (process.env.NODE_ENV !== "production" && s && i) {
-      const n = "You have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead.";
-      e.ignoreStrict ? b(!1, n) : S(!1, n);
-    }
-    for (let n = 0; n < U; n++) {
-      const o = C[n], { isEnabled: p, Feature: a, ProjectionNode: l, MeasureLayout: d } = g[o];
-      l && (u = l), p(e) && (!this.features[o] && a && (this.features[o] = new a(this)), d && (h = d));
-    }
-    if ((this.type === "html" || this.type === "svg") && !this.projection && u) {
-      this.projection = new u(this.latestValues, this.parent && this.parent.projection);
-      const { layoutId: n, layout: o, drag: p, dragConstraints: a, layoutScroll: l, layoutRoot: d } = e;
-      this.projection.setOptions({
-        layoutId: n,
-        layout: o,
-        alwaysMeasureLayout: !!p || a && T(a),
-        visualElement: this,
-        scheduleRender: () => this.scheduleRender(),
-        /**
-         * TODO: Update options in an effect. This could be tricky as it'll be too late
-         * to update by the time layout animations run.
-         * We also need to fix this safeToRemove by linking it up to the one returned by usePresence,
-         * ensuring it gets called if there's no potential layout animations.
-         *
-         */
-        animationType: typeof o == "string" ? o : "both",
-        initialPromotionConfig: r,
-        layoutScroll: l,
-        layoutRoot: d
-      });
-    }
-    return h;
-  }
-  updateFeatures() {
-    for (const t in this.features) {
-      const e = this.features[t];
-      e.isMounted ? e.update() : (e.mount(), e.isMounted = !0);
-    }
-  }
-  triggerBuild() {
-    this.build(this.renderState, this.latestValues, this.options, this.props);
-  }
-  /**
-   * Measure the current viewport box with or without transforms.
-   * Only measures axis-aligned boxes, rotate and skew must be manually
-   * removed with a re-render to work.
-   */
-  measureViewportBox() {
-    return this.current ? this.measureInstanceViewportBox(this.current, this.props) : P();
-  }
-  getStaticValue(t) {
-    return this.latestValues[t];
-  }
-  setStaticValue(t, e) {
-    this.latestValues[t] = e;
-  }
-  /**
-   * Make a target animatable by Popmotion. For instance, if we're
-   * trying to animate width from 100px to 100vw we need to measure 100vw
-   * in pixels to determine what we really need to animate to. This is also
-   * pluggable to support Framer's custom value types like Color,
-   * and CSS variables.
-   */
-  makeTargetAnimatable(t, e = !0) {
-    return this.makeTargetAnimatableFromInstance(t, this.props, e);
-  }
-  /**
-   * Update the provided props. Ensure any newly-added motion values are
-   * added to our map, old ones removed, and listeners updated.
-   */
-  update(t, e) {
-    (t.transformTemplate || this.props.transformTemplate) && this.scheduleRender(), this.prevProps = this.props, this.props = t, this.prevPresenceContext = this.presenceContext, this.presenceContext = e;
-    for (let i = 0; i < v.length; i++) {
-      const s = v[i];
-      this.propEventSubscriptions[s] && (this.propEventSubscriptions[s](), delete this.propEventSubscriptions[s]);
-      const r = t["on" + s];
-      r && (this.propEventSubscriptions[s] = this.on(s, r));
-    }
-    this.prevMotionValues = I(this, this.scrapeMotionValuesFromProps(t, this.prevProps), this.prevMotionValues), this.handleChildMotionValue && this.handleChildMotionValue();
-  }
-  getProps() {
-    return this.props;
-  }
-  /**
-   * Returns the variant definition with a given name.
-   */
-  getVariant(t) {
-    return this.props.variants ? this.props.variants[t] : void 0;
-  }
-  /**
-   * Returns the defined default transition on this component.
-   */
-  getDefaultTransition() {
-    return this.props.transition;
-  }
-  getTransformPagePoint() {
-    return this.props.transformPagePoint;
-  }
-  getClosestVariantNode() {
-    return this.isVariantNode ? this : this.parent ? this.parent.getClosestVariantNode() : void 0;
-  }
-  getVariantContext(t = !1) {
-    if (t)
-      return this.parent ? this.parent.getVariantContext() : void 0;
-    if (!this.isControllingVariants) {
-      const i = this.parent ? this.parent.getVariantContext() || {} : {};
-      return this.props.initial !== void 0 && (i.initial = this.props.initial), i;
-    }
-    const e = {};
-    for (let i = 0; i < _; i++) {
-      const s = M[i], r = this.props[s];
-      (L(r) || r === !1) && (e[s] = r);
-    }
-    return e;
-  }
-  /**
-   * Add a child visual element to our set of children.
-   */
-  addVariantChild(t) {
-    const e = this.getClosestVariantNode();
-    if (e)
-      return e.variantChildren && e.variantChildren.add(t), () => e.variantChildren.delete(t);
-  }
-  /**
-   * Add a motion value and bind it to this visual element.
-   */
-  addValue(t, e) {
-    e !== this.values.get(t) && (this.removeValue(t), this.bindToMotionValue(t, e)), this.values.set(t, e), this.latestValues[t] = e.get();
-  }
-  /**
-   * Remove a motion value and unbind any active subscriptions.
-   */
-  removeValue(t) {
-    this.values.delete(t);
-    const e = this.valueSubscriptions.get(t);
-    e && (e(), this.valueSubscriptions.delete(t)), delete this.latestValues[t], this.removeValueFromRenderState(t, this.renderState);
-  }
-  /**
-   * Check whether we have a motion value for this key
-   */
-  hasValue(t) {
-    return this.values.has(t);
-  }
-  getValue(t, e) {
-    if (this.props.values && this.props.values[t])
-      return this.props.values[t];
-    let i = this.values.get(t);
-    return i === void 0 && e !== void 0 && (i = w(e, { owner: this }), this.addValue(t, i)), i;
-  }
-  /**
-   * If we're trying to animate to a previously unencountered value,
-   * we need to check for it in our state and as a last resort read it
-   * directly from the instance (which might have performance implications).
-   */
-  readValue(t) {
-    var e;
-    return this.latestValues[t] !== void 0 || !this.current ? this.latestValues[t] : (e = this.getBaseTargetFromProps(this.props, t)) !== null && e !== void 0 ? e : this.readValueFromInstance(this.current, t, this.options);
-  }
-  /**
-   * Set the base target to later animate back to. This is currently
-   * only hydrated on creation and when we first read a value.
-   */
-  setBaseTarget(t, e) {
-    this.baseTarget[t] = e;
-  }
-  /**
-   * Find the base target for a value thats been removed from all animation
-   * props.
-   */
-  getBaseTarget(t) {
-    var e;
-    const { initial: i } = this.props, s = typeof i == "string" || typeof i == "object" ? (e = O(this.props, i)) === null || e === void 0 ? void 0 : e[t] : void 0;
-    if (i && s !== void 0)
-      return s;
-    const r = this.getBaseTargetFromProps(this.props, t);
-    return r !== void 0 && !c(r) ? r : this.initialValues[t] !== void 0 && s === void 0 ? void 0 : this.baseTarget[t];
-  }
-  on(t, e) {
-    return this.events[t] || (this.events[t] = new j()), this.events[t].add(e);
-  }
-  notify(t, ...e) {
-    this.events[t] && this.events[t].notify(...e);
-  }
-}
-export {
-  ot as VisualElement
-};
-//# sourceMappingURL=index511.mjs.map

package/index512.mjs

@@ -1,19 +0,0 @@
-const t = () => ({
-  translate: 0,
-  scale: 1,
-  origin: 0,
-  originPoint: 0
-}), a = () => ({
-  x: t(),
-  y: t()
-}), e = () => ({ min: 0, max: 0 }), c = () => ({
-  x: e(),
-  y: e()
-});
-export {
-  e as createAxis,
-  t as createAxisDelta,
-  c as createBox,
-  a as createDelta
-};
-//# sourceMappingURL=index512.mjs.map

package/index513.mjs

@@ -1,7 +0,0 @@
-function e(t) {
-  return t && typeof t == "object" && Object.prototype.hasOwnProperty.call(t, "current");
-}
-export {
-  e as isRefObject
-};
-//# sourceMappingURL=index513.mjs.map

package/index514.mjs

@@ -1,14 +0,0 @@
-import { isBrowser as o } from "./index507.mjs";
-import { hasReducedMotionListener as i, prefersReducedMotion as t } from "./index515.mjs";
-function c() {
-  if (i.current = !0, !!o)
-    if (window.matchMedia) {
-      const e = window.matchMedia("(prefers-reduced-motion)"), r = () => t.current = e.matches;
-      e.addListener(r), r();
-    } else
-      t.current = !1;
-}
-export {
-  c as initPrefersReducedMotion
-};
-//# sourceMappingURL=index514.mjs.map

package/index515.mjs

@@ -1,6 +0,0 @@
-const e = { current: null }, n = { current: !1 };
-export {
-  n as hasReducedMotionListener,
-  e as prefersReducedMotion
-};
-//# sourceMappingURL=index515.mjs.map

package/index516.mjs

@@ -1,30 +0,0 @@
-import { addUniqueItem as e, removeItem as u } from "./index556.mjs";
-class h {
-  constructor() {
-    this.subscriptions = [];
-  }
-  add(s) {
-    return e(this.subscriptions, s), () => u(this.subscriptions, s);
-  }
-  notify(s, r, n) {
-    const i = this.subscriptions.length;
-    if (i)
-      if (i === 1)
-        this.subscriptions[0](s, r, n);
-      else
-        for (let t = 0; t < i; t++) {
-          const o = this.subscriptions[t];
-          o && o(s, r, n);
-        }
-  }
-  getSize() {
-    return this.subscriptions.length;
-  }
-  clear() {
-    this.subscriptions.length = 0;
-  }
-}
-export {
-  h as SubscriptionManager
-};
-//# sourceMappingURL=index516.mjs.map

package/index517.mjs

@@ -1,203 +0,0 @@
-import { SubscriptionManager as o } from "./index516.mjs";
-import { velocityPerSecond as c } from "./index558.mjs";
-import { warnOnce as f } from "./index524.mjs";
-import { frameData as l, frame as n } from "./index528.mjs";
-const p = (s) => !isNaN(parseFloat(s));
-class v {
-  /**
-   * @param init - The initiating value
-   * @param config - Optional configuration options
-   *
-   * -  `transformer`: A function to transform incoming values with.
-   *
-   * @internal
-   */
-  constructor(t, e = {}) {
-    this.version = "10.18.0", this.timeDelta = 0, this.lastUpdated = 0, this.canTrackVelocity = !1, this.events = {}, this.updateAndNotify = (i, h = !0) => {
-      this.prev = this.current, this.current = i;
-      const { delta: r, timestamp: a } = l;
-      this.lastUpdated !== a && (this.timeDelta = r, this.lastUpdated = a, n.postRender(this.scheduleVelocityCheck)), this.prev !== this.current && this.events.change && this.events.change.notify(this.current), this.events.velocityChange && this.events.velocityChange.notify(this.getVelocity()), h && this.events.renderRequest && this.events.renderRequest.notify(this.current);
-    }, this.scheduleVelocityCheck = () => n.postRender(this.velocityCheck), this.velocityCheck = ({ timestamp: i }) => {
-      i !== this.lastUpdated && (this.prev = this.current, this.events.velocityChange && this.events.velocityChange.notify(this.getVelocity()));
-    }, this.hasAnimated = !1, this.prev = this.current = t, this.canTrackVelocity = p(this.current), this.owner = e.owner;
-  }
-  /**
-   * Adds a function that will be notified when the `MotionValue` is updated.
-   *
-   * It returns a function that, when called, will cancel the subscription.
-   *
-   * When calling `onChange` inside a React component, it should be wrapped with the
-   * `useEffect` hook. As it returns an unsubscribe function, this should be returned
-   * from the `useEffect` function to ensure you don't add duplicate subscribers..
-   *
-   * ```jsx
-   * export const MyComponent = () => {
-   *   const x = useMotionValue(0)
-   *   const y = useMotionValue(0)
-   *   const opacity = useMotionValue(1)
-   *
-   *   useEffect(() => {
-   *     function updateOpacity() {
-   *       const maxXY = Math.max(x.get(), y.get())
-   *       const newOpacity = transform(maxXY, [0, 100], [1, 0])
-   *       opacity.set(newOpacity)
-   *     }
-   *
-   *     const unsubscribeX = x.on("change", updateOpacity)
-   *     const unsubscribeY = y.on("change", updateOpacity)
-   *
-   *     return () => {
-   *       unsubscribeX()
-   *       unsubscribeY()
-   *     }
-   *   }, [])
-   *
-   *   return <motion.div style={{ x }} />
-   * }
-   * ```
-   *
-   * @param subscriber - A function that receives the latest value.
-   * @returns A function that, when called, will cancel this subscription.
-   *
-   * @deprecated
-   */
-  onChange(t) {
-    return process.env.NODE_ENV !== "production" && f(!1, 'value.onChange(callback) is deprecated. Switch to value.on("change", callback).'), this.on("change", t);
-  }
-  on(t, e) {
-    this.events[t] || (this.events[t] = new o());
-    const i = this.events[t].add(e);
-    return t === "change" ? () => {
-      i(), n.read(() => {
-        this.events.change.getSize() || this.stop();
-      });
-    } : i;
-  }
-  clearListeners() {
-    for (const t in this.events)
-      this.events[t].clear();
-  }
-  /**
-   * Attaches a passive effect to the `MotionValue`.
-   *
-   * @internal
-   */
-  attach(t, e) {
-    this.passiveEffect = t, this.stopPassiveEffect = e;
-  }
-  /**
-   * Sets the state of the `MotionValue`.
-   *
-   * @remarks
-   *
-   * ```jsx
-   * const x = useMotionValue(0)
-   * x.set(10)
-   * ```
-   *
-   * @param latest - Latest value to set.
-   * @param render - Whether to notify render subscribers. Defaults to `true`
-   *
-   * @public
-   */
-  set(t, e = !0) {
-    !e || !this.passiveEffect ? this.updateAndNotify(t, e) : this.passiveEffect(t, this.updateAndNotify);
-  }
-  setWithVelocity(t, e, i) {
-    this.set(e), this.prev = t, this.timeDelta = i;
-  }
-  /**
-   * Set the state of the `MotionValue`, stopping any active animations,
-   * effects, and resets velocity to `0`.
-   */
-  jump(t) {
-    this.updateAndNotify(t), this.prev = t, this.stop(), this.stopPassiveEffect && this.stopPassiveEffect();
-  }
-  /**
-   * Returns the latest state of `MotionValue`
-   *
-   * @returns - The latest state of `MotionValue`
-   *
-   * @public
-   */
-  get() {
-    return this.current;
-  }
-  /**
-   * @public
-   */
-  getPrevious() {
-    return this.prev;
-  }
-  /**
-   * Returns the latest velocity of `MotionValue`
-   *
-   * @returns - The latest velocity of `MotionValue`. Returns `0` if the state is non-numerical.
-   *
-   * @public
-   */
-  getVelocity() {
-    return this.canTrackVelocity ? (
-      // These casts could be avoided if parseFloat would be typed better
-      c(parseFloat(this.current) - parseFloat(this.prev), this.timeDelta)
-    ) : 0;
-  }
-  /**
-   * Registers a new animation to control this `MotionValue`. Only one
-   * animation can drive a `MotionValue` at one time.
-   *
-   * ```jsx
-   * value.start()
-   * ```
-   *
-   * @param animation - A function that starts the provided animation
-   *
-   * @internal
-   */
-  start(t) {
-    return this.stop(), new Promise((e) => {
-      this.hasAnimated = !0, this.animation = t(e), this.events.animationStart && this.events.animationStart.notify();
-    }).then(() => {
-      this.events.animationComplete && this.events.animationComplete.notify(), this.clearAnimation();
-    });
-  }
-  /**
-   * Stop the currently active animation.
-   *
-   * @public
-   */
-  stop() {
-    this.animation && (this.animation.stop(), this.events.animationCancel && this.events.animationCancel.notify()), this.clearAnimation();
-  }
-  /**
-   * Returns `true` if this value is currently animating.
-   *
-   * @public
-   */
-  isAnimating() {
-    return !!this.animation;
-  }
-  clearAnimation() {
-    delete this.animation;
-  }
-  /**
-   * Destroy and clean up subscribers to this `MotionValue`.
-   *
-   * The `MotionValue` hooks like `useMotionValue` and `useTransform` automatically
-   * handle the lifecycle of the returned `MotionValue`, so this method is only necessary if you've manually
-   * created a `MotionValue` via the `motionValue` function.
-   *
-   * @public
-   */
-  destroy() {
-    this.clearListeners(), this.stop(), this.stopPassiveEffect && this.stopPassiveEffect();
-  }
-}
-function g(s, t) {
-  return new v(s, t);
-}
-export {
-  v as MotionValue,
-  g as motionValue
-};
-//# sourceMappingURL=index517.mjs.map

package/index518.mjs

@@ -1,8 +0,0 @@
-import { isMotionValue as i } from "./index492.mjs";
-function t(o) {
-  return !!(i(o) && o.add);
-}
-export {
-  t as isWillChangeMotionValue
-};
-//# sourceMappingURL=index518.mjs.map

package/index519.mjs

@@ -1,24 +0,0 @@
-const t = [
-  "transformPerspective",
-  "x",
-  "y",
-  "z",
-  "translateX",
-  "translateY",
-  "translateZ",
-  "scale",
-  "scaleX",
-  "scaleY",
-  "rotate",
-  "rotateX",
-  "rotateY",
-  "rotateZ",
-  "skew",
-  "skewX",
-  "skewY"
-], e = new Set(t);
-export {
-  t as transformPropOrder,
-  e as transformProps
-};
-//# sourceMappingURL=index519.mjs.map

package/index52.mjs

@@ -1,98 +0,0 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { ActivityIcon as h } from "@photoroom/icons/lib/monochromes";
-import { clsx as o } from "./index296.mjs";
-import { forwardRef as y } from "react";
-import { OverlaySelectButton as b } from "./index26.mjs";
-const v = y(
-  ({
-    name: r,
-    variant: a,
-    fontFamily: i,
-    canShowSelect: s = !1,
-    isSelected: t = !1,
-    isLoading: c = !1,
-    badge: l,
-    onSelect: f,
-    className: p,
-    children: u,
-    ...m
-  }, d) => /* @__PURE__ */ n(
-    "div",
-    {
-      className: o(
-        "group relative block appearance-none outline-none",
-        "h-full w-full",
-        "transition-all interaction-transition-type-1",
-        "overflow-hidden rounded-400 bg-background-subdued",
-        "focus-visible:ring-misc-focus-indicator focus-visible:misc-border-size-focus-ring",
-        "after:pointer-events-none after:absolute after:inset-0 after:rounded-[inherit] after:content-['']",
-        "after:border",
-        "after:transition-colors after:interaction-transition-type-1",
-        {
-          "after:border-content-accent after:misc-border-size-selection after:misc-shadow-selection": t
-        },
-        {
-          "after:border-misc-border": !t
-        },
-        p
-      ),
-      children: [
-        /* @__PURE__ */ n(
-          "div",
-          {
-            ref: d,
-            ...m,
-            className: "flex aspect-square h-full w-full select-none flex-col items-center justify-center bg-surface-high py-3",
-            children: [
-              /* @__PURE__ */ e("div", { className: "flex w-full flex-1 items-center justify-center px-3 text-center", children: /* @__PURE__ */ e(
-                "span",
-                {
-                  className: "component-700 line-clamp-2 max-w-full text-content-primary",
-                  style: i ? { fontFamily: i } : {},
-                  children: r
-                }
-              ) }),
-              /* @__PURE__ */ n("div", { className: "flex items-center justify-center gap-2", children: [
-                /* @__PURE__ */ e("span", { className: "component-500 text-content-secondary", children: a }),
-                l
-              ] })
-            ]
-          }
-        ),
-        c && /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-black-alpha-2", children: /* @__PURE__ */ e(h, { className: "text-white icon-size-800" }) }),
-        s && /* @__PURE__ */ e(
-          b,
-          {
-            isSelected: t,
-            onClick: f,
-            className: o(
-              "appearance-none outline-none",
-              "absolute left-2 top-2",
-              "transition-opacity",
-              {
-                "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100": !t
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ e(
-          "div",
-          {
-            className: o(
-              "absolute inset-0 h-full w-full",
-              "pointer-events-none *:pointer-events-auto",
-              "transition-opacity",
-              "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100"
-            ),
-            children: u
-          }
-        )
-      ]
-    }
-  )
-);
-v.displayName = "FontTile";
-export {
-  v as FontTile
-};
-//# sourceMappingURL=index52.mjs.map