diff --git a/types/carbon__type/carbon__type-tests.ts b/types/carbon__type/carbon__type-tests.ts new file mode 100644 index 0000000000..a5d4cf7b8b --- /dev/null +++ b/types/carbon__type/carbon__type-tests.ts @@ -0,0 +1,6 @@ +import { fontFamily, fontWeight, getTypeSize, print } from "@carbon/type"; + +fontFamily("mono"); // $ExpectType { fontFamily: string; } +fontWeight("light"); // $ExpectType { fontWeight: number; } +print(fontFamily("mono")); // $ExpectType string +getTypeSize(2); // $ExpectType number diff --git a/types/carbon__type/index.d.ts b/types/carbon__type/index.d.ts new file mode 100644 index 0000000000..7933f2e358 --- /dev/null +++ b/types/carbon__type/index.d.ts @@ -0,0 +1,726 @@ +// Type definitions for @carbon/type 0.0 +// Project: https://github.com/IBM/carbon-elements/tree/master/packages/type +// Definitions by: Vince Picone +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.2 + +export const bodyLong01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const bodyLong02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const bodyShort01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const bodyShort02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const caption01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const code01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const code02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const display01: { + "@media (min-width: 42rem)": { + fontSize: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const display02: { + "@media (min-width: 42rem)": { + fontSize: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const display03: { + "@media (min-width: 42rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const display04: { + "@media (min-width: 42rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const expressiveHeading04: { + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const expressiveHeading05: { + "@media (min-width: 42rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const expressiveParagraph01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lg: { + fontSize: string; + lineHeight: string; + }; + lineHeight: string; + max: { + fontSize: string; + lineHeight: string; + }; +}; + +export const fontFamilies: { + mono: string; + sans: string; + sansCondensed: string; + sansHebrew: string; + serif: string; +}; + +export const fontWeights: { + light: number; + regular: number; + semibold: number; +}; + +export const heading01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const heading02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const heading03: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const helperText01: { + fontFamily: string; + fontSize: string; + fontStyle: string; + letterSpacing: string; + lineHeight: string; +}; + +export const label01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; +}; + +export const productiveHeading04: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const productiveHeading05: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const quotation01: { + "@media (min-width: 42rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + }; + "@media (min-width: 66rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const quotation02: { + "@media (min-width: 42rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; +}; + +export const reset: { + body: { + "-moz-osx-font-smoothing": string; + "-webkit-font-smoothing": string; + fontFamily: string; + fontWeight: number; + textRendering: string; + }; + html: { + fontSize: string; + }; + strong: { + fontWeight: number; + }; +}; + +export const scale: number[]; + +export const spacing: { + layout01: string; + layout02: string; + layout03: string; + margin01: string; + margin02: string; + margin03: string; +}; + +export const styles: { + bodyLong01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + bodyLong02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + bodyShort01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + bodyShort02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + caption01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + code01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + code02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + display01: { + "@media (min-width: 42rem)": { + fontSize: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + display02: { + "@media (min-width: 42rem)": { + fontSize: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + display03: { + "@media (min-width: 42rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + display04: { + "@media (min-width: 42rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + letterSpacing: string; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + expressiveHeading04: { + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + expressiveHeading05: { + "@media (min-width: 42rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + expressiveParagraph01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lg: { + fontSize: string; + lineHeight: string; + }; + lineHeight: string; + max: { + fontSize: string; + lineHeight: string; + }; + }; + heading01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + heading02: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + heading03: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + helperText01: { + fontFamily: string; + fontSize: string; + fontStyle: string; + letterSpacing: string; + lineHeight: string; + }; + label01: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: string; + lineHeight: string; + }; + productiveHeading04: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + productiveHeading05: { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + quotation01: { + "@media (min-width: 42rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + }; + "@media (min-width: 66rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; + quotation02: { + "@media (min-width: 42rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 66rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 82rem)": { + fontSize: string; + lineHeight: string; + }; + "@media (min-width: 99rem)": { + fontSize: string; + }; + fontFamily: string; + fontSize: string; + fontWeight: number; + letterSpacing: number; + lineHeight: string; + }; +}; + +export function fontFamily( + name: string +): { + fontFamily: string; +}; + +export function fontWeight( + weight: string +): { + fontWeight: number; +}; + +export function getTypeSize(step: number): number; + +export function print(block: object): string; + +export namespace fontFamily { + const prototype: {}; +} + +export namespace fontWeight { + const prototype: {}; +} + +export namespace getTypeSize { + const prototype: {}; +} + +export namespace print { + const prototype: {}; +} diff --git a/types/carbon__type/tsconfig.json b/types/carbon__type/tsconfig.json new file mode 100644 index 0000000000..7949e7ab22 --- /dev/null +++ b/types/carbon__type/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": ["es6"], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": ["../"], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true, + "paths": { + "@carbon/type": ["carbon__type"] + } + }, + "files": ["index.d.ts", "carbon__type-tests.ts"] +} diff --git a/types/carbon__type/tslint.json b/types/carbon__type/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/carbon__type/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }