Skip to content

Commit

Permalink
feat: Built modules for design tokens (#356)
Browse files Browse the repository at this point in the history
  • Loading branch information
tassoevan authored Jan 4, 2021
1 parent 15f3637 commit f9c3449
Show file tree
Hide file tree
Showing 91 changed files with 3,090 additions and 2,107 deletions.
4 changes: 3 additions & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,5 +26,7 @@
},
"eslint.options": {
"extensions": [".js", ".jsx", ".md", ".mdx", ".ts", ".tsx"]
}
},
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
36 changes: 18 additions & 18 deletions packages/css-in-js/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -40,32 +40,32 @@
},
"devDependencies": {
"@rocket.chat/eslint-config": "^0.4.0",
"@rollup/plugin-commonjs": "^16.0.0",
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-json": "^4.1.0",
"@rollup/plugin-node-resolve": "^10.0.0",
"@rollup/plugin-typescript": "^6.1.0",
"@types/jest": "^26.0.0",
"@rollup/plugin-node-resolve": "^11.0.1",
"@rollup/plugin-typescript": "^8.1.0",
"@types/jest": "^26.0.19",
"@types/stylis": "^4.0.0",
"@typescript-eslint/eslint-plugin": "^4.5.0",
"@typescript-eslint/parser": "^4.5.0",
"documentation": "^13.0.2",
"eslint": "^7.13.0",
"eslint-config-prettier": "^6.15.0",
"eslint-plugin-import": "^2.19.1",
"eslint-plugin-prettier": "^3.1.4",
"jest": "^26.1.0",
"lint-staged": "^10.0.8",
"prettier": "2.1.2",
"rollup": "^2.33.3",
"@typescript-eslint/eslint-plugin": "^4.11.0",
"@typescript-eslint/parser": "^4.11.0",
"documentation": "^13.1.0",
"eslint": "^7.16.0",
"eslint-config-prettier": "^7.1.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-prettier": "^3.3.0",
"jest": "^26.6.3",
"lint-staged": "^10.5.3",
"prettier": "^2.2.1",
"rollup": "^2.35.1",
"rollup-plugin-terser": "^7.0.2",
"ts-jest": "^26.1.1",
"typescript": "^4.0.3"
"ts-jest": "^26.4.4",
"typescript": "^4.1.3"
},
"publishConfig": {
"access": "public"
},
"dependencies": {
"@emotion/hash": "^0.8.0",
"stylis": "^4.0.3"
"stylis": "^4.0.6"
}
}
26 changes: 13 additions & 13 deletions packages/emitter/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -69,26 +69,26 @@ The event emitter class.

Returns the whole EventType list

Returns **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)<[EventType](#eventtype)>**
Returns **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)<[EventType](#eventtype)>**

#### has

Returns `true` if this emmiter has a listener attached to the `key` event type

##### Parameters

- `key` **[EventType](#eventtype)**
- `key` **[EventType](#eventtype)**

Returns **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)**
Returns **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)**

#### on

Adds the `handler` function to listen events of the `type` type.

##### Parameters

- `type` **[EventType](#eventtype)**
- `handler` **[Handler](#handler)<T>**
- `type` **[EventType](#eventtype)**
- `handler` **[Handler](#handler)<T>**

Returns **OffCallbackHandler** a function to unsubscribe the handler invoking `this.off(type, handler)`

Expand All @@ -98,8 +98,8 @@ Adds a _one-time_ `handler` function for the event of the `type` type.

##### Parameters

- `type` **[EventType](#eventtype)**
- `handler` **[Handler](#handler)<T>**
- `type` **[EventType](#eventtype)**
- `handler` **[Handler](#handler)<T>**

Returns **OffCallbackHandler** a function to unsubscribe the handler invoking `this.off(type, handler)`

Expand All @@ -109,10 +109,10 @@ Removes the specified `handler` from the list of handlers of the event of the `t

##### Parameters

- `type` **[EventType](#eventtype)**
- `handler` **[Handler](#handler)<T>**
- `type` **[EventType](#eventtype)**
- `handler` **[Handler](#handler)<T>**

Returns **void**
Returns **void**

#### emit

Expand All @@ -121,7 +121,7 @@ order they were registered, passing the supplied argument `e` to each.

##### Parameters

- `type` **[EventType](#eventtype)**
- `e` **T?**
- `type` **[EventType](#eventtype)**
- `e` **T?**

Returns **void**
Returns **void**
42 changes: 21 additions & 21 deletions packages/emitter/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -44,31 +44,31 @@
"docs": "run-s build docs:api-extractor docs:api-documenter docs:readme docs:clean"
},
"devDependencies": {
"@microsoft/api-documenter": "^7.8.21",
"@microsoft/api-extractor": "^7.9.2",
"@microsoft/api-documenter": "^7.12.1",
"@microsoft/api-extractor": "^7.12.1",
"@rocket.chat/eslint-config": "^0.4.0",
"@rollup/plugin-commonjs": "^15.1.0",
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-json": "^4.1.0",
"@rollup/plugin-node-resolve": "^9.0.0",
"@rollup/plugin-typescript": "^6.0.0",
"@types/jest": "^26.0.15",
"@typescript-eslint/eslint-plugin": "^4.5.0",
"@typescript-eslint/parser": "^4.5.0",
"documentation": "^13.0.2",
"eslint": "^7.13.0",
"eslint-config-prettier": "^6.15.0",
"eslint-plugin-import": "^2.19.1",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-react": "^7.16.0",
"eslint-plugin-react-hooks": "^4.0.4",
"jest": "^26.0.1",
"lint-staged": "^10.0.8",
"prettier": "^2.1.2",
"@rollup/plugin-node-resolve": "^11.0.1",
"@rollup/plugin-typescript": "^8.1.0",
"@types/jest": "^26.0.19",
"@typescript-eslint/eslint-plugin": "^4.11.1",
"@typescript-eslint/parser": "^4.11.1",
"documentation": "^13.1.0",
"eslint": "^7.16.0",
"eslint-config-prettier": "^7.1.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-prettier": "^3.3.0",
"eslint-plugin-react": "^7.21.5",
"eslint-plugin-react-hooks": "^4.2.0",
"jest": "^26.6.3",
"lint-staged": "^10.5.3",
"prettier": "^2.2.1",
"rimraf": "^3.0.2",
"rollup": "^2.21.0",
"rollup": "^2.35.1",
"rollup-plugin-terser": "^7.0.2",
"ts-jest": "^26.1.0",
"typescript": "^4.0.3"
"ts-jest": "^26.4.4",
"typescript": "^4.1.3"
},
"publishConfig": {
"access": "public"
Expand Down
2 changes: 2 additions & 0 deletions packages/fuselage-hooks/docs/fuselage-hooks.placements.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,3 +9,5 @@
```typescript
export declare type Placements = 'top-start' | 'top-middle' | 'top-end' | 'bottom-start' | 'bottom-middle' | 'bottom-end' | 'left-start' | 'left-middle' | 'left-end' | 'right-start' | 'right-middle' | 'right-end' | Positions;
```
<b>References:</b> [Positions](./fuselage-hooks.positions.md)

Original file line number Diff line number Diff line change
Expand Up @@ -14,3 +14,5 @@ export declare type PositionOptions = {
watch?: boolean;
};
```
<b>References:</b> [Placements](./fuselage-hooks.placements.md)

6 changes: 3 additions & 3 deletions packages/fuselage-hooks/src/useClipboard.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { act } from 'react-dom/test-utils';
import { useClipboard, UseClipboardReturn } from './useClipboard';

describe('useClipboard hook', () => {
let container;
let container: Element;

beforeEach(() => {
container = document.createElement('div');
Expand Down Expand Up @@ -75,8 +75,8 @@ describe('useClipboard hook', () => {
Object.assign(navigator, {
clipboard: {
writeText: () =>
new Promise((resolve) => {
return resolve();
new Promise<void>((resolve) => {
resolve();
}),
},
});
Expand Down
3 changes: 1 addition & 2 deletions packages/fuselage-hooks/src/usePrefersColorScheme.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@
import { useMediaQuery } from '.';
import { useMediaQuery } from './useMediaQuery';

/**
* Hook to get the prefers-color-scheme value.
*
* @returns `true` if the prefers-color-scheme matches
* @public
*/

export const usePrefersColorScheme = (scheme?: string): boolean =>
useMediaQuery(`(prefers-color-scheme: ${!scheme ? 'light' : scheme})`);
3 changes: 1 addition & 2 deletions packages/fuselage-hooks/src/usePrefersReducedData.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@
import { useMediaQuery } from '.';
import { useMediaQuery } from './useMediaQuery';

/**
* Hook to get the prefers-reduce-data value.
*
* @returns `true` if the prefers-reduce-data is set reduce in the media queries that matches
* @public
*/

export const usePrefersReducedData = (): boolean =>
useMediaQuery('(prefers-reduced-data: reduce)');
3 changes: 1 addition & 2 deletions packages/fuselage-hooks/src/usePrefersReducedMotion.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@
import { useMediaQuery } from '.';
import { useMediaQuery } from './useMediaQuery';

/**
* Hook to get the prefers-reduce-motion value.
*
* @returns `true` if the prefers-reduce-motion is set reduce in the media queries that matches
* @public
*/

export const usePrefersReducedMotion = (): boolean =>
useMediaQuery('(prefers-reduced-motion: reduce)');
4 changes: 2 additions & 2 deletions packages/fuselage-polyfills/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,10 @@
},
"main": "index.js",
"dependencies": {
"@juggle/resize-observer": "^3.1.2",
"@juggle/resize-observer": "^3.2.0",
"clipboard-polyfill": "^3.0.1",
"element-closest-polyfill": "^1.0.2",
"focus-visible": "^5.0.2",
"focus-visible": "^5.2.0",
"focus-within-polyfill": "^5.1.0"
}
}
2 changes: 1 addition & 1 deletion packages/fuselage-tokens/.prettierrc
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,4 @@
"quoteProps": "consistent",
"jsxSingleQuote": true,
"printWidth": 80
}
}
3 changes: 0 additions & 3 deletions packages/fuselage-tokens/all.js

This file was deleted.

3 changes: 0 additions & 3 deletions packages/fuselage-tokens/all.scss

This file was deleted.

35 changes: 9 additions & 26 deletions packages/fuselage-tokens/breakpoints.js
Original file line number Diff line number Diff line change
@@ -1,27 +1,10 @@
export default {
xs: {
minViewportWidth: null,
columns: 4,
gutterWidth: 16,
},
sm: {
minViewportWidth: 600,
columns: 8,
gutterWidth: 16,
},
md: {
minViewportWidth: 768,
columns: 8,
gutterWidth: 24,
},
lg: {
minViewportWidth: 1024,
columns: 12,
gutterWidth: 24,
},
xl: {
minViewportWidth: 1440,
columns: 12,
gutterWidth: 24,
},
'use strict';
module.exports = {
xs: { name: 'xs', minViewportWidth: null, columns: 4, gutterWidth: 16 },
sm: { name: 'sm', minViewportWidth: 600, columns: 8, gutterWidth: 16 },
md: { name: 'md', minViewportWidth: 768, columns: 8, gutterWidth: 24 },
lg: { name: 'lg', minViewportWidth: 1024, columns: 12, gutterWidth: 24 },
xl: { name: 'xl', minViewportWidth: 1280, columns: 12, gutterWidth: 24 },
xxl: { name: 'xxl', minViewportWidth: 1600, columns: 12, gutterWidth: 24 },
xxxl: { name: 'xxxl', minViewportWidth: 1920, columns: 12, gutterWidth: 24 },
};
9 changes: 9 additions & 0 deletions packages/fuselage-tokens/breakpoints.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export default {
xs: { name: 'xs', minViewportWidth: null, columns: 4, gutterWidth: 16 },
sm: { name: 'sm', minViewportWidth: 600, columns: 8, gutterWidth: 16 },
md: { name: 'md', minViewportWidth: 768, columns: 8, gutterWidth: 24 },
lg: { name: 'lg', minViewportWidth: 1024, columns: 12, gutterWidth: 24 },
xl: { name: 'xl', minViewportWidth: 1280, columns: 12, gutterWidth: 24 },
xxl: { name: 'xxl', minViewportWidth: 1600, columns: 12, gutterWidth: 24 },
xxxl: { name: 'xxxl', minViewportWidth: 1920, columns: 12, gutterWidth: 24 },
};
19 changes: 18 additions & 1 deletion packages/fuselage-tokens/breakpoints.scss
Original file line number Diff line number Diff line change
@@ -1,26 +1,43 @@
$breakpoints: (
xs: (
name: xs,
min-viewport-width: null,
columns: 4,
gutter-width: 16,
),
sm: (
name: sm,
min-viewport-width: 600,
columns: 8,
gutter-width: 16,
),
md: (
name: md,
min-viewport-width: 768,
columns: 8,
gutter-width: 24,
),
lg: (
name: lg,
min-viewport-width: 1024,
columns: 12,
gutter-width: 24,
),
xl: (
min-viewport-width: 1440,
name: xl,
min-viewport-width: 1280,
columns: 12,
gutter-width: 24,
),
xxl: (
name: xxl,
min-viewport-width: 1600,
columns: 12,
gutter-width: 24,
),
xxxl: (
name: xxxl,
min-viewport-width: 1920,
columns: 12,
gutter-width: 24,
),
Expand Down
Loading

0 comments on commit f9c3449

Please sign in to comment.