import { Button3 } from './Button3.jsx';

// figma node: 8165:5800 Arrows (1 variants)
const __venc = (v) => String(v).replace(/[%|=]/g, encodeURIComponent);
const __vkey = (p) => "type=" + __venc(p.type);

export function Arrows2(_p = {}) {
  const props = { ..._p, type: _p.type ?? "default" };
  const __body0 = () => (
    <div className={props.className} style={{
      width: "fit-content",
      display: "flex",
      flexDirection: "row",
      gap: "calc(var(--spacing-12-7) * 1px)",
      alignItems: "flex-start",
      flexWrap: "nowrap",
      position: "relative",
      ...props.style,
    }}>
      <div style={{
        position: "relative",
        borderRadius: 24,
        backgroundColor: "rgba(25,24,24,0)",
        backdropFilter: "blur(40px)",
        boxShadow: "inset 0 0 0 1px rgba(25,24,24,0.16), inset 0px 1px 0px 0px rgba(247,247,242,0.16), inset 0px -1px 0px 0px rgba(247,247,242,0.08)",
        display: "flex",
        flexDirection: "row",
        gap: "calc(var(--spacing-8-7) * 1px)",
        padding: "12px 16px 12px 16px",
        justifyContent: "center",
        alignItems: "center",
        flexWrap: "nowrap",
        boxSizing: "border-box",
        paddingLeft: "calc(var(--spacing-16-7) * 1px)",
        paddingTop: "calc(var(--spacing-12-7) * 1px)",
        paddingRight: "calc(var(--spacing-16-7) * 1px)",
        paddingBottom: "calc(var(--spacing-12-7) * 1px)",
        flexShrink: 0,
        alignSelf: "stretch",
      }}>
        <div style={{
          position: "relative",
          width: "calc(var(--icon-size-large) * 1px)",
          overflow: "hidden",
          flexShrink: 0,
          alignSelf: "stretch",
        }}>
          <svg width={14} height={14} viewBox="0 0 14 14" fill="none" style={{
            position: "absolute",
            left: 5,
            top: 5,
            width: 14,
            height: 14,
            borderWidth: "calc(var(--icon-stroke-6) * 1px)",
            color: "var(--icon-strong-2)",
          }}>
            <path d={"M 6.646 14.354 C 6.842 14.549 7.158 14.549 7.354 14.354 C 7.549 14.158 7.549 13.842 7.354 13.646 L 7 14 L 6.646 14.354 Z M 0 7 L -0.354 6.646 C -0.549 6.842 -0.549 7.158 -0.354 7.354 L 0 7 Z M 7.354 0.354 C 7.549 0.158 7.549 -0.158 7.354 -0.354 C 7.158 -0.549 6.842 -0.549 6.646 -0.354 L 7 0 L 7.354 0.354 Z M 14 7.5 C 14.276 7.5 14.5 7.276 14.5 7 C 14.5 6.724 14.276 6.5 14 6.5 L 14 7 L 14 7.5 Z M 7 14 L 7.354 13.646 L 0.354 6.646 L 0 7 L -0.354 7.354 L 6.646 14.354 L 7 14 Z M 0 7 L 0.354 7.354 L 7.354 0.354 L 7 0 L 6.646 -0.354 L -0.354 6.646 L 0 7 Z M 14 7 L 14 6.5 L 0 6.5 L 0 7 L 0 7.5 L 14 7.5 L 14 7 Z"} fill="currentColor" fillRule="nonzero" />
          </svg>
        </div>
      </div>
      <div style={{
          position: "relative",
          flexShrink: 0,
          alignSelf: "stretch",
          height: "auto",
        }}>{props.icon2 ?? <Button3 shape={"circle"} state={"default"} type={"secondary"} icon={"no icon"} size={"lg"} />}</div>
    </div>
  );
  const __impls = {
    // figma: Type=Default
    "type=default": __body0,
  };
  return (__impls[__vkey(props)] ?? __body0)();
}
export default Arrows2;
