@codecademy/brand 4.0.0 → 5.0.0-alpha.19accb830.0

package/dist/stories/Molecules/NotificationList.stories.js

@@ -1,99 +0,0 @@
-import { action } from 'storybook/actions';
-import { NotificationList } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const notifications = [{
-  campaign: 'python-livestream',
-  date: '5 minutes',
-  type: 'curriculum_blast',
-  id: 'abc',
-  link: 'https://www.codecademy.com/courses/livestreams/projects/livestream-intro-to-statistics-in-python',
-  text: 'Check out our Python livestream!'
-}, {
-  campaign: 'pro-trial',
-  type: 'marketing_blast',
-  date: '3 hours',
-  id: '1237',
-  text: 'Meet your fellow learners and stay motivated. Join the conversation in your cohort!'
-}, {
-  campaign: 'cohort v0.2',
-  date: '1 hour',
-  id: '333',
-  text: 'Welcome to you Front-End Cohort!',
-  type: 'cohort_blast'
-}, {
-  campaign: 'other-notification',
-  date: '2 days',
-  id: '1234',
-  link: 'http://google.com',
-  imageUrl: 'https://bit.ly/2Ckp4eW',
-  text: 'notiifcation with img url provided'
-}, {
-  campaign: 'discourse-comment',
-  date: '1 hour',
-  id: '333',
-  link: 'https://discuss.codecademy.com',
-  text: 'discourse comment notification',
-  type: 'forum_comment'
-}, {
-  campaign: 'discourse-message',
-  date: '1 minute',
-  id: '444',
-  link: 'https://discuss.codecademy.com',
-  text: 'discourse message notification',
-  type: 'forum_message'
-}, {
-  campaign: 'discourse-mention',
-  date: '10 minutes',
-  id: '444',
-  link: 'https://discuss.codecademy.com',
-  text: 'discourse mention notification',
-  type: 'forum_mention'
-}, {
-  campaign: 'discourse-like',
-  date: '3 minutes',
-  id: '555',
-  link: 'https://discuss.codecademy.com',
-  text: 'discourse like notification',
-  type: 'forum_like'
-}, {
-  campaign: 'pro-trial',
-  date: '3 hours',
-  id: '123',
-  text: 'Notification with no image or type provided; default Bell icon!'
-}, {
-  campaign: 'same-tab',
-  date: '5 hours',
-  id: '1',
-  link: window.location.origin,
-  text: 'Notification with an internal link (opens in the same tab)'
-}, {
-  campaign: 'new-tab',
-  date: '5 hours',
-  id: '2',
-  link: 'https://help.codecademy.com',
-  text: 'Notification with an external link (opens in a new tab)'
-}];
-const meta = {
-  component: NotificationList,
-  args: {
-    notifications,
-    onDismiss: () => {
-      action('notification dismissed');
-    }
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(NotificationList, {
-    ...args
-  }),
-  name: 'NotificationList'
-};
-export const Empty = {
-  render: args => /*#__PURE__*/_jsx(NotificationList, {
-    ...args
-  }),
-  args: {
-    notifications: []
-  }
-};

package/dist/stories/Molecules/PageSection.stories.js

@@ -1,67 +0,0 @@
-import { FillButton, IconButton, StrokeButton } from '@codecademy/gamut';
-import { SearchIcon } from '@codecademy/gamut-icons';
-import { PageSection } from '../../index';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: PageSection,
-  args: {
-    title: 'Page Section Title Text'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(PageSection, {
-      ...args,
-      title: "Section 1 Title",
-      children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum pulvinar urna at orci bibendum pharetra. Sed nec nibh id nulla molestie vestibulum. Proin efficitur venenatis vulputate. Morbi dolor odio, efficitur in volutpat nec, pharetra at dolor. Maecenas imperdiet, augue eget congue feugiat, diam sapien consequat tellus, id rutrum odio velit eu libero. Suspendisse auctor mauris metus, sed convallis ipsum facilisis id."
-    }), /*#__PURE__*/_jsx(PageSection, {
-      ...args,
-      title: "Section 2 Title",
-      children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum pulvinar urna at orci bibendum pharetra. Sed nec nibh id nulla molestie vestibulum. Proin efficitur venenatis vulputate. Morbi dolor odio, efficitur in volutpat nec, pharetra at dolor. Maecenas imperdiet, augue eget congue feugiat, diam sapien consequat tellus, id rutrum odio velit eu libero. Suspendisse auctor mauris metus, sed convallis ipsum facilisis id."
-    })]
-  }),
-  name: 'PageSection'
-};
-export const PageSectionWithHeaderAndFooterButtons = {
-  render: args => /*#__PURE__*/_jsx(PageSection, {
-    ...args,
-    headerButton: {
-      text: 'Edit',
-      href: '',
-      onClick: () => {}
-    },
-    headerSecondaryButton: {
-      text: 'Share',
-      href: '',
-      onClick: () => {}
-    },
-    footerButton: {
-      text: 'Show more',
-      href: '',
-      onClick: () => {}
-    },
-    children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum pulvinar urna at orci bibendum pharetra. Sed nec nibh id nulla molestie vestibulum. Proin efficitur venenatis vulputate. Morbi dolor odio, efficitur in volutpat nec, pharetra at dolor. Maecenas imperdiet, augue eget congue feugiat, diam sapien consequat tellus, id rutrum odio velit eu libero. Suspendisse auctor mauris metus, sed convallis ipsum facilisis id..."
-  }),
-  name: 'PageSection with Header and Footer Buttons'
-};
-export const PageSectionWithCustomHeaderAndFooterButtons = {
-  render: args => /*#__PURE__*/_jsx(PageSection, {
-    ...args,
-    headerButton: /*#__PURE__*/_jsx(IconButton, {
-      icon: SearchIcon,
-      tip: "Search Codecademy content",
-      tipProps: {
-        alignment: 'bottom-center'
-      }
-    }),
-    headerSecondaryButton: /*#__PURE__*/_jsx(FillButton, {
-      children: "Share"
-    }),
-    footerButton: /*#__PURE__*/_jsx(StrokeButton, {
-      children: "NEXT"
-    }),
-    children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum pulvinar urna at orci bibendum pharetra. Sed nec nibh id nulla molestie vestibulum. Proin efficitur venenatis vulputate. Morbi dolor odio, efficitur in volutpat nec, pharetra at dolor. Maecenas imperdiet, augue eget congue feugiat, diam sapien consequat tellus, id rutrum odio velit eu libero. Suspendisse auctor mauris metus, sed convallis ipsum facilisis id..."
-  }),
-  name: 'PageSection with custom Header and Footer Buttons'
-};

package/dist/stories/Molecules/PastDueModalContents.stories.js

@@ -1,62 +0,0 @@
-import { Alert, FillButton, TextButton } from '@codecademy/gamut';
-import { pastDueErrorMessages, PastDueModalContents } from '../../index';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: PastDueModalContents,
-  argTypes: {
-    pastDueErrorCode: {
-      options: ['default', 'declined', 'insufficient_funds', 'temporary_hold', 'invalid_transaction', 'invalid_account_number', 'expired_card'],
-      control: {
-        type: 'select'
-      }
-    },
-    closeButton: {
-      control: {
-        type: 'boolean'
-      },
-      mapping: {
-        false: '',
-        true: /*#__PURE__*/_jsx(TextButton, {
-          mr: 16,
-          children: "Close"
-        })
-      }
-    },
-    updatePaymentButton: {
-      control: {
-        type: 'boolean'
-      },
-      mapping: {
-        false: '',
-        true: /*#__PURE__*/_jsx(FillButton, {
-          variant: "primary",
-          children: "Update payment"
-        })
-      }
-    },
-    isSilverPlan: {
-      control: 'boolean'
-    }
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(PastDueModalContents, {
-    ...args
-  }),
-  name: 'PastDueModalContents'
-};
-export const ErrorAlert = {
-  render: () => {
-    const {
-      text1,
-      text2
-    } = pastDueErrorMessages(true, true).default;
-    return /*#__PURE__*/_jsxs(Alert, {
-      type: "error",
-      placement: "inline",
-      children: [text1, text2]
-    });
-  },
-  name: 'Error message in alert'
-};

package/dist/stories/Molecules/PausableImage.stories.js

@@ -1,16 +0,0 @@
-import { PausableImage } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: PausableImage
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(PausableImage, {
-    ...args
-  }),
-  name: 'PausableImage',
-  args: {
-    src: '//images.ctfassets.net/go6kr6r0ykrq/2vjTCK9DmJ6BOd5NtFxNIG/e5ced4209aef5241cd581841fa6e2511/learn-css_box-model_06.16.gif',
-    alt: 'demonstration of learning environment'
-  }
-};

package/dist/stories/Molecules/Recurly.stories.js

@@ -1,56 +0,0 @@
-import { GridBox, Text } from '@codecademy/gamut';
-import { CardNumber, CVV, Elements, ExpMonth, ExpYear, RecurlyField, RecurlyProvider } from '../../index';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default {};
-export const Default = {
-  render: () => /*#__PURE__*/_jsx(RecurlyProvider, {
-    publicKey: "test-key",
-    required: [],
-    children: /*#__PURE__*/_jsx(Elements, {
-      children: /*#__PURE__*/_jsxs(GridBox, {
-        gridTemplateColumns: "2fr 1fr 1fr",
-        gap: 16,
-        children: [/*#__PURE__*/_jsx(RecurlyField, {
-          label: "Card number*",
-          children: /*#__PURE__*/_jsx(CardNumber, {})
-        }), /*#__PURE__*/_jsxs(RecurlyField, {
-          label: "Expiration date*",
-          children: [/*#__PURE__*/_jsx(ExpMonth, {}), /*#__PURE__*/_jsx(ExpYear, {})]
-        }), /*#__PURE__*/_jsx(RecurlyField, {
-          label: "CVV*",
-          children: /*#__PURE__*/_jsx(CVV, {})
-        })]
-      })
-    })
-  })
-};
-export const RecurlyFieldStory = {
-  render: () => /*#__PURE__*/_jsx(RecurlyProvider, {
-    publicKey: "test-key",
-    required: [],
-    children: /*#__PURE__*/_jsx(Elements, {
-      children: /*#__PURE__*/_jsxs(GridBox, {
-        gridTemplateColumns: "4rem 1fr",
-        gap: 16,
-        children: [/*#__PURE__*/_jsx(Text, {
-          variant: "title-xs",
-          alignSelf: "center",
-          children: "Error"
-        }), /*#__PURE__*/_jsx(RecurlyField, {
-          label: "Card number*",
-          error: true,
-          children: /*#__PURE__*/_jsx(CardNumber, {})
-        }), /*#__PURE__*/_jsx(Text, {
-          variant: "title-xs",
-          alignSelf: "center",
-          children: "Valid"
-        }), /*#__PURE__*/_jsx(RecurlyField, {
-          label: "Card number*",
-          valid: true,
-          children: /*#__PURE__*/_jsx(CardNumber, {})
-        })]
-      })
-    })
-  }),
-  name: 'Validation'
-};

package/dist/stories/Molecules/ResourceCard.stories.js

@@ -1,18 +0,0 @@
-import { ResourceCard, ResourceType } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: ResourceCard,
-  args: {
-    title: 'Creating a React App',
-    description: 'Use create-react-app to easily create a React application on your computer.',
-    resourceType: ResourceType.Article,
-    headingLevel: 'h3'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(ResourceCard, {
-    ...args
-  }),
-  name: 'ResourceCard'
-};

package/dist/stories/Molecules/SocialMediaSharing.stories.js

@@ -1,20 +0,0 @@
-import { SocialMediaSharing } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: SocialMediaSharing,
-  args: {
-    label: '',
-    mention: 'codecademy',
-    url: 'https://spacejam.com/1996',
-    message: 'Come on and slam, and welcome to the jam',
-    hashtags: ['bball', 'chaosdunk'],
-    size: 'normal'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(SocialMediaSharing, {
-    ...args
-  }),
-  name: 'SocialMediaSharing'
-};

package/dist/stories/Molecules/SocialMediaSharingDropdown.stories.js

@@ -1,20 +0,0 @@
-import { SocialMediaSharingDropdown } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: SocialMediaSharingDropdown,
-  args: {
-    mention: 'codecademy',
-    url: 'https://spacejam.com/1996',
-    message: 'Come on and slam, and welcome to the jam',
-    hashtags: ['bball', 'chaosdunk'],
-    action: () => null,
-    defaultPosition: 'below'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(SocialMediaSharingDropdown, {
-    ...args
-  }),
-  name: 'SocialMediaSharingDropdown'
-};

package/dist/stories/Molecules/Testimonial.stories.js

@@ -1,59 +0,0 @@
-import { FlexBox } from '@codecademy/gamut';
-import { Background } from '@codecademy/gamut-styles';
-import { Testimonial } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: Testimonial,
-  args: {
-    firstName: 'Lacey',
-    lastName: 'Bathala',
-    occupation: 'Data Analyst',
-    quote: "Coding isn't a rocket appliance, it’s just falsely intimidating.",
-    company: 'Microsoft',
-    imageUrl: 'http://images.ctfassets.net/go6kr6r0ykrq/4MdZk5XTPtg52O0uUBDMXB/e829b4fe7ea9e02220c4f86b0a17d7b3/lacey_bathala_480.png?w=120&h=120',
-    href: 'https://www.codecademy.com/learner-stories/data-science/1ogiwGOCDJNRTHczbLsyn8',
-    onClick: () => {
-      // eslint-disable-next-line no-console
-      console.log('You could add event tracking here.');
-    }
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(Testimonial, {
-    ...args
-  }),
-  name: 'Testimonial'
-};
-export const LightMode = {
-  render: args => /*#__PURE__*/_jsx(Testimonial, {
-    ...args
-  })
-};
-export const DarkMode = {
-  render: args => /*#__PURE__*/_jsx(Background, {
-    bg: "navy",
-    children: /*#__PURE__*/_jsx(FlexBox, {
-      p: 16,
-      center: true,
-      children: /*#__PURE__*/_jsx(Testimonial, {
-        hidePhoto: true,
-        variant: "navy",
-        ...args
-      })
-    })
-  })
-};
-export const SmallLight = {
-  render: args => /*#__PURE__*/_jsx(Testimonial, {
-    orientation: "vertical",
-    ...args
-  })
-};
-export const MediumDark = {
-  render: args => /*#__PURE__*/_jsx(Testimonial, {
-    ...args,
-    orientation: "horizontal",
-    hidePhoto: true
-  })
-};

package/dist/stories/Organisms/GlobalFooter.stories.js

@@ -1,28 +0,0 @@
-import { GlobalFooter } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: GlobalFooter,
-  parameters: {
-    layout: 'fullscreen'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(GlobalFooter, {
-    ...args
-  }),
-  name: 'GlobalFooter'
-};
-export const HidePricing = {
-  render: args => /*#__PURE__*/_jsx(GlobalFooter, {
-    hidePricing: true,
-    ...args
-  })
-};
-export const ClickableMadeIn = {
-  render: args => /*#__PURE__*/_jsx(GlobalFooter, {
-    ...args,
-    onMadeInClick: () => {}
-  }),
-  name: 'Clickable MadeIN'
-};

package/dist/stories/Organisms/GlobalHeader/About.stories.js

@@ -1,133 +0,0 @@
-import { Box } from '@codecademy/gamut';
-import { GlobalHeader } from '../../../index';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: GlobalHeader,
-  parameters: {
-    layout: 'fullscreen'
-  },
-  decorators: [Story => {
-    return /*#__PURE__*/_jsx(Box, {
-      width: "100%",
-      children: Story()
-    });
-  }]
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsxs(Box, {
-    position: "relative",
-    zIndex: 0,
-    children: [/*#__PURE__*/_jsx(GlobalHeader, {
-      ...args
-    }), /*#__PURE__*/_jsx(Box, {
-      height: "120vh",
-      bg: "background-primary"
-    })]
-  }),
-  name: 'GlobalHeader',
-  args: {
-    type: 'free',
-    user: {
-      avatar: 'https://www.gravatar.com/avatar/1c959a9a1e2f9f9f1ac06b05cccc1d60?s=150&d=retro',
-      displayName: 'Codey'
-    },
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    }
-  }
-};
-export const GlobalHeaderWithSearchAndNotifications = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    notifications: {
-      actions: {
-        clear: () => null,
-        click: _notification => null,
-        dismiss: _notification => null,
-        read: _notifications => null,
-        track: _target => null
-      },
-      notifications: [],
-      onEnable: () => null
-    },
-    type: "pro",
-    user: {
-      avatar: 'https://www.gravatar.com/avatar/1c959a9a1e2f9f9f1ac06b05cccc1d60?s=150&d=retro',
-      displayName: 'Codey'
-    }
-  }),
-  name: 'GlobalHeader With Search and Notifications'
-};
-export const GlobalHeaderOverBackgroundColor = {
-  render: () => /*#__PURE__*/_jsx(Box, {
-    bg: "beige",
-    width: "100%",
-    children: /*#__PURE__*/_jsx(GlobalHeader, {
-      action: () => {},
-      search: {
-        onEnable: () => {},
-        onSearch: () => {},
-        onTrackingClick: () => {},
-        onSearchAsYouType: () => {}
-      },
-      notifications: {
-        actions: {
-          clear: () => null,
-          click: _notification => null,
-          dismiss: _notification => null,
-          read: _notifications => null,
-          track: _target => null
-        },
-        notifications: [],
-        onEnable: () => null
-      },
-      type: "pro",
-      user: {
-        avatar: 'https://www.gravatar.com/avatar/1c959a9a1e2f9f9f1ac06b05cccc1d60?s=150&d=retro',
-        displayName: 'Codey'
-      }
-    })
-  }),
-  name: 'GlobalHeader Over Background Color'
-};
-export const GlobalHeaderWithAnActionFunction = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: (event, item) => {
-      // eslint-disable-next-line no-console
-      console.log(event);
-      // eslint-disable-next-line no-console
-      console.log(item);
-    },
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "anon"
-  }),
-  name: 'GlobalHeader With an Action Function'
-};
-export const Loading = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "loading"
-  })
-};

package/dist/stories/Organisms/GlobalHeader/Anon.stories.js

@@ -1,71 +0,0 @@
-import { Box } from '@codecademy/gamut';
-import { GlobalHeader } from '../../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: GlobalHeader,
-  parameters: {
-    layout: 'fullscreen'
-  },
-  decorators: [Story => {
-    return /*#__PURE__*/_jsx(Box, {
-      width: "100%",
-      children: Story()
-    });
-  }]
-};
-export default meta;
-export const AnonymousUserDefault = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "anon"
-  }),
-  name: 'Anonymous User - Default'
-};
-export const AnonymousUserLandingPage = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "anon",
-    variant: "landing"
-  }),
-  name: 'Anonymous User - Landing Page'
-};
-export const AnonymousUserLoginPage = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "anon",
-    variant: "login"
-  }),
-  name: 'Anonymous User - Login Page'
-};
-export const AnonymousUserSignupPage = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "anon",
-    variant: "signup"
-  }),
-  name: 'Anonymous User - Signup Page'
-};

package/dist/stories/Organisms/GlobalHeader/Bootcamp.stories.js

@@ -1,29 +0,0 @@
-import { Box } from '@codecademy/gamut';
-import { GlobalHeader } from '../../../GlobalHeader';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: GlobalHeader,
-  parameters: {
-    layout: 'fullscreen'
-  },
-  decorators: [Story => {
-    return /*#__PURE__*/_jsx(Box, {
-      width: "100%",
-      children: Story()
-    });
-  }]
-};
-export default meta;
-export const Bootcamp = {
-  render: () => /*#__PURE__*/_jsx(GlobalHeader, {
-    action: () => {},
-    search: {
-      onEnable: () => {},
-      onSearch: () => {},
-      onTrackingClick: () => {},
-      onSearchAsYouType: () => {}
-    },
-    type: "bootcamp",
-    bootcampSlug: "bootcamp-slug"
-  })
-};