slackblock 0.4.0 → 1.0.0-0

package/src/components/input/select.tsx

@@ -1,36 +0,0 @@
-import React from 'react';
-import Confirmation from '../block/confirmation';
-import Option from './option';
-import OptionGroup from './option-group';
-import {SingleOrArray} from '../../utils/type-helpers';
-
-export const selectTypes = {
-  STATIC: 'static',
-  EXTERNAL: 'external',
-  USER: 'user',
-  CONVERSATION: 'conversation',
-  CHANNEL: 'channel'
-};
-
-type SelectType =
-  'static' |
-  'external' |
-  'user' |
-  'conversation' |
-  'channel';
-
-export type Props = {
-  placeholder: string;
-  actionId: string;
-  type?: SelectType;
-  multi?: boolean;
-  children?: SingleOrArray<React.ReactElement<Option>> | SingleOrArray<React.ReactElement<OptionGroup>>;
-  initialOptions?: React.ReactElement<Option>[];
-  confirm?: React.ReactElement<Confirmation>;
-  maxSelectedItems?: number;
-  initialUsers?: string[];
-  initialConversations?: string[];
-  initialChannels?: string[];
-}
-
-export default class Select extends React.Component<Props> {}

package/src/components/input/text.tsx

@@ -1,12 +0,0 @@
-import React from 'react';
-
-export type Props = {
-  actionId: string;
-  placeholder?: string;
-  initial?: string;
-  multiline?: boolean;
-  minLength?: number;
-  maxLength?: number;
-};
-
-export default class TextInput extends React.Component<Props> {}

package/src/components/layout/actions.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import { InteractiveBlockElement } from '../../constants/types';
-
-export type Props = {
-  children: InteractiveBlockElement | InteractiveBlockElement[];
-  blockId?: string;
-};
-
-export default class Actions extends React.Component<Props> {}

package/src/components/layout/container.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import {SingleOrArray} from '../../utils/type-helpers';
-import {Child} from '../../constants/types';
-
-export type Props = {
-  children: SingleOrArray<Child>
-};
-
-export default class Container extends React.Component<Props> {}

package/src/components/layout/context.tsx

@@ -1,12 +0,0 @@
-import React from 'react';
-import Text from '../block/text';
-import Image from '../block/image';
-
-export type ImageOrText = React.ReactElement<Text> | React.ReactElement<Image>;
-
-export type Props = {
-  children: ImageOrText | ImageOrText[];
-  blockId?: string;
-};
-
-export default class Context extends React.Component<Props> {}

package/src/components/layout/divider.tsx

@@ -1,7 +0,0 @@
-import React from 'react';
-
-export type Props = {
-  blockId?: string;
-};
-
-export default class Divider extends React.Component<Props> {}

package/src/components/layout/file.tsx

@@ -1,8 +0,0 @@
-import React from 'react';
-
-export type Props = {
-  externalId: string;
-  blockId?: string;
-};
-
-export default class File extends React.Component<Props> {}

package/src/components/layout/image.tsx

@@ -1,10 +0,0 @@
-import React from 'react';
-
-export type Props = {
-  url: string;
-  alt: string;
-  title?: string;
-  blockId?: string;
-};
-
-export default class Image extends React.Component<Props> {}

package/src/components/layout/input.tsx

@@ -1,12 +0,0 @@
-import React from 'react';
-import {InputBlockElement} from '../../constants/types';
-
-export type Props = {
-  label: string;
-  element: InputBlockElement;
-  hint?: string;
-  optional?: boolean;
-  blockId?: string;
-};
-
-export default class Input extends React.Component<Props> {}

package/src/components/layout/section.tsx

@@ -1,15 +0,0 @@
-import React from 'react';
-import Text from '../block/text';
-import {BlockElement} from '../../constants/types';
-
-type TextElem = React.ReactElement<Text>;
-
-export type Props = {
-  text: React.ReactElement<Text>;
-  blockId?: string;
-  children?: TextElem | TextElem[];
-  accessory?: BlockElement;
-};
-
-export default class Section extends React.Component<Props> {}
-

package/src/components/message.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import {Element} from '../constants/types'; 
-
-type Props = {
-  children: string | Element | Element[];
-  text?: string;
-  asUser?: boolean;
-  iconEmoji?: string;
-  iconUrl?: string;
-  markdown?: boolean;
-  parse?: 'full' | 'none';
-  replyBroadcast?: boolean;
-  replyTo?: string;
-  unfurlLinks?: boolean;
-  unfurlMedia?: boolean;
-  username?: string;
-  color?: string;
-};
-
-export default class Message extends React.Component<Props> {}

package/src/constants/types.d.ts

@@ -1,93 +0,0 @@
-import {Component, ReactElement} from 'react';
-
-import Text from '../components/block/text';
-import Button from '../components/block/button';
-import Image from '../components/block/image';
-import Confirmation from '../components/block/confirmation';
-
-import Section from '../components/layout/section';
-import Actions from '../components/layout/actions';
-import Context from '../components/layout/context';
-
-import TextInput from '../components/input/text';
-import DatePicker from '../components/input/date-picker';
-import Select from '../components/input/select';
-import Option from '../components/input/option';
-import OptionGroup from '../components/input/option-group';
-import Overflow from '../components/input/overflow';
-import RadioGroup from '../components/input/radio-group';
-
-import {TextType as TextInputType} from '../transformers/input/text';
-import {DatePickerType} from '../transformers/input/date-picker';
-import {SelectType} from '../transformers/input/select';
-import {OptionType} from '../transformers/input/option';
-import {OptionGroupType} from '../transformers/input/option-group';
-import {OverflowType} from '../transformers/input/overflow';
-import {RadioGroupType} from '../transformers/input/radio-group';
-
-import {TextType} from '../transformers/block/text';
-import {ImageType} from '../transformers/block/image';
-import {ButtonType} from '../transformers/block/button';
-import {ConfirmationType} from '../transformers/block/confirmation';
-
-export type Block = ReactElement<Section> | ReactElement<Actions> | ReactElement<Context>;
-export type Attachment = {
-  color: string;
-  blocks: Block[];
-};
-
-export type InteractiveBlockElement = ReactElement<Button>;
-export type SerializedInteractiveBlockElement = ButtonType;
-
-export type StandardBlockElement =
-  ReactElement<Text> |
-  ReactElement<Image> |
-  ReactElement<Confirmation>;
-
-export type InputBlockElement =
-  ReactElement<TextInput> |
-  ReactElement<DatePicker> |
-  ReactElement<Option> |
-  ReactElement<OptionGroup> |
-  ReactElement<Select> |
-  ReactElement<Overflow> |
-  ReactElement<RadioGroup>;
-
-export type SerializedInputBlockElement =
-  TextInputType |
-  DatePickerType |
-  OptionType |
-  OptionGroupType |
-  SelectType |
-  OverflowType |
-  RadioGroupType;
-
-export type BlockElement = InteractiveBlockElement & StandardBlockElement & InputBlockElement;
-export type SerializedBlockElement = TextType | ImageType | ConfirmationType;
-
-export type SlackMessage = {
-  text?: string;
-  as_user?: boolean;
-  blocks?: Block[];
-  attachments?: Attachment[];
-  icon_emoji?: string;
-  icon_url?: string;
-  link_names?: boolean;
-  mrkdwn?: boolean;
-  parse?: 'full' | 'none';
-  reply_broadcast?: boolean;
-  thread_ts?: string;
-  unfurl_links?: boolean;
-  unfurl_media?: boolean;
-  username?: string;
-};
-
-type AnyFunction = () => any;
-
-export type WithType = {
-  type?: string | AnyFunction;
-};
-export type BComponent = Component & WithType;
-export type BElement = ReactElement & WithType;
-export type Element = BComponent | BElement;
-export type Child = string | Element | Element[];

package/src/index.ts

@@ -1,3 +0,0 @@
-import render from './renderer';
-
-export default render;

package/src/parser/index.ts

@@ -1,32 +0,0 @@
-import {Child, Block, SlackMessage} from '../constants/types';
-import transformers from '../transformers';
-import getType from '../utils/get-type';
-
-export default (children: Child): SlackMessage => {
-  if (typeof children === 'string') {
-    return {text: children};
-  }
-
-  if (!Array.isArray(children)) {
-    children = [children];
-  }
-
-  const transformedBlocks: any[] = [];
-  for (const child of children) {
-    const type = getType(child);
-    const transformer = transformers[type];
-
-    if (transformer) {
-      transformedBlocks.push(transformer(child));
-    } else if (type !== 'null') {
-      console.warn(`No transformer for child type '${type}' exists and will be ignored.`);
-    }
-  }
-
-  const result: {blocks?: Block[]} = {};
-  if (transformedBlocks.length > 0) {
-    result.blocks = transformedBlocks.concat.apply([], transformedBlocks); // Flatten 1 deep
-  }
-
-  return result;
-};

package/src/renderer/index.ts

@@ -1,75 +0,0 @@
-import {SlackMessage, Element} from '../constants/types';
-import parser from '../parser';
-import getType from '../utils/get-type';
-
-const render = (element: Element): SlackMessage => {
-  const {props = {}} = element || {};
-
-  const typeName = getType(element);
-  if (typeName !== 'Message') {
-    throw new TypeError('Provided top-level element must be a Message type.');
-  }
-
-  if (!props.children) {
-    throw new Error('Cannot render a Message with no children.');
-  }
-
-  const json = {...parser(props.children)};
-
-  if (props.replyTo) {
-    json.thread_ts = props.replyTo;
-  }
-
-  if (typeof props.markdown !== 'undefined') {
-    json.mrkdwn = props.markdown;
-  }
-
-  json.text = props.text || '';
-
-  if (props.iconEmoji) {
-    json.icon_emoji = props.iconEmoji;
-  }
-
-  if (props.iconUrl) {
-    json.icon_url = props.iconUrl;
-  }
-
-  if (props.parse) {
-    json.parse = props.parse;
-  }
-
-  if (props.username) {
-    json.username = props.username;
-  }
-
-  if (props.asUser) {
-    json.as_user = props.asUser;
-  }
-
-  if (props.replyBroadcast) {
-    json.reply_broadcast = props.replyBroadcast;
-  }
-
-  if (props.unfurlLinks) {
-    json.unfurl_links = props.unfurlLinks;
-  }
-
-  if (typeof props.unfurlMedia !== 'undefined') {
-    json.unfurl_media = props.unfurlMedia;
-  }
-
-  if (props.color && json.blocks) {
-    json.attachments = [
-      {
-        color: props.color as string,
-        blocks: json.blocks
-      }
-    ];
-
-    delete json.blocks;
-  }
-
-  return json;
-};
-
-export default render;

package/src/transformers/block/button.tsx

@@ -1,47 +0,0 @@
-import React from 'react';
-import { Element } from "../../constants/types";
-
-import {ButtonProps} from '../../components/block/button';
-import { TextType } from "./text";
-import { ConfirmationType } from "./confirmation";
-import { transform } from "..";
-import Text from "../../components/block/text";
-import Confirmation from '../../components/block/confirmation';
-
-export type ButtonType = {
-  type: 'button';
-  text: TextType;
-  action_id: string;
-  url?: string;
-  value?: string;
-  style?: 'primary' | 'danger';
-  confirm?: ConfirmationType;
-};
-
-export default (child: Element): ButtonType => {
-  const {actionId, children, url, value, style, confirm}: ButtonProps = child.props;
-
-  const res: ButtonType = {
-    type: 'button',
-    text: transform(<Text plainText>{children}</Text>) as TextType,
-    action_id: actionId
-  };
-
-  if (url) {
-    res.url = url;
-  }
-
-  if (value) {
-    res.value = value;
-  }
-
-  if (style) {
-    res.style = style;
-  }
-
-  if (confirm) {
-    res.confirm = transform(confirm) as ConfirmationType;
-  }
-
-  return res;
-};

package/src/transformers/block/confirmation.tsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import { Element } from "../../constants/types";
-import { TextType } from "./text";
-import { transform } from "..";
-import { ConfirmationProps } from '../../components/block/confirmation';
-import Text from "../../components/block/text";
-
-export type ConfirmationType = {
-  title: TextType;
-  text: TextType;
-  confirm: TextType;
-  deny: TextType;
-};
-
-export default (child: Element): ConfirmationType => {
-  const { title, confirm, deny, children }: ConfirmationProps = child.props;
-
-  const res: ConfirmationType = {
-    title: transform(<Text plainText>{title}</Text>) as TextType,
-    text: transform(children) as TextType,
-    confirm: transform(<Text plainText>{confirm}</Text>) as TextType,
-    deny: transform(<Text plainText>{deny}</Text>) as TextType
-  };
-
-  return res;
-};

package/src/transformers/block/image.ts

@@ -1,18 +0,0 @@
-import {Element} from '../../constants/types';
-import {Props as ImageProps} from '../../components/block/image';
-
-export type ImageType = {
-  type: 'image';
-  url: string;
-  alt: string;
-};
-
-export default (child: Element): ImageType => {
-  const {url, alt}: ImageProps = child.props;
-
-  return {
-    type: 'image',
-    url,
-    alt
-  };
-};

package/src/transformers/block/text.ts

@@ -1,34 +0,0 @@
-import {Element} from '../../constants/types';
-
-export type TextType = {
-  type: 'plain_text' | 'mrkdwn';
-  text: string;
-  emoji?: boolean;
-  verbatim?: boolean;
-};
-
-export default (elem: Element): TextType => {
-  const {
-    props: {
-      plainText,
-      children,
-      emoji,
-      verbatim
-    }
-  } = elem;
-
-  const res: TextType = {
-    type: plainText ? 'plain_text' : 'mrkdwn',
-    text: children
-  };
-
-  if (emoji) {
-    res.emoji = true;
-  }
-
-  if (verbatim) {
-    res.verbatim = true;
-  }
-
-  return res;
-};

package/src/transformers/index.ts

@@ -1,65 +0,0 @@
-import {Child, Element} from '../constants/types';
-import getType from '../utils/get-type';
-
-import Text from './block/text';
-import Confirmation from './block/confirmation';
-import Button from './block/button';
-import Image from './block/image';
-
-import Container from './layout/container';
-import Section from './layout/section';
-import Actions from './layout/actions';
-import Context from './layout/context';
-import Divider from './layout/divider';
-import File from './layout/file';
-import ImageLayout from './layout/image';
-import Input from './layout/input';
-
-import TextInput from './input/text';
-import DatePicker from './input/date-picker';
-import Select from './input/select';
-import Option from './input/option';
-import OptionGroup from './input/option-group';
-import Overflow from './input/overflow';
-import RadioGroup from './input/radio-group';
-
-type TransformersType = {
-  [index: string]: (child: Child) => {};
-};
-
-const Transformers: TransformersType = {
-  Container,
-  Section,
-  Actions,
-  Context,
-  Divider,
-  File,
-  ImageLayout,
-  Input,
-
-  Text,
-  Confirmation,
-  Button,
-  Image,
-
-  TextInput,
-  DatePicker,
-  Select,
-  Overflow,
-  RadioGroup,
-
-  Option,
-  OptionGroup
-};
-
-export default Transformers;
-
-export const transform = (elem: Element): {[index: string]: any} => {
-  const type = getType(elem);
-
-  if (!Transformers[type]) {
-    throw new Error(`No transformer exists for type '${type}'`);
-  }
-
-  return Transformers[type](elem);
-};

package/src/transformers/input/date-picker.tsx

@@ -1,43 +0,0 @@
-import React from 'react';
-import {Props as DatePickerProps} from '../../components/input/date-picker';
-import {Element} from '../../constants/types';
-import {TextType} from '../block/text';
-import {ConfirmationType} from '../block/confirmation';
-import {transform} from '..';
-import Text from '../../components/block/text';
-
-export type DatePickerType = {
-  type: 'datepicker';
-  action_id: string;
-  placeholder?: TextType;
-  initial_date?: string;
-  confirm?: ConfirmationType;
-};
-
-export default (child: Element): DatePickerType => {
-  const {actionId, placeholder, initialDate, confirm}: DatePickerProps = child.props;
-
-  const res: DatePickerType = {
-    type: 'datepicker',
-    action_id: actionId
-  };
-
-  if (placeholder) {
-    res.placeholder = transform(<Text plainText>{placeholder}</Text>) as TextType;
-  }
-
-  if (initialDate) {
-    const dateRegex = /^(\d{4})-(\d{2})-(\d{2})$/g;
-    const date = new Date(initialDate);
-    if (Number.isNaN(date.getTime()) || !dateRegex.test(initialDate)) {
-      throw new Error('Date must be valid and in format YYY-MM-DD.');
-    }
-    res.initial_date = initialDate;
-  }
-
-  if (confirm) {
-    res.confirm = transform(confirm as Element) as ConfirmationType;
-  }
-
-  return res;
-};

package/src/transformers/input/option-group.tsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import Text from '../../components/block/text';
-import {Props as OptionGroupProps} from '../../components/input/option-group';
-import {Element} from '../../constants/types';
-import {TextType} from '../block/text';
-import {OptionType} from './option';
-import {transform} from '..';
-
-export type OptionGroupType = {
-  label: TextType;
-  options: OptionType[];
-};
-
-export default (child: Element): OptionGroupType => {
-  const {label, children}: OptionGroupProps = child.props;
-
-  let options = children;
-  if (!Array.isArray(options)) {
-    options = [options];
-  }
-
-  return {
-    label: transform(<Text plainText>{label}</Text>) as TextType,
-    options: options.map(option => transform(option as Element)) as OptionType[]
-  };
-};

package/src/transformers/input/option.tsx

@@ -1,27 +0,0 @@
-import React from 'react';
-import {Element} from '../../constants/types';
-import {TextType} from '../block/text';
-import Text from '../../components/block/text';
-import {Props as OptionProps} from '../../components/input/option';
-import {transform} from '..';
-
-export type OptionType = {
-  text: TextType;
-  value: string;
-  url?: string;
-};
-
-export default (child: Element): OptionType => {
-  const {children: text, value, url}: OptionProps = child.props;
-
-  const res: OptionType = {
-    text: transform(<Text plainText>{text}</Text>) as TextType,
-    value
-  };
-
-  if (url) {
-    res.url = url;
-  }
-
-  return res;
-};