WIP: split some component definitions into individual files.

src/components/box/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference path="../../../index.d.ts" />
+
+import { BulmaComponent } from '../../../index';
+
+export const Box: BulmaComponent<{}, 'div'>;

src/components/breadcrumb/index.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { BulmaComponent, Size } from '../../../index';
+
+interface BreadcrumbItem {
+  url: string;
+  active?: boolean;
+  name?: React.ReactNode;
+}
+
+interface BreadcrumbProps {
+  separator?: 'arrow' | 'bullet' | 'dot' | 'succeeds';
+  size?: Size;
+  align?: 'right' | 'center';
+  items?: BreadcrumbItem[];
+  hrefAttr?: string;
+}
+
+export const Breadcrumb: BulmaComponent<BreadcrumbProps, 'a'>;

src/components/button/index.d.ts

@@ -0,0 +1,30 @@
+import { BulmaComponent, Color, Size } from '../../../index';
+
+interface ButtonProps {
+  onClick?: () => void;
+  color?: Color;
+  size?: Size;
+  state?: 'hover' | 'focus' | 'active' | 'loading';
+  outlined?: boolean;
+  inverted?: boolean;
+  submit?: boolean;
+  reset?: boolean;
+  loading?: boolean;
+  fullwidth?: boolean;
+  disabled?: boolean;
+  remove?: boolean;
+  isSelected?: boolean;
+  isStatic?: boolean;
+  rounded?: boolean;
+  text?: boolean;
+}
+
+interface ButtonGroupProps {
+  size?: Size;
+  hasAddons?: boolean;
+  position?: 'centered' | 'right';
+}
+
+export const Button: BulmaComponent<ButtonProps, 'button'> & {
+  Group: BulmaComponent<ButtonGroupProps, 'div'>;
+};

src/components/card/index.d.ts

@@ -0,0 +1,14 @@
+import { BulmaComponent } from '../../../index';
+import { ImageProps } from '../image';
+
+export const Card: BulmaComponent<{}, 'div'> & {
+  Image: BulmaComponent<ImageProps, 'figure'>;
+  Content: BulmaComponent<{}, 'div'>;
+  Header: BulmaComponent<{}, 'div'> & {
+    Title: BulmaComponent<{}, 'div'>;
+    Icon: BulmaComponent<{}, 'div'>;
+  };
+  Footer: BulmaComponent<{}, 'div'> & {
+    Item: BulmaComponent<{}, 'div'>;
+  };
+};

src/components/columns/index.d.ts

@@ -0,0 +1,36 @@
+import { Breakpoint, BulmaComponent } from '../../../index';
+
+interface ColumnGroupProps {
+  variableGap?: {
+    [breakpoint in Breakpoint]: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
+  };
+  breakpoint?: Breakpoint;
+  gapless?: boolean;
+  multiline?: boolean;
+  centered?: boolean;
+  vCentered?: boolean;
+}
+
+type ColumnSize = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+
+interface ColumnBreakpointConfiguration {
+  size?: ColumnSize;
+  offset?: ColumnSize;
+  narrow?: boolean;
+}
+
+interface ColumnProps {
+  size?: ColumnSize;
+  offset?: ColumnSize;
+  narrow?: boolean;
+  touch?: ColumnBreakpointConfiguration;
+  mobile?: ColumnBreakpointConfiguration;
+  tablet?: ColumnBreakpointConfiguration;
+  desktop?: ColumnBreakpointConfiguration;
+  widescreen?: ColumnBreakpointConfiguration;
+  fullhd?: ColumnBreakpointConfiguration;
+}
+
+export const Columns: BulmaComponent<ColumnGroupProps, 'div'> & {
+  Column: BulmaComponent<ColumnProps, 'div'>;
+};

src/components/container/index.d.ts

@@ -0,0 +1,8 @@
+import { Breakpoint, BulmaComponent } from '../../../index';
+
+interface ContainerProps {
+  fluid?: boolean;
+  breakpoint?: Breakpoint;
+}
+
+export const Container: BulmaComponent<ContainerProps, 'div'>;

src/components/content/index.d.ts

@@ -0,0 +1,7 @@
+import { BulmaComponent, Size } from '../../../index';
+
+interface ContentProps {
+  size?: Size;
+}
+
+export const Content: BulmaComponent<ContentProps, 'div'>;

src/components/dropdown/index.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { Color, ElementProps, RenderAsComponent } from '../../../index';
+
+interface DropdownProps<T> {
+  value?: T;
+  onChange?: (newValue: T) => void;
+  color?: Color;
+  hoverable?: boolean;
+  label?: React.ReactNode;
+  closeOnSelect?: boolean;
+  right?: boolean;
+  up?: boolean;
+  align?: 'right';
+}
+
+interface DropdownItemProps<T> {
+  value: T;
+}
+
+export const Dropdown: (<TValue, TComponent extends RenderAsComponent = 'div'>(
+  props: DropdownProps<TValue> &
+    ElementProps<DropdownProps<TValue>, TComponent>,
+) => React.ReactElement) & {
+  Item: <TValue, TComponent extends RenderAsComponent = 'div'>(
+    props: DropdownItemProps<TValue> &
+      ElementProps<DropdownItemProps<TValue>, TComponent>,
+  ) => React.ReactElement;
+  Divider: (
+    props: Omit<ElementProps<{}, 'hr'>, 'renderAs'>,
+  ) => React.ReactElement;
+};

src/components/image/index.d.ts

@@ -0,0 +1,35 @@
+import { BulmaComponentWithoutRenderAs } from '../../../index';
+
+interface ImageProps {
+  src?: string;
+  alt?: string;
+  rounded?: boolean;
+  size?:
+    | 16
+    | 24
+    | 32
+    | 48
+    | 64
+    | 96
+    | 128
+    | 'square'
+    | '1by1'
+    | '4by3'
+    | '3by2'
+    | '16by9'
+    | '2by1'
+    | '5by4'
+    | '5by3'
+    | '3by1'
+    | '4by5'
+    | '3by4'
+    | '2by3'
+    | '3by5'
+    | '9by16'
+    | '1by2'
+    | '1by3';
+  fallback?: string;
+  fullwidth?: boolean;
+}
+
+export const Image: BulmaComponentWithoutRenderAs<ImageProps, 'figure'>;

tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "target": "es5",
+    "sourceMap": true,
+    "baseUrl": ".",
+    "typeRoots": ["."]
+  },
+  "exclude": [
+    "node_modules"
+  ]
+}