@jpmorganchase/elemental 1.0.0 → 3.0.1

package/src/hooks/useExportDocumentProps.tsx

@@ -1,48 +0,0 @@
-import { safeStringify } from '@stoplight/yaml';
-import saver from 'file-saver';
-import * as React from 'react';
-
-import { isJson } from '../utils/oas';
-
-export function useExportDocumentProps({
-  originalDocument,
-  bundledDocument,
-}: {
-  originalDocument: string | object;
-  bundledDocument: unknown;
-}) {
-  const isJsonDocument = typeof originalDocument === 'object' || (!!originalDocument && isJson(originalDocument));
-
-  const exportDocument = React.useCallback(
-    (document: string) => {
-      const type = isJsonDocument ? 'json' : 'yaml';
-      const blob = new Blob([document], {
-        type: `application/${type}`,
-      });
-      saver.saveAs(blob, `document.${type}`);
-    },
-    [isJsonDocument],
-  );
-
-  const exportOriginalDocument = React.useCallback(() => {
-    const stringifiedDocument =
-      typeof originalDocument === 'object' ? JSON.stringify(originalDocument, null, 2) : originalDocument || '';
-    exportDocument(stringifiedDocument);
-  }, [originalDocument, exportDocument]);
-
-  const exportBundledDocument = React.useCallback(() => {
-    const stringifiedDocument = isJsonDocument
-      ? JSON.stringify(bundledDocument, null, 2)
-      : safeStringify(bundledDocument);
-    exportDocument(stringifiedDocument);
-  }, [bundledDocument, isJsonDocument, exportDocument]);
-
-  return {
-    original: {
-      onPress: exportOriginalDocument,
-    },
-    bundled: {
-      onPress: exportBundledDocument,
-    },
-  };
-}

package/src/styles.css

@@ -1 +0,0 @@
-@import "../../elements-core/src/styles.css";

package/src/utils/oas/__tests__/oas.spec.ts

@@ -1,272 +0,0 @@
-import { transformOasToServiceNode } from '../';
-
-const oas3Document = {
-  'x-stoplight': { id: 'abc' },
-  openapi: '3.0.0',
-  info: {
-    title: 'oas3',
-    version: '1.0.0',
-  },
-  tags: [{ name: 'operation-tag' }, { name: 'model-tag' }],
-  paths: {
-    '/todos': {
-      get: {
-        summary: 'Get Todos',
-        tags: ['operation-tag'],
-      },
-    },
-  },
-  components: {
-    schemas: {
-      Todo: {
-        type: 'object',
-        properties: {
-          id: {
-            type: 'integer',
-          },
-        },
-        title: 'Todo',
-        'x-tags': ['model-tag'],
-      },
-    },
-  },
-};
-
-const oas2Document = {
-  'x-stoplight': { id: 'abc' },
-  swagger: '2.0.0',
-  info: {
-    title: 'oas2',
-    version: '1.0.0',
-  },
-  tags: [{ name: 'operation-tag' }, { name: 'model-tag' }],
-  paths: {
-    '/todos': {
-      get: {
-        summary: 'Get Todos',
-        tags: ['operation-tag'],
-      },
-    },
-  },
-  definitions: {
-    Todo: {
-      type: 'object',
-      properties: {
-        id: {
-          type: 'integer',
-        },
-      },
-      title: 'Todo',
-      'x-tags': ['model-tag'],
-    },
-  },
-};
-
-describe('computeOasNodes', () => {
-  it('should return null for invalid document', () => {
-    expect(transformOasToServiceNode({})).toBeNull();
-  });
-
-  it('should return oas nodes for oas3 document', () => {
-    expect(transformOasToServiceNode(oas3Document)).toStrictEqual({
-      type: 'http_service',
-      uri: '/',
-      name: 'oas3',
-      data: {
-        id: 'abc',
-        version: '1.0.0',
-        name: 'oas3',
-        tags: [
-          {
-            id: 'd3404a8f3b495',
-            name: 'operation-tag',
-          },
-          {
-            id: 'd0460398c5f2b',
-            name: 'model-tag',
-          },
-        ],
-      },
-      tags: ['operation-tag', 'model-tag'],
-      children: [
-        {
-          type: 'http_operation',
-          uri: '/paths/todos/get',
-          data: {
-            id: 'c35bc6b301d97',
-            method: 'get',
-            path: '/todos',
-            summary: 'Get Todos',
-            responses: [],
-            servers: [],
-            request: {
-              body: {
-                id: '704ac0beb3748',
-                contents: [],
-              },
-              headers: [],
-              query: [],
-              cookie: [],
-              path: [],
-            },
-            tags: [
-              {
-                id: 'd3404a8f3b495',
-                name: 'operation-tag',
-              },
-            ],
-            security: [],
-            extensions: {},
-          },
-          name: 'Get Todos',
-          tags: ['operation-tag'],
-        },
-        {
-          type: 'model',
-          uri: '/schemas/Todo',
-          data: {
-            type: 'object',
-            properties: {
-              id: {
-                type: 'integer',
-              },
-            },
-            title: 'Todo',
-            'x-tags': ['model-tag'],
-          },
-          name: 'Todo',
-          tags: ['model-tag'],
-        },
-      ],
-    });
-  });
-
-  it('should return oas nodes for oas2 document', () => {
-    expect(transformOasToServiceNode(oas2Document)).toStrictEqual({
-      type: 'http_service',
-      uri: '/',
-      name: 'oas2',
-      data: {
-        id: 'abc',
-        name: 'oas2',
-        tags: [
-          {
-            id: 'd3404a8f3b495',
-            name: 'operation-tag',
-          },
-          {
-            id: 'd0460398c5f2b',
-            name: 'model-tag',
-          },
-        ],
-        version: '1.0.0',
-      },
-      tags: ['operation-tag', 'model-tag'],
-      children: [
-        {
-          type: 'http_operation',
-          uri: '/paths/todos/get',
-          data: {
-            id: 'c35bc6b301d97',
-            method: 'get',
-            path: '/todos',
-            summary: 'Get Todos',
-            responses: [],
-            servers: [],
-            request: {
-              cookie: [],
-              headers: [],
-              path: [],
-              query: [],
-            },
-            tags: [
-              {
-                id: 'd3404a8f3b495',
-                name: 'operation-tag',
-              },
-            ],
-            security: [],
-            extensions: {},
-          },
-          name: 'Get Todos',
-          tags: ['operation-tag'],
-        },
-        {
-          type: 'model',
-          uri: '/schemas/Todo',
-          data: {
-            type: 'object',
-            properties: {
-              id: {
-                type: 'integer',
-              },
-            },
-            title: 'Todo',
-            'x-tags': ['model-tag'],
-          },
-          name: 'Todo',
-          tags: ['model-tag'],
-        },
-      ],
-    });
-  });
-
-  it('should fallback to operationId', () => {
-    expect(
-      transformOasToServiceNode({
-        'x-stoplight': { id: 'def' },
-        openapi: '3.0.0',
-        info: {
-          title: 'oas3',
-          version: '1.0.0',
-        },
-        paths: {
-          '/todos': {
-            get: {
-              operationId: 'get-todos',
-            },
-          },
-        },
-      }),
-    ).toEqual({
-      type: 'http_service',
-      uri: '/',
-      name: 'oas3',
-      tags: [],
-      data: {
-        id: 'def',
-        version: '1.0.0',
-        name: 'oas3',
-      },
-      children: [
-        {
-          type: 'http_operation',
-          uri: '/operations/get-todos',
-          data: {
-            id: 'a61f53c324669',
-            iid: 'get-todos',
-            method: 'get',
-            path: '/todos',
-            responses: [],
-            servers: [],
-            request: {
-              body: {
-                id: '67f97b0ec0ef8',
-                contents: [],
-              },
-              headers: [],
-              query: [],
-              cookie: [],
-              path: [],
-            },
-            tags: [],
-            security: [],
-            extensions: {},
-          },
-          tags: [],
-          name: 'get-todos',
-        },
-      ],
-    });
-  });
-});

package/src/utils/oas/index.ts

@@ -1,150 +0,0 @@
-import { slugify } from '@stoplight/elements-core';
-import type {
-  Oas2HttpOperationTransformer,
-  Oas2HttpServiceTransformer,
-  Oas3HttpOperationTransformer,
-  Oas3HttpServiceTransformer,
-} from '@stoplight/http-spec/oas';
-import { transformOas2Operation, transformOas2Service } from '@stoplight/http-spec/oas2';
-import { transformOas3Operation, transformOas3Service } from '@stoplight/http-spec/oas3';
-import { encodePointerFragment, pointerToPath } from '@stoplight/json';
-import { NodeType } from '@stoplight/types';
-import { get, isObject, last } from 'lodash';
-import { OpenAPIObject } from 'openapi3-ts';
-import { Spec } from 'swagger-schema-official';
-
-import { oas2SourceMap } from './oas2';
-import { oas3SourceMap } from './oas3';
-import { ISourceNodeMap, NodeTypes, ServiceChildNode, ServiceNode } from './types';
-
-const isOas2 = (parsed: unknown): parsed is Spec =>
-  isObject(parsed) &&
-  'swagger' in parsed &&
-  Number.parseInt(String((parsed as Partial<{ swagger: unknown }>).swagger)) === 2;
-
-const isOas3 = (parsed: unknown): parsed is OpenAPIObject =>
-  isObject(parsed) &&
-  'openapi' in parsed &&
-  Number.parseFloat(String((parsed as Partial<{ openapi: unknown }>).openapi)) >= 3;
-
-const isOas31 = (parsed: unknown): parsed is OpenAPIObject =>
-  isObject(parsed) &&
-  'openapi' in parsed &&
-  Number.parseFloat(String((parsed as Partial<{ openapi: unknown }>).openapi)) === 3.1;
-
-const OAS_MODEL_REGEXP = /((definitions|components)\/?(schemas)?)\//;
-
-export function transformOasToServiceNode(apiDescriptionDocument: unknown) {
-  if (isOas31(apiDescriptionDocument)) {
-    return computeServiceNode(
-      { ...apiDescriptionDocument, jsonSchemaDialect: 'http://json-schema.org/draft-07/schema#' },
-      oas3SourceMap,
-      transformOas3Service,
-      transformOas3Operation,
-    );
-  }
-  if (isOas3(apiDescriptionDocument)) {
-    return computeServiceNode(apiDescriptionDocument, oas3SourceMap, transformOas3Service, transformOas3Operation);
-  } else if (isOas2(apiDescriptionDocument)) {
-    return computeServiceNode(apiDescriptionDocument, oas2SourceMap, transformOas2Service, transformOas2Operation);
-  }
-
-  return null;
-}
-
-function computeServiceNode(
-  document: Spec | OpenAPIObject,
-  map: ISourceNodeMap[],
-  transformService: Oas2HttpServiceTransformer | Oas3HttpServiceTransformer,
-  transformOperation: Oas2HttpOperationTransformer | Oas3HttpOperationTransformer,
-) {
-  const serviceDocument = transformService({ document });
-  const serviceNode: ServiceNode = {
-    type: NodeType.HttpService,
-    uri: '/',
-    name: serviceDocument.name,
-    data: serviceDocument,
-    tags: serviceDocument.tags?.map(tag => tag.name) || [],
-    children: computeChildNodes(document, document, map, transformOperation),
-  };
-
-  return serviceNode;
-}
-
-function computeChildNodes(
-  document: Spec | OpenAPIObject,
-  data: unknown,
-  map: ISourceNodeMap[],
-  transformer: Oas2HttpOperationTransformer | Oas3HttpOperationTransformer,
-  parentUri: string = '',
-) {
-  const nodes: ServiceChildNode[] = [];
-
-  if (!isObject(data)) return nodes;
-
-  for (const key of Object.keys(data)) {
-    const sanitizedKey = encodePointerFragment(key);
-    const match = findMapMatch(sanitizedKey, map);
-    if (match) {
-      const uri = `${parentUri}/${sanitizedKey}`;
-
-      const jsonPath = pointerToPath(`#${uri}`);
-      if (match.type === NodeTypes.Operation && jsonPath.length === 3) {
-        const path = String(jsonPath[1]);
-        const method = String(jsonPath[2]);
-        const operationDocument = transformer({ document, path, method });
-        let parsedUri;
-        const encodedPath = String(encodePointerFragment(path));
-
-        if (operationDocument.iid) {
-          parsedUri = `/operations/${operationDocument.iid}`;
-        } else {
-          parsedUri = uri.replace(encodedPath, slugify(path));
-        }
-
-        nodes.push({
-          type: NodeType.HttpOperation,
-          uri: parsedUri,
-          data: operationDocument,
-          name: operationDocument.summary || operationDocument.iid || operationDocument.path,
-          tags: operationDocument.tags?.map(tag => tag.name) || [],
-        });
-      } else if (match.type === NodeTypes.Model) {
-        const schemaDocument = get(document, jsonPath);
-        const parsedUri = uri.replace(OAS_MODEL_REGEXP, 'schemas/');
-
-        nodes.push({
-          type: NodeType.Model,
-          uri: parsedUri,
-          data: schemaDocument,
-          name: schemaDocument.title || last(uri.split('/')) || '',
-          tags: schemaDocument['x-tags'] || [],
-        });
-      }
-
-      if (match.children) {
-        nodes.push(...computeChildNodes(document, data[key], match.children, transformer, uri));
-      }
-    }
-  }
-
-  return nodes;
-}
-
-function findMapMatch(key: string | number, map: ISourceNodeMap[]): ISourceNodeMap | void {
-  if (typeof key === 'number') return;
-  for (const entry of map) {
-    if (!!entry.match?.match(key) || (entry.notMatch !== void 0 && !entry.notMatch.match(key))) {
-      return entry;
-    }
-  }
-}
-
-export function isJson(value: string) {
-  try {
-    JSON.parse(value);
-  } catch (e) {
-    return false;
-  }
-  return true;
-}

package/src/utils/oas/oas2.ts

@@ -1,31 +0,0 @@
-import { ISourceNodeMap, NodeTypes } from './types';
-
-export const oas2SourceMap: ISourceNodeMap[] = [
-  {
-    match: 'paths',
-    type: NodeTypes.Paths,
-    children: [
-      {
-        notMatch: '^x-',
-        type: NodeTypes.Path,
-        children: [
-          {
-            match: 'get|post|put|delete|options|head|patch|trace',
-            type: NodeTypes.Operation,
-          },
-        ],
-      },
-    ],
-  },
-
-  {
-    match: 'definitions',
-    type: NodeTypes.Models,
-    children: [
-      {
-        notMatch: '^x-',
-        type: NodeTypes.Model,
-      },
-    ],
-  },
-];

package/src/utils/oas/oas3.ts

@@ -1,37 +0,0 @@
-import { ISourceNodeMap, NodeTypes } from './types';
-
-export const oas3SourceMap: ISourceNodeMap[] = [
-  {
-    match: 'paths',
-    type: NodeTypes.Paths,
-    children: [
-      {
-        notMatch: '^x-',
-        type: NodeTypes.Path,
-        children: [
-          {
-            match: 'get|post|put|delete|options|head|patch|trace',
-            type: NodeTypes.Operation,
-          },
-        ],
-      },
-    ],
-  },
-
-  {
-    match: 'components',
-    type: NodeTypes.Components,
-    children: [
-      {
-        match: 'schemas',
-        type: NodeTypes.Models,
-        children: [
-          {
-            notMatch: '^x-',
-            type: NodeTypes.Model,
-          },
-        ],
-      },
-    ],
-  },
-];

package/src/utils/oas/types.ts

@@ -1,31 +0,0 @@
-import { IHttpOperation, IHttpService, NodeType } from '@stoplight/types';
-import { JSONSchema7 } from 'json-schema';
-
-export enum NodeTypes {
-  Paths = 'paths',
-  Path = 'path',
-  Operation = 'operation',
-  Components = 'components',
-  Models = 'models',
-  Model = 'model',
-}
-
-export interface ISourceNodeMap {
-  type: string;
-  match?: string;
-  notMatch?: string;
-  children?: ISourceNodeMap[];
-}
-
-type Node<T, D> = {
-  type: T;
-  uri: string;
-  name: string;
-  data: D;
-  tags: string[];
-};
-
-export type ServiceNode = Node<NodeType.HttpService, IHttpService> & { children: ServiceChildNode[] };
-export type ServiceChildNode = OperationNode | SchemaNode;
-export type OperationNode = Node<NodeType.HttpOperation, IHttpOperation>;
-export type SchemaNode = Node<NodeType.Model, JSONSchema7>;

package/src/web-components/__stories__/Api.stories.tsx

@@ -1,63 +0,0 @@
-import '../index';
-
-import { parse } from '@stoplight/yaml';
-import React from 'react';
-
-import { zoomApiYaml } from '../../__fixtures__/api-descriptions/zoomApiYaml';
-
-declare global {
-  namespace JSX {
-    interface IntrinsicElements {
-      'elements-api': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-    }
-  }
-}
-
-const Template = (props: any) => <elements-api {...props} />;
-
-export default {
-  title: 'web-components/API',
-  argTypes: {
-    apiDescriptionUrl: {
-      control: 'text',
-    },
-    apiDescriptionDocument: { control: 'text' },
-    layout: {
-      control: { type: 'inline-radio', options: ['sidebar', 'stacked'] },
-      defaultValue: 'sidebar',
-    },
-  },
-};
-
-export const TodosAPI = Template.bind({});
-TodosAPI.args = {
-  apiDescriptionUrl: 'https://raw.githubusercontent.com/stoplightio/elements/main/demo/src/reference/todo.v1.yaml',
-};
-
-export const TodosAPIWithFixHeight = (props: any) => (
-  <div style={{ height: 400 }}>
-    <elements-api {...props} />
-  </div>
-);
-TodosAPIWithFixHeight.args = {
-  apiDescriptionUrl: 'https://raw.githubusercontent.com/stoplightio/elements/main/demo/src/reference/todo.v1.yaml',
-};
-TodosAPIWithFixHeight.storyName = 'TodosAPI with fixed height';
-
-export const ZoomApi = Template.bind({});
-ZoomApi.args = {
-  apiDescriptionUrl: 'https://raw.githubusercontent.com/stoplightio/Public-APIs/master/reference/zoom/openapi.yaml',
-};
-ZoomApi.storyName = 'Complex API with inline `$ref`s';
-
-export const APIWithYamlProvidedDirectly = Template.bind({});
-APIWithYamlProvidedDirectly.args = {
-  apiDescriptionDocument: zoomApiYaml,
-};
-APIWithYamlProvidedDirectly.storyName = 'API With Yaml Provided Directly';
-
-export const APIWithJSONProvidedDirectly = Template.bind({});
-APIWithJSONProvidedDirectly.args = {
-  apiDescriptionDocument: JSON.stringify(parse(zoomApiYaml), null, '  '),
-};
-APIWithJSONProvidedDirectly.storyName = 'API With JSON Provided Directly';

package/src/web-components/components.ts

@@ -1,20 +0,0 @@
-import { createElementClass } from '@stoplight/elements-core';
-
-import { API } from '../index';
-
-export const ApiElement = createElementClass(API, {
-  apiDescriptionUrl: { type: 'string', defaultValue: '' },
-  apiDescriptionDocument: { type: 'string', defaultValue: '' },
-  basePath: { type: 'string' },
-  staticRouterPath: { type: 'string' },
-  router: { type: 'string' },
-  layout: { type: 'string' },
-  hideTryIt: { type: 'boolean' },
-  hideSchemas: { type: 'boolean' },
-  hideInternal: { type: 'boolean' },
-  hideExport: { type: 'boolean' },
-  logo: { type: 'string' },
-  tryItCredentialsPolicy: { type: 'string' },
-  tryItCorsProxy: { type: 'string' },
-  tryItOutDefaultServer: { type: 'string' },
-});

package/src/web-components/index.ts

@@ -1,3 +0,0 @@
-import { ApiElement } from './components';
-
-window.customElements.define('elements-api', ApiElement);

package/tsconfig.build.json

@@ -1,18 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "include": [
-    "src"
-  ],
-  "exclude": [
-    "**/__*__/**"
-  ],
-  "compilerOptions": {
-    "baseUrl": "./",
-    "outDir": "dist",
-    "moduleResolution": "node",
-    "paths": {
-      "@stoplight/elements-core": ["../elements-core/dist"],
-      "@stoplight/elements-core/*": ["../elements-core/dist/*"],
-    }
-  }
-}

package/tsconfig.json

@@ -1,7 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-
-  "include": ["src"],
-
-  "exclude": ["**/__fixtures__/**", "**/__stories__/**", "**/__tests__/**"]
-}

package/web-components.config.js

@@ -1 +0,0 @@
-module.exports = require('../../web-components.webpack.config');