@redocly/asyncapi-docs/lib/components/DownloadSpecification.js

Async API docs for Redocly Realm

import{Fragment as c,jsx as o,jsxs as i}from"react/jsx-runtime";import{memo as m,useCallback as p}from"react";import r from"styled-components";import{useDownloadInfo as f}from"@redocly/openapi-docs";import{useAtomValue as w}from"jotai";import{transformStringToTelemetryId as g}from"@redocly/openapi-docs/lib/utils/helpers.js";import{DocumentIcon as x}from"@redocly/theme/icons/DocumentIcon/DocumentIcon";import{JsonIcon as b}from"@redocly/theme/icons/JsonIcon/JsonIcon";import{FileIcon as u}from"@redocly/theme/icons/FileIcon/FileIcon";import{DownloadButton as h}from"@redocly/theme/components/Buttons/DownloadButton";import{downloadUrlsAtom as y}from"../jotai-store/app.js";import{useTelemetry as v}from"../hooks/index.js";function j(){const a=v(),s=w(y),t=f({downloadUrls:s}),l=p(e=>{switch(e){case"yaml":return o(x,{});case"json":return o(b,{});default:return o(u,{})}},[]);return t?o(I,{children:(t||[]).map(({title:e,url:n,iconType:d})=>i(k,{onClick:()=>{a.sendDownloadDefinitionClickedMessage([{id:g("definition",window.location.hostname,e),object:"definition",uri:new URL(n,window.location.origin).href}])},children:[i(D,{children:[l(d),o("a",{href:n,target:"_blank",download:!0,rel:"noreferrer",children:e})]}),o(h,{data:n})]},e))}):o(c,{})}const N=m(j),k=r.div`
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  width: 100%;

  border-bottom: 1px solid var(--border-color-secondary);
  padding-bottom: var(--spacing-sm);
  &:last-of-type {
    padding-bottom: 0px;
    border-bottom: none;
  }
`,D=r.span`
  display: flex;
  width: calc(100% - 25px);
  gap: var(--spacing-xs);
  align-items: center;

  svg {
    flex-shrink: 0;
  }
  a {
    width: 100%;
    color: var(--text-color-primary);
    word-break: break-word;
    text-decoration: none;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
`,I=r.div`
  display: flex;
  align-items: center;
  align-self: flex-start;
  justify-content: space-between;
  flex-direction: column;
  gap: var(--spacing-sm);
  font-size: var(--font-size-base);
`;export{N as DownloadSpecification};