@codecademy/brand 3.40.0 → 4.0.0-alpha.14deb86052.0

package/dist/stories/Molecules/ErrorContents.stories.js

@@ -1,19 +0,0 @@
-import { ErrorContents } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: ErrorContents
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(ErrorContents, {
-    ...args
-  }),
-  name: 'ErrorContents'
-};
-export const SupportInformation = {
-  render: args => /*#__PURE__*/_jsx(ErrorContents, {
-    ...args,
-    supportInformation: [['User ID', 'abc123'], ['Timestamp', '123456789']]
-  }),
-  name: 'SupportInformation'
-};

package/dist/stories/Molecules/GridCollapse.stories.js

@@ -1,42 +0,0 @@
-import { FlexBox } from '@codecademy/gamut';
-import { GridCollapse } from '../../index';
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: GridCollapse,
-  args: {
-    as: 'ol',
-    columnCount: {
-      _: 3
-    },
-    initialMaxShown: {
-      _: 6
-    },
-    pageSize: {
-      _: 6
-    },
-    onExpandClick: () => {},
-    expandLabel: 'Show more',
-    collapseLabel: 'Show fewer',
-    gap: 8
-  }
-};
-export default meta;
-const Item = ({
-  number
-}) => /*#__PURE__*/_jsxs(FlexBox, {
-  as: "li",
-  p: 8,
-  background: "#eee",
-  borderRadius: "md",
-  center: true,
-  children: ["Item ", number + 1]
-});
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(GridCollapse, {
-    ...args,
-    children: [...Array(20)].map((_, i) => /*#__PURE__*/_jsx(Item, {
-      number: i
-    }))
-  }),
-  name: 'GridCollapse'
-};

package/dist/stories/Molecules/HorizontalScrollMenu.examples.d.ts

@@ -1 +0,0 @@
-export declare const HorizontalScrollMenuExample: () => import("react/jsx-runtime").JSX.Element;

package/dist/stories/Molecules/HorizontalScrollMenu.examples.js

@@ -1,67 +0,0 @@
-import { Box, ContentContainer } from '@codecademy/gamut';
-import { ContainerDifficulty, CurriculumCard, HorizontalScrollMenu } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const courseData = [{
-  id: 'a',
-  title: 'JavaScript',
-  difficulty: ContainerDifficulty.Beginner,
-  scope: {
-    Lesson: 24
-  },
-  text: 'course'
-}, {
-  id: 'b',
-  title: 'Python',
-  difficulty: ContainerDifficulty.Beginner,
-  scope: {
-    Lesson: 32
-  },
-  text: 'course'
-}, {
-  id: 'c',
-  title: 'Go',
-  difficulty: ContainerDifficulty.Beginner,
-  scope: {
-    Lesson: 5
-  },
-  text: 'course'
-}, {
-  id: 'd',
-  title: 'React',
-  difficulty: ContainerDifficulty.Beginner,
-  scope: {
-    Lesson: 18
-  },
-  text: 'course'
-}, {
-  id: 'e',
-  title: 'Intro to Django',
-  difficulty: ContainerDifficulty.Beginner,
-  scope: {
-    Lesson: 29
-  },
-  text: 'course'
-}, {
-  id: 'f',
-  title: 'PHP',
-  difficulty: ContainerDifficulty.Beginner,
-  scope: {
-    Lesson: 52
-  },
-  text: 'course'
-}];
-export const HorizontalScrollMenuExample = () => {
-  return /*#__PURE__*/_jsx(ContentContainer, {
-    my: 32,
-    children: /*#__PURE__*/_jsx(HorizontalScrollMenu, {
-      children: courseData.map(props => /*#__PURE__*/_jsx(Box, {
-        minWidth: 400,
-        maxWidth: 400,
-        mx: 16,
-        children: /*#__PURE__*/_jsx(CurriculumCard, {
-          ...props
-        })
-      }, props.id))
-    })
-  });
-};

package/dist/stories/Molecules/HorizontalScrollMenu.stories.js

@@ -1,11 +0,0 @@
-import { HorizontalScrollMenu } from '../../index';
-import { HorizontalScrollMenuExample } from './HorizontalScrollMenu.examples';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: HorizontalScrollMenu
-};
-export default meta;
-export const Default = {
-  render: () => /*#__PURE__*/_jsx(HorizontalScrollMenuExample, {}),
-  name: 'Horizontal Scroll Menu'
-};

package/dist/stories/Molecules/HubCard.stories.js

@@ -1,27 +0,0 @@
-import { HubCard } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: HubCard,
-  args: {
-    title: 'Subject Title',
-    eyebrowTitle: 'Card Eyebrow',
-    backgroundPosition: 'left',
-    backgroundImage: 'https://static-assets.codecademy.com/assets/components/cards/explore-category-card/language/javascript.svg'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(HubCard, {
-    ...args
-  }),
-  name: 'HubCard'
-};
-export const BackgroundRight = {
-  render: args => /*#__PURE__*/_jsx(HubCard, {
-    ...args
-  }),
-  args: {
-    backgroundImage: 'https://static-assets.codecademy.com/assets/components/cards/explore-category-card/subject/data-science.svg',
-    backgroundPosition: 'right'
-  }
-};

package/dist/stories/Molecules/InfoCard.stories.js

@@ -1,30 +0,0 @@
-import { InfoCard } from '../../index';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: InfoCard,
-  args: {
-    topText: 'Portfolio Project ',
-    title: 'Portfolio Website',
-    subtitle: 'This is a portfolio project.',
-    body: "In this project, you'll use knowledge of Express.js to build a small JSON API to serve up famous and interesting quotes about computers, technology, and programming.",
-    href: 'https://www.codecademy.com/learn'
-  }
-};
-export default meta;
-export const Default = {
-  render: args => /*#__PURE__*/_jsx(InfoCard, {
-    ...args
-  }),
-  name: 'Info Card'
-};
-export const InfoCardWithBottomTags = {
-  render: args => /*#__PURE__*/_jsx(InfoCard, {
-    ...args
-  }),
-  name: 'Info Card with bottom tags',
-  args: {
-    bottomLeftText: 'Independent, 5hrs',
-    bottomRightTagText: 'Portfolio Ready',
-    bottomRightTagColor: 'pink'
-  }
-};

package/dist/stories/Molecules/LearningOutcomeAssessmentScores.stories.js

@@ -1,23 +0,0 @@
-import { LearningOutcomeAssessmentScores } from '../../LearningOutcomeAssessmentScores';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: LearningOutcomeAssessmentScores,
-  args: {}
-};
-export default meta;
-export const Example = () => {
-  return /*#__PURE__*/_jsx(LearningOutcomeAssessmentScores, {
-    highestScore: 100,
-    highestScoreAchievedAt: "10/01",
-    latestScore: 50,
-    latestScoreAchievedAt: "10/23"
-  });
-};
-export const NoScores = () => {
-  return /*#__PURE__*/_jsx(LearningOutcomeAssessmentScores, {
-    highestScore: null,
-    highestScoreAchievedAt: null,
-    latestScore: null,
-    latestScoreAchievedAt: null
-  });
-};

package/dist/stories/Molecules/LearningOutcomeCard.stories.js

@@ -1,189 +0,0 @@
-import { FlexBox } from '@codecademy/gamut';
-import { LearningOutcomeCard } from '../../LearningOutcomeCard';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: LearningOutcomeCard,
-  args: {
-    outcome: 'Implement sorting algorithms in Java.'
-  }
-};
-export default meta;
-export const Base = {
-  render: args => /*#__PURE__*/_jsxs(FlexBox, {
-    gap: 16,
-    children: [/*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 1
-    }), /*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 2
-    }), /*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 3
-    })]
-  }),
-  name: 'Base card'
-};
-export const BaseCardWithHover = {
-  render: args => /*#__PURE__*/_jsxs(FlexBox, {
-    gap: 16,
-    children: [/*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 1,
-      isInteractive: true
-    }), /*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 2,
-      isInteractive: true
-    }), /*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 3,
-      isInteractive: true
-    })]
-  }),
-  name: 'Base card with hover'
-};
-export const BaseCardWithTopics = {
-  render: args => /*#__PURE__*/_jsxs(FlexBox, {
-    gap: 16,
-    children: [/*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 1,
-      skills: [{
-        title: 'java'
-      }, {
-        title: 'skill'
-      }, {
-        title: 'computer science'
-      }]
-    }), /*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 2,
-      skills: [{
-        title: 'java'
-      }, {
-        title: 'skill'
-      }, {
-        title: 'computer science'
-      }]
-    }), /*#__PURE__*/_jsx(LearningOutcomeCard, {
-      ...args,
-      level: 3,
-      skills: [{
-        title: 'java'
-      }, {
-        title: 'skill'
-      }, {
-        title: 'computer science'
-      }]
-    })]
-  }),
-  name: 'Base card with topics'
-};
-export const EmphasizedCard = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 1,
-    mode: "emphasized"
-  }),
-  name: 'Emphasized card'
-};
-export const EmphasizedCardWithHover = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 2,
-    mode: "emphasized",
-    isInteractive: true
-  }),
-  name: 'Emphasized card with hover'
-};
-export const EmphasizedCardWithTopics = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 3,
-    skills: [{
-      title: 'java'
-    }, {
-      title: 'skill'
-    }, {
-      title: 'computer science'
-    }],
-    mode: "emphasized",
-    isInteractive: true
-  }),
-  name: 'Emphasized card with topics'
-};
-export const EmphasizedCardWithProgress = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 2,
-    progress: 60,
-    skills: [{
-      title: 'java'
-    }, {
-      title: 'skill'
-    }, {
-      title: 'computer science'
-    }],
-    mode: "emphasized",
-    isInteractive: true
-  }),
-  name: 'Emphasized card with progress'
-};
-export const EmphasizedCardWithProgress100 = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 3,
-    progress: 100,
-    skills: [{
-      title: 'java'
-    }, {
-      title: 'skill'
-    }, {
-      title: 'computer science'
-    }],
-    mode: "emphasized",
-    isInteractive: true
-  }),
-  name: 'Emphasized card with 100% progress'
-};
-export const EmphasizedCardWithProgressAnimation = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 2,
-    progress: 80,
-    progressUpdateData: {
-      previousProgress: 50,
-      progressDuration: 500
-    },
-    skills: [{
-      title: 'java'
-    }, {
-      title: 'skill'
-    }, {
-      title: 'computer science'
-    }],
-    mode: "emphasized"
-  }),
-  name: 'Emphasized card with progress with animation'
-};
-export const EmphasizedCardWithProgress100Animation = {
-  render: args => /*#__PURE__*/_jsx(LearningOutcomeCard, {
-    ...args,
-    level: 2,
-    progress: 100,
-    progressUpdateData: {
-      previousProgress: 50,
-      completionDelay: 500
-    },
-    skills: [{
-      title: 'java'
-    }, {
-      title: 'skill'
-    }, {
-      title: 'computer science'
-    }],
-    mode: "emphasized"
-  }),
-  name: 'Emphasized card with 100% progress with animation'
-};

package/dist/stories/Molecules/LearningOutcomeFlyout.stories.js

@@ -1,62 +0,0 @@
-import { FillButton, FlexBox } from '@codecademy/gamut';
-import { useState } from 'react';
-import { LearningOutcomeFlyout } from '../../LearningOutcomeFlyout';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: LearningOutcomeFlyout,
-  args: {}
-};
-export default meta;
-export const Example = () => {
-  const [isExpanded, setIsExpanded] = useState(false);
-  const toggleOpen = () => setIsExpanded(!isExpanded);
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(FillButton, {
-      onClick: toggleOpen,
-      children: "Open Flyout"
-    }), /*#__PURE__*/_jsx(FlexBox, {
-      width: "100%",
-      children: /*#__PURE__*/_jsx(LearningOutcomeFlyout, {
-        expanded: isExpanded,
-        learningOutcome: {
-          highestScore: 100,
-          highestScoreAchievedAt: '10/01',
-          latestScore: 68,
-          latestScoreAchievedAt: '10/01',
-          level: 2,
-          outcome: 'Understand the basics of React',
-          percentComplete: 75,
-          parentLOs: [{
-            id: '1',
-            outcome: 'Build a React component',
-            level: 3
-          }, {
-            id: '2',
-            outcome: 'Manage state in React',
-            level: 3
-          }],
-          childLearningOutcomes: [{
-            id: '3',
-            outcome: 'Understand JSX components',
-            percentComplete: 100
-          }, {
-            id: '4',
-            outcome: 'Create a React form',
-            percentComplete: 50
-          }, {
-            id: '5',
-            outcome: 'Pass through props to a component',
-            percentComplete: 0
-          }]
-        },
-        learningOutcomeHref: "/learning-outcomes/123",
-        onClose: () => setIsExpanded(false),
-        bestMatchResponse: {
-          data: null,
-          loading: false,
-          error: false
-        }
-      })
-    })]
-  });
-};

package/dist/stories/Molecules/LearningOutcomeLevelBadge.stories.js

@@ -1,20 +0,0 @@
-import { FlexBox } from '@codecademy/gamut';
-import { LearningOutcomeLevelBadge } from '../../LearningOutcomeBadges';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: LearningOutcomeLevelBadge
-};
-export default meta;
-export const AllLevels = {
-  render: () => /*#__PURE__*/_jsxs(FlexBox, {
-    gap: 16,
-    children: [/*#__PURE__*/_jsx(LearningOutcomeLevelBadge, {
-      level: 1
-    }), /*#__PURE__*/_jsx(LearningOutcomeLevelBadge, {
-      level: 2
-    }), /*#__PURE__*/_jsx(LearningOutcomeLevelBadge, {
-      level: 3
-    })]
-  }),
-  name: 'Learning Outcome Level Badge - All Levels'
-};

package/dist/stories/Molecules/LearningOutcomeLowAssessmentBadge.stories.js

@@ -1,10 +0,0 @@
-import { LearningOutcomeLowAssessmentBadge } from '../../LearningOutcomeBadges';
-import { jsx as _jsx } from "react/jsx-runtime";
-const meta = {
-  component: LearningOutcomeLowAssessmentBadge
-};
-export default meta;
-export const Default = {
-  render: () => /*#__PURE__*/_jsx(LearningOutcomeLowAssessmentBadge, {}),
-  name: 'Learning Outcome Low Assessment Badge - Default'
-};

package/dist/stories/Molecules/LearningOutcomePopover.stories.js

@@ -1,39 +0,0 @@
-import { Box, FillButton, FlexBox } from '@codecademy/gamut';
-import { useRef, useState } from 'react';
-import { LearningOutcomePopover } from '../../LearningOutcomePopover';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-const meta = {
-  component: LearningOutcomePopover,
-  args: {}
-};
-export default meta;
-export const Example = () => {
-  const [open, setOpen] = useState(false);
-  const activeElRef = useRef(null);
-  const toggleOpen = () => setOpen(!open);
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Box, {
-      ref: activeElRef,
-      children: /*#__PURE__*/_jsx(FillButton, {
-        onClick: toggleOpen,
-        children: "Open Popover"
-      })
-    }), /*#__PURE__*/_jsx(FlexBox, {
-      width: "100%",
-      children: /*#__PURE__*/_jsx(LearningOutcomePopover, {
-        id: "learning-outcome-popover",
-        activeElRef: activeElRef,
-        isOpen: open,
-        learningOutcomeDetails: {
-          id: '1',
-          level: 2,
-          outcome: 'Understand the basics of React',
-          latestScore: 68,
-          highestScore: 100,
-          percentComplete: 75
-        },
-        horizontalOffset: 90
-      })
-    })]
-  });
-};