-
7 |
- 10 | This is an error message 11 | 12 |
-
20 |
- 23 | This is an error message 24 | 25 |
7 |
10 |
12 | `;
13 |
14 | exports[`Notifications Dropdown should match the snapshot with notifications 1`] = `
15 |
18 |
21 |
23 | `;
24 |
--------------------------------------------------------------------------------
/src/forms/redux-form/textarea.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import ReduxFormTextarea from './Textarea';
4 |
5 | describe('redux-form Textarea', () => {
6 | const formAttrs = {
7 | input: {
8 | id: 'heroField',
9 | label: 'Super Hero',
10 | name: 'superhero',
11 | value: 'Wonder Woman and Robin',
12 | maxLength: 20,
13 | required: true,
14 | },
15 | meta: {
16 | error: 'Did you mean Batman and Robin?',
17 | },
18 | };
19 |
20 | it('renders a Textarea component with expected attributes from mock data', () => {
21 | const component = shallow(9 | Name of the group 10 |
11 |
12 |
13 | In progress
14 |
15 |
19 |
20 | Finish group
21 |
22 |
23 |
30 | 15 | {remainingChars} 16 |
17 | ); 18 | }; 19 | 20 | CharCounter.propTypes = { 21 | maxLength: PropTypes.number.isRequired, 22 | valueLength: PropTypes.number.isRequired, 23 | }; 24 | 25 | export default DeprecationWarning(CharCounter); 26 | -------------------------------------------------------------------------------- /jest.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "collectCoverageFrom": [ 3 | "src/**/*.{js,jsx}", 4 | "!**/{node_modules,lib,coverage,assets,utils}/**", 5 | "!**/*.story.{js,jsx}" 6 | ], 7 | "coverageDirectory": "
10 |
14 |
20 |
27 | Your toast is ready
28 |
29 |
30 |
31 |
32 | `;
33 |
--------------------------------------------------------------------------------
/__mocks__/textContentMocks.js:
--------------------------------------------------------------------------------
1 | export const textContent1 = 'Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.';
2 | export const textContent2 = 'Classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.';
3 |
--------------------------------------------------------------------------------
/src/forms/errorList.story.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ErrorList from './ErrorList';
3 | import Bounds from '../layout/Bounds';
4 | import { decorateWithInfo } from '../utils/decorators';
5 | import { storiesOf } from '@storybook/react';
6 |
7 | storiesOf('Forms/ErrorList', module)
8 | .addDecorator(decorateWithInfo)
9 | .addParameters({ info: { propTablesExclude: [Bounds] } })
10 | .add(
11 | 'Single Error',
12 | () => (
13 |
19 | {props.children}
20 |
21 | );
22 |
23 | /**
24 | * StoryLink
25 | *
26 | * `Link` component for use in stories
27 | * where a router context is not necessary
28 | *
29 | * Also disables link from being followed on click
30 | */
31 | export const StoryLink = props => (
32 |
37 | {props.children}
38 |
39 | );
40 |
--------------------------------------------------------------------------------
/assets/scss/components/_radio.scss:
--------------------------------------------------------------------------------
1 | .radio-container {
2 | align-items: center;
3 | display: flex;
4 | input {
5 | display: none;
6 | }
7 | }
8 |
9 | .radio {
10 | align-items: center;
11 | border: 1px solid $C_secondary;
12 | border-radius: 50%;
13 | box-sizing: border-box;
14 | cursor: pointer;
15 | display: flex;
16 | height: 19px;
17 | justify-content: center;
18 | margin: 0 $space-half 0 0;
19 | width: 19px;
20 |
21 | @include browser-lessThanIE(10) {
22 | top: $space / 2;
23 | }
24 |
25 | &.checked {
26 | background-color: $C_viridian;
27 | }
28 | &.disabled {
29 | background-color: var(--color-gray-3);
30 | border-color: var(--color-gray-3);
31 | span {
32 | background-color: var(--color-gray-3);
33 | }
34 | }
35 | }
36 |
37 | .radio-indicator {
38 | background-color: white;
39 | display: block;
40 | height: 7px;
41 | width: 7px;
42 | }
43 |
--------------------------------------------------------------------------------
/src/forms/__snapshots__/inputTime.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`InputTime InputTime, with input[time] support renders a with expected props 1`] = `
4 |
5 |
14 |
15 | `;
16 |
17 | exports[`InputTime InputTime, with input[time] support renders error state as expected 1`] = `
18 |
19 |
30 |
31 | `;
32 |
--------------------------------------------------------------------------------
/src/utils/decorators.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { withInfo } from '@storybook/addon-info';
3 |
4 | export const decorateWithBasics = story => {
5 | /*
6 | * -- Inline SVG icon sprite --
7 | *
8 | * raw SVG sprite from `swarm-icons`
9 | */
10 | const iconSpriteStyle = { display: 'none' };
11 | const iconSprite = require('raw-loader!swarm-icons/dist/sprite/sprite.inc');
12 | const styles = {
13 | display: 'flex',
14 | alignItems: 'center',
15 | justifyContent: 'center',
16 | height: '100%',
17 | width: '100%',
18 | };
19 |
20 | return (
21 |
22 |
26 | {story()}
27 |
28 | );
29 | };
30 |
31 | export const decorateWithInfo = (story, context) =>
32 | withInfo(`${context.story} ${context.kind}`)(story)(context);
33 |
--------------------------------------------------------------------------------
/assets/svg/proDashboard.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/src/forms/radioButton.story.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { storiesOf } from '@storybook/react';
3 | import { decorateWithBasics, decorateWithInfo } from '../utils/decorators';
4 | import { withKnobs, text, boolean } from '@storybook/addon-knobs';
5 |
6 | import RadioButton from './RadioButton';
7 |
8 | storiesOf('Forms/RadioButton', module)
9 | .addDecorator(withKnobs)
10 | .addDecorator(decorateWithBasics)
11 | .addDecorator(decorateWithInfo)
12 | .add(
13 | 'Basic usage',
14 | () => (
15 |
12 |
40 |
41 | `;
42 |
--------------------------------------------------------------------------------
/src/utils/components/__snapshots__/withLoading.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`withLoading matches snapshot with 0 children 1`] = `-
24 | {error &&
- {error} } 25 |
5 |
16 | `;
17 |
18 | exports[`withErrorList wrapped component matches snapshot for component without error prop 1`] = `
19 |
20 |
29 | `;
30 |
31 | exports[`withErrorList wrapped component matches snapshot for component without id or error props 1`] = `
32 |
33 |
38 | `;
39 |
--------------------------------------------------------------------------------
/flow-typed/npm/eslint-loader_vx.x.x.js:
--------------------------------------------------------------------------------
1 | // flow-typed signature: d92166a7bbf7934aa572327b22cbd1f8
2 | // flow-typed version: <{groupDraft.name}
15 |
16 | {groupDraft.status}
17 |
18 | {groupDraft.actionTitle}{' '}
19 |
22 |
11 | I have something to say
12 |
14 | ))
15 | .add('right-aligned', () => (
16 | This text is evenly spaced from the border
13 |
17 | I have something to say
18 |
20 | ))
21 | .add('center-aligned', () => (
22 | This text is evenly spaced from the border
19 |
23 | I have something to say
24 |
26 | ))
27 | .add('custom heading tag', () => (
28 | This text is evenly spaced from the border
25 |
29 | I'm wrapped in h1
30 |
32 | ));
33 |
--------------------------------------------------------------------------------
/src/__snapshots__/hscroll.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Default Hscroll exists 1`] = `
4 | This text is evenly spaced from the border
31 |
8 |
62 | `;
63 |
--------------------------------------------------------------------------------
/src/forms/__snapshots__/togglePill.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`TogglePill renders a component with expected attributes 1`] = `
4 |
11 |
61 |
14 |
60 |
17 | item
18 |
19 |
22 | item
23 |
24 |
27 | item
28 |
29 |
32 | item
33 |
34 |
37 | item
38 |
39 |
42 | item
43 |
44 |
47 | item
48 |
49 |
52 | item
53 |
54 |
57 | item
58 |
59 | {title}
35 |
39 | {children}
40 |
41 | );
42 | }
43 | }
44 |
45 | const Chunk = withLoading(ChunkComponent);
46 | Chunk.displayName = 'Chunk';
47 | export default Chunk;
48 |
--------------------------------------------------------------------------------
/src/forms/togglepill.story.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { storiesOf, action } from '@storybook/react';
3 | import { decorateWithBasics, decorateWithInfo } from '../utils/decorators';
4 | import TogglePill from './TogglePill';
5 |
6 | const onChange = e => {
7 | action(`The value of the Toggle Pill clicked is: ${e.target.value}`)(e);
8 | };
9 |
10 | storiesOf('Forms/TogglePill', module)
11 | .addDecorator(decorateWithBasics)
12 | .addDecorator(decorateWithInfo)
13 | .addParameters({ info: { propTables: [TogglePill] } })
14 | .add('default', () => (
15 |
16 |
22 | Toggle Pill Label
23 |
24 |
25 | ))
26 | .add('Default Selected', () => (
27 |
39 |
46 | Toggle Pill Label
47 |
48 |
49 | ));
50 |
--------------------------------------------------------------------------------
/assets/svg/host-badge.svg:
--------------------------------------------------------------------------------
1 |
5 |
--------------------------------------------------------------------------------
/src/navigation/components/notifications/__snapshots__/Notifications.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Notification component should match snapshot 1`] = `
4 |
8 | Meetup Engineering just announced a new Meetup for Apr 6. Only 13 spots.", 27 | } 28 | } 29 | /> 30 |
33 |
53 | {children}
54 |
55 | );
56 | }
57 | }
58 |
59 | const Bounds = withLoading(BoundsComponent);
60 | Bounds.displayName = 'Bounds';
61 | export default Bounds;
62 |
--------------------------------------------------------------------------------
/src/navigation/components/profile/ProfileDropdown.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { MOCK_GROUP } from 'meetup-web-mocks/lib/api';
3 | import { shallow } from 'enzyme';
4 |
5 | import ProfileDropdown from './ProfileDropdown';
6 |
7 | const MOCK_PROPS = {
8 | groupHome: jest.fn(),
9 | groups: [
10 | { ...MOCK_GROUP, name: 'hello 1', urlname: '1111', id: '1111' },
11 | { ...MOCK_GROUP, name: 'hello 2', urlname: '2222', id: '2222' },
12 | { ...MOCK_GROUP, name: 'hello 3', urlname: '3333', id: '3333' },
13 | { ...MOCK_GROUP, name: 'hello 4', urlname: '4444', id: '4444' },
14 | ],
15 | allGroupsLabel: 'All Groups',
16 | allGroupsLink: 'meetup.com/find',
17 | profile: {
18 | link: 'meetup.com',
19 | label: 'Profile',
20 | },
21 | payments: {
22 | link: 'meetup.com',
23 | label: 'Payments made',
24 | },
25 | settings: {
26 | link: 'meetup.com',
27 | label: 'Settings',
28 | },
29 | help: {
30 | link: 'meetup.com',
31 | label: 'Help',
32 | },
33 | logout: {
34 | link: 'meetup.com',
35 | label: 'Logout',
36 | },
37 | savedEvents: {
38 | link: 'meetup.com',
39 | label: 'Saved events',
40 | },
41 | yourGroups: {
42 | link: 'meetup.com',
43 | label: 'Your groups',
44 | },
45 | yourEvents: {
46 | link: 'meetup.com',
47 | label: 'Your events',
48 | },
49 | };
50 |
51 | describe('Profile Dropdown', () => {
52 | const wrapper = shallow(