From 0c040e436c8ced96e99acb1cbf9293ede64456a2 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Wed, 29 Jul 2020 17:09:13 -0600 Subject: [PATCH 01/14] Behavior, styles. Needs polish, args --- src/components/TableOfContents.js | 378 ++++++++++++++++++++++ src/components/TableOfContents.stories.js | 115 +++++++ 2 files changed, 493 insertions(+) create mode 100644 src/components/TableOfContents.js create mode 100644 src/components/TableOfContents.stories.js diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js new file mode 100644 index 00000000..1449a43e --- /dev/null +++ b/src/components/TableOfContents.js @@ -0,0 +1,378 @@ +import React, { useEffect, useRef, useState } from 'react'; +import PropTypes from 'prop-types'; +import styled from 'styled-components'; +import { breakpoint, color, typography } from './shared/styles'; +import { Icon } from './Icon'; +import { Link } from './Link'; + +const MENU = 'menu'; +const LINK = 'link'; +const BULLET_LINK = 'bullet-link'; +const ITEM_TYPES = Object.freeze({ + MENU, + LINK, + BULLET_LINK, +}); + +const getItemComponent = (itemType) => { + switch (itemType) { + case ITEM_TYPES.MENU: + return Menu; + case ITEM_TYPES.LINK: + return ItemLink; + case ITEM_TYPES.BULLET_LINK: + return BulletLink; + default: + return null; + } +}; + +const StyledBulletLink = styled(Link)` + margin-left: -22px; + display: inline-block; + padding: 6px 0; + line-height: 1.5; + position: relative; + z-index: 1; + ${(props) => props.isActive && `font-weight: ${typography.weight.bold};`} + + &::after { + position: absolute; + top: 0px; + right: auto; + bottom: 0px; + left: 3px; + width: auto; + height: auto; + border-left: 1px solid ${color.mediumlight}; + content: ''; + z-index: -1; + } +`; + +const BulletLinkWrapper = styled.div` + &:first-of-type ${StyledBulletLink} { + padding-top: 0; + + &::after { + height: 50%; + top: 50%; + } + } + + &:last-of-type ${StyledBulletLink} { + padding-bottom: 0; + + &::after { + height: 50%; + bottom: 50%; + } + } +`; + +const Bullet = styled.span` + display: inline-block; + margin-bottom: 1px; + margin-right: 16px; + background: ${color.medium}; + box-shadow: white 0 0 0 4px; + height: 8px; + width: 8px; + border-radius: 1em; + text-decoration: none !important; + content: ''; + ${(props) => props.isActive && `background: ${color.secondary};`} +`; + +function BulletLink({ currentPath, item, ...rest }) { + const isActive = currentPath === item.path; + + return ( + + + + {item.title} + + + ); +} + +BulletLink.propTypes = { + currentPath: PropTypes.string.isRequired, + item: PropTypes.shape({ + LinkWrapper: PropTypes.node, + path: PropTypes.string.isRequired, + title: PropTypes.string.isRequired, + }).isRequired, +}; + +const TopLevelMenuToggle = styled(Link).attrs({ isButton: true, tertiary: true })` + font-weight: ${typography.weight.bold}; + margin-bottom: 12px; +`; + +const MenuLink = styled(Link)` + color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; + font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; + margin-bottom: 12px; +`; + +const MenuChild = styled.div` + margin-left: 22px; + display: flex; + flex-direction: column; + margin-bottom: 12px; +`; + +const ArrowIcon = styled(Icon)` + width: 14px; + width: 14px; + color: ${color.mediumdark}; + transform: translateY(-1px) ${(props) => props.isOpen && `rotate(90deg)`}; + ${(props) => + props.isTopLevel + ? ` + margin-right: 8px; + ` + : ` + margin-left: 8px; + `} +`; + +function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { + if (!item.children) return null; + const arrow = ; + const MenuToggle = isTopLevel ? TopLevelMenuToggle : MenuLink; + const toggleOpenState = () => setMenuOpenStateById({ id: item.id, isOpen: !item.isOpen }); + + return ( +
+ {isTopLevel && arrow} + {isTopLevel ? ( + {item.title} + ) : ( + + {item.title} + + )} + {!isTopLevel && arrow} + {item.isOpen && ( + + + + )} +
+ ); +} + +Menu.propTypes = { + isTopLevel: PropTypes.bool, + item: PropTypes.shape({ + id: PropTypes.string.isRequired, // Generated by mapItemUIState + isOpen: PropTypes.bool.isRequired, // Generated by mapItemUIState + title: PropTypes.string.isRequired, + children: PropTypes.arrayOf(PropTypes.shape({})), + }).isRequired, + setMenuOpenStateById: PropTypes.func.isRequired, +}; + +Menu.defaultProps = { + isTopLevel: false, +}; + +function ItemLink({ currentPath, item }) { + return ( + + {item.title} + + ); +} + +ItemLink.propTypes = { + currentPath: PropTypes.string.isRequired, + item: PropTypes.shape({ + path: PropTypes.string.isRequired, + LinkWrapper: PropTypes.node, + title: PropTypes.string.isRequired, + }).isRequired, +}; + +function Items({ currentPath, items, ...rest }) { + return ( + <> + {items.map((item) => { + const ItemComponent = getItemComponent(item.type); + return ; + })} + + ); +} + +Items.propTypes = { + currentPath: PropTypes.string.isRequired, + items: PropTypes.arrayOf( + PropTypes.shape({ + type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, + }).isRequired + ).isRequired, +}; + +const Section = styled.section` + position: relative; +`; + +function PureTableOfContents({ className, ...rest }) { + return ( +
+ +
+ ); +} + +PureTableOfContents.propTypes = { + className: PropTypes.string, + currentPath: PropTypes.string.isRequired, + items: PropTypes.arrayOf( + PropTypes.shape({ + type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, + }).isRequired + ).isRequired, +}; + +PureTableOfContents.defaultProps = { + className: '', +}; + +const toKebabcase = (string) => string.toLowerCase().split(' ').join('-'); + +const hasActiveChildren = (children, currentPath) => { + return !!children.find( + (child) => + child.path === currentPath || + (child.children && hasActiveChildren(child.children, currentPath)) + ); +}; + +const getOpenState = ({ + item, + globalItemUpdate = {}, + singleItemUpdate = {}, + currentPath, + didChangeCurrentPath, +}) => { + const withActiveChildren = hasActiveChildren(item.children, currentPath); + // If there is no 'isOpen' field yet, set a default based on whether or not + // any of the children are active. + if (typeof item.isOpen !== 'boolean') return withActiveChildren; + // Path changes should open up a tree for all parents of an active item. + if (didChangeCurrentPath && withActiveChildren) return true; + + if (typeof globalItemUpdate.isOpen === 'boolean') return globalItemUpdate.isOpen; + + if (typeof singleItemUpdate.isOpen === 'boolean' && singleItemUpdate.id === item.id) + return singleItemUpdate.isOpen; + + return item.isOpen; +}; + +const mapItemUIState = (args) => { + const { + items, + currentPath, + didChangeCurrentPath, + depth = 0, + globalItemUpdate, + singleItemUpdate, + } = args; + + return items.map((itemWithoutId) => { + const id = `${toKebabcase(itemWithoutId.title)}-${depth}`; + const item = { ...itemWithoutId, id }; + const isMenuWithChildren = item.type === ITEM_TYPES.MENU && !!item.children; + + return { + ...item, + // The concept of 'isOpen' only applies to menus that have children + ...(isMenuWithChildren && { + isOpen: getOpenState({ + item, + globalItemUpdate, + singleItemUpdate, + currentPath, + didChangeCurrentPath, + }), + }), + // Recursively set the state of children to an infinite depth + ...(item.children && { + children: mapItemUIState({ ...args, items: item.children, depth: depth + 1 }), + }), + }; + }); +}; + +export function TableOfContents({ children, currentPath, items, ...rest }) { + const [itemsWithUIState, setItemsWithUIState] = useState(mapItemUIState({ items, currentPath })); + const toggleAllOpenStates = (isOpen) => + setItemsWithUIState( + mapItemUIState({ items: itemsWithUIState, currentPath, globalItemUpdate: { isOpen } }) + ); + const toggleAllOpen = () => toggleAllOpenStates(true); + const toggleAllClosed = () => toggleAllOpenStates(false); + const setMenuOpenStateById = (args) => + setItemsWithUIState( + mapItemUIState({ items: itemsWithUIState, currentPath, singleItemUpdate: args }) + ); + + const didRunCurrentPathEffectOnMount = useRef(false); + useEffect(() => { + if (didRunCurrentPathEffectOnMount.current) { + setItemsWithUIState( + mapItemUIState({ didChangeCurrentPath: true, items: itemsWithUIState, currentPath }) + ); + } else { + didRunCurrentPathEffectOnMount.current = true; + } + }, [currentPath]); + + const tableOfContentsMenu = ( + + ); + + return typeof children === 'function' + ? children({ menu: tableOfContentsMenu, toggleAllOpen, toggleAllClosed }) + : tableOfContentsMenu; +} + +TableOfContents.propTypes = { + children: PropTypes.func, + currentPath: PropTypes.string.isRequired, + items: PropTypes.arrayOf( + PropTypes.shape({ + type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, + }).isRequired + ).isRequired, +}; + +TableOfContents.propTypes = { + children: undefined, +}; diff --git a/src/components/TableOfContents.stories.js b/src/components/TableOfContents.stories.js new file mode 100644 index 00000000..5f55ecfa --- /dev/null +++ b/src/components/TableOfContents.stories.js @@ -0,0 +1,115 @@ +import React, { useState } from 'react'; +import { TableOfContents } from './TableOfContents'; +import { StoryLinkWrapper } from './StoryLinkWrapper'; + +export default { + title: 'Design System/Table of Contents', + component: TableOfContents, +}; + +const items = [ + { + title: 'Get Started', + type: 'menu', + children: [ + { + path: '/introduction', + title: 'Introduction', + type: 'bullet-link', + }, + { + path: '/setup', + title: 'Setup', + type: 'bullet-link', + }, + ], + }, + { + title: 'Customize', + type: 'menu', + children: [ + { + title: 'User interface', + type: 'menu', + children: [ + { + path: '/features-and-behavior', + title: 'Features and behavior', + type: 'link', + }, + { + path: '/theming', + title: 'Theming', + type: 'link', + }, + ], + }, + { + title: 'Head tags', + type: 'link', + path: '/head-tags', + }, + { + title: 'Body tags', + type: 'link', + path: '/body-tags', + }, + ], + }, +]; + +const findPaths = (pathItems) => pathItems.flatMap((item) => item.path || findPaths(item.children)); +const paths = findPaths(items); + +export const Default = () => ; + +export const DeeplyNestedActivePath = () => ( + +); + +export const LinkWrappers = () => { + const addLinkWrappers = (itemsToCompose) => + itemsToCompose.map((item) => { + if (item.type === 'link' || item.type === 'bullet-link') + return { ...item, LinkWrapper: StoryLinkWrapper }; + if (item.children) return { ...item, children: addLinkWrappers(item.children) }; + return item; + }); + const itemsWithLinkWrappers = addLinkWrappers(items); + return ; +}; + +export const WithOpenControls = () => ( + + {({ menu, toggleAllOpen, toggleAllClosed }) => ( + <> +
+ {/* eslint-disable-next-line react/button-has-type */} + + {/* eslint-disable-next-line react/button-has-type */} + +
+ + {menu} + + )} + +); + +export const WithPathSwitcher = () => { + const [currentPath, setCurrentPath] = useState(paths[0]); + const cyclePath = () => { + const currentIndex = paths.indexOf(currentPath); + setCurrentPath(paths[currentIndex + 1] || paths[0]); + }; + + return ( + <> + {/* eslint-disable-next-line react/button-has-type */} + + + + ); +}; From 86ad2e98dd4ab26c49d409da2c516664d9c8c31b Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 10:13:49 -0600 Subject: [PATCH 02/14] Style polish, keyboard nav --- src/components/TableOfContents.js | 110 ++++++++++++++-------- src/components/TableOfContents.stories.js | 5 + 2 files changed, 74 insertions(+), 41 deletions(-) diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js index 1449a43e..ccb13f7f 100644 --- a/src/components/TableOfContents.js +++ b/src/components/TableOfContents.js @@ -27,8 +27,7 @@ const getItemComponent = (itemType) => { } }; -const StyledBulletLink = styled(Link)` - margin-left: -22px; +const StyledBulletLink = styled(({ isActive, ...rest }) => )` display: inline-block; padding: 6px 0; line-height: 1.5; @@ -52,7 +51,7 @@ const StyledBulletLink = styled(Link)` const BulletLinkWrapper = styled.div` &:first-of-type ${StyledBulletLink} { - padding-top: 0; + margin-top: -6px; &::after { height: 50%; @@ -61,7 +60,7 @@ const BulletLinkWrapper = styled.div` } &:last-of-type ${StyledBulletLink} { - padding-bottom: 0; + margin-bottom: -6px; &::after { height: 50%; @@ -105,7 +104,7 @@ function BulletLink({ currentPath, item, ...rest }) { BulletLink.propTypes = { currentPath: PropTypes.string.isRequired, item: PropTypes.shape({ - LinkWrapper: PropTypes.node, + LinkWrapper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), path: PropTypes.string.isRequired, title: PropTypes.string.isRequired, }).isRequired, @@ -116,7 +115,7 @@ const TopLevelMenuToggle = styled(Link).attrs({ isButton: true, tertiary: true } margin-bottom: 12px; `; -const MenuLink = styled(Link)` +const MenuLink = styled(({ isActive, ...rest }) => )` color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; margin-bottom: 12px; @@ -129,34 +128,33 @@ const MenuChild = styled.div` margin-bottom: 12px; `; -const ArrowIcon = styled(Icon)` +const ArrowIcon = styled(Icon).attrs({ icon: 'arrowright' })` width: 14px; width: 14px; color: ${color.mediumdark}; transform: translateY(-1px) ${(props) => props.isOpen && `rotate(90deg)`}; - ${(props) => - props.isTopLevel - ? ` - margin-right: 8px; - ` - : ` - margin-left: 8px; - `} + ${(props) => (props.isTopLevel ? `margin-right: 8px;` : `margin-left: 8px;`)} `; function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { if (!item.children) return null; - const arrow = ; + const arrow = ; const MenuToggle = isTopLevel ? TopLevelMenuToggle : MenuLink; + const openOnTab = (event) => { + if (event.key !== 'Tab') return; + setMenuOpenStateById({ id: item.id, isOpen: true }); + }; const toggleOpenState = () => setMenuOpenStateById({ id: item.id, isOpen: !item.isOpen }); return (
{isTopLevel && arrow} {isTopLevel ? ( - {item.title} + + {item.title} + ) : ( - + {item.title} )} @@ -192,14 +190,16 @@ Menu.defaultProps = { function ItemLink({ currentPath, item }) { return ( - - {item.title} - +
+ + {item.title} + +
); } @@ -207,7 +207,7 @@ ItemLink.propTypes = { currentPath: PropTypes.string.isRequired, item: PropTypes.shape({ path: PropTypes.string.isRequired, - LinkWrapper: PropTypes.node, + LinkWrapper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), title: PropTypes.string.isRequired, }).isRequired, }; @@ -260,11 +260,12 @@ PureTableOfContents.defaultProps = { const toKebabcase = (string) => string.toLowerCase().split(' ').join('-'); -const hasActiveChildren = (children, currentPath) => { +const hasActiveChildren = (children, currentPath, lastFocusedId) => { return !!children.find( (child) => child.path === currentPath || - (child.children && hasActiveChildren(child.children, currentPath)) + child.id === lastFocusedId || + (child.children && hasActiveChildren(child.children, currentPath, lastFocusedId)) ); }; @@ -272,10 +273,11 @@ const getOpenState = ({ item, globalItemUpdate = {}, singleItemUpdate = {}, + lastFocusedId, currentPath, didChangeCurrentPath, }) => { - const withActiveChildren = hasActiveChildren(item.children, currentPath); + const withActiveChildren = hasActiveChildren(item.children, currentPath, lastFocusedId); // If there is no 'isOpen' field yet, set a default based on whether or not // any of the children are active. if (typeof item.isOpen !== 'boolean') return withActiveChildren; @@ -283,7 +285,9 @@ const getOpenState = ({ if (didChangeCurrentPath && withActiveChildren) return true; if (typeof globalItemUpdate.isOpen === 'boolean') return globalItemUpdate.isOpen; - + if (item.id === 'customize-0') { + console.log({ item, singleItemUpdate }); + } if (typeof singleItemUpdate.isOpen === 'boolean' && singleItemUpdate.id === item.id) return singleItemUpdate.isOpen; @@ -298,11 +302,19 @@ const mapItemUIState = (args) => { depth = 0, globalItemUpdate, singleItemUpdate, + lastFocusedId, } = args; return items.map((itemWithoutId) => { const id = `${toKebabcase(itemWithoutId.title)}-${depth}`; - const item = { ...itemWithoutId, id }; + const item = { + ...itemWithoutId, + id, + // Recursively set the state of children to an infinite depth + ...(itemWithoutId.children && { + children: mapItemUIState({ ...args, items: itemWithoutId.children, depth: depth + 1 }), + }), + }; const isMenuWithChildren = item.type === ITEM_TYPES.MENU && !!item.children; return { @@ -313,36 +325,51 @@ const mapItemUIState = (args) => { item, globalItemUpdate, singleItemUpdate, + lastFocusedId, currentPath, didChangeCurrentPath, }), }), - // Recursively set the state of children to an infinite depth - ...(item.children && { - children: mapItemUIState({ ...args, items: item.children, depth: depth + 1 }), - }), }; }); }; export function TableOfContents({ children, currentPath, items, ...rest }) { - const [itemsWithUIState, setItemsWithUIState] = useState(mapItemUIState({ items, currentPath })); + const [lastFocusedId, setLastFocusedId] = useState(undefined); + const [itemsWithUIState, setItemsWithUIState] = useState( + mapItemUIState({ items, currentPath, lastFocusedId }) + ); const toggleAllOpenStates = (isOpen) => setItemsWithUIState( - mapItemUIState({ items: itemsWithUIState, currentPath, globalItemUpdate: { isOpen } }) + mapItemUIState({ + items: itemsWithUIState, + lastFocusedId, + currentPath, + globalItemUpdate: { isOpen }, + }) ); const toggleAllOpen = () => toggleAllOpenStates(true); const toggleAllClosed = () => toggleAllOpenStates(false); const setMenuOpenStateById = (args) => setItemsWithUIState( - mapItemUIState({ items: itemsWithUIState, currentPath, singleItemUpdate: args }) + mapItemUIState({ + items: itemsWithUIState, + lastFocusedId, + currentPath, + singleItemUpdate: args, + }) ); const didRunCurrentPathEffectOnMount = useRef(false); useEffect(() => { if (didRunCurrentPathEffectOnMount.current) { setItemsWithUIState( - mapItemUIState({ didChangeCurrentPath: true, items: itemsWithUIState, currentPath }) + mapItemUIState({ + lastFocusedId, + didChangeCurrentPath: true, + items: itemsWithUIState, + currentPath, + }) ); } else { didRunCurrentPathEffectOnMount.current = true; @@ -354,6 +381,7 @@ export function TableOfContents({ children, currentPath, items, ...rest }) { currentPath={currentPath} items={itemsWithUIState} setMenuOpenStateById={setMenuOpenStateById} + setLastFocusedId={setLastFocusedId} {...rest} /> ); @@ -373,6 +401,6 @@ TableOfContents.propTypes = { ).isRequired, }; -TableOfContents.propTypes = { +TableOfContents.defaultProps = { children: undefined, }; diff --git a/src/components/TableOfContents.stories.js b/src/components/TableOfContents.stories.js index 5f55ecfa..5ed208a8 100644 --- a/src/components/TableOfContents.stories.js +++ b/src/components/TableOfContents.stories.js @@ -22,6 +22,11 @@ const items = [ title: 'Setup', type: 'bullet-link', }, + { + path: '/write-a-story', + title: 'Write a story', + type: 'bullet-link', + }, ], }, { From f50359f0b5ce2e6a1d3bc7714cf710b739c9923a Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 10:22:21 -0600 Subject: [PATCH 03/14] Args for stories --- src/components/TableOfContents.stories.js | 29 +++++++++++------------ 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/src/components/TableOfContents.stories.js b/src/components/TableOfContents.stories.js index 5ed208a8..7737ceb8 100644 --- a/src/components/TableOfContents.stories.js +++ b/src/components/TableOfContents.stories.js @@ -66,23 +66,22 @@ const items = [ const findPaths = (pathItems) => pathItems.flatMap((item) => item.path || findPaths(item.children)); const paths = findPaths(items); -export const Default = () => ; +export const Basic = (args) => ; +Basic.args = { currentPath: paths[0], items }; -export const DeeplyNestedActivePath = () => ( - -); +export const NestedActivePath = Basic.bind(); +NestedActivePath.args = { currentPath: '/features-and-behavior', items }; -export const LinkWrappers = () => { - const addLinkWrappers = (itemsToCompose) => - itemsToCompose.map((item) => { - if (item.type === 'link' || item.type === 'bullet-link') - return { ...item, LinkWrapper: StoryLinkWrapper }; - if (item.children) return { ...item, children: addLinkWrappers(item.children) }; - return item; - }); - const itemsWithLinkWrappers = addLinkWrappers(items); - return ; -}; +const addLinkWrappers = (itemsToCompose) => + itemsToCompose.map((item) => { + if (item.type === 'link' || item.type === 'bullet-link') + return { ...item, LinkWrapper: StoryLinkWrapper }; + if (item.children) return { ...item, children: addLinkWrappers(item.children) }; + return item; + }); +const itemsWithLinkWrappers = addLinkWrappers(items); +export const LinkWrappers = Basic.bind(); +LinkWrappers.args = { currentPath: paths[0], items: itemsWithLinkWrappers }; export const WithOpenControls = () => ( From 6538ad7b9367460cbcb6be0a7f5df031a08044eb Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 11:14:28 -0600 Subject: [PATCH 04/14] Code cleanup --- src/components/TableOfContents.js | 32 ++++++++++++++++++------------- 1 file changed, 19 insertions(+), 13 deletions(-) diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js index ccb13f7f..fa7e7687 100644 --- a/src/components/TableOfContents.js +++ b/src/components/TableOfContents.js @@ -260,12 +260,14 @@ PureTableOfContents.defaultProps = { const toKebabcase = (string) => string.toLowerCase().split(' ').join('-'); -const hasActiveChildren = (children, currentPath, lastFocusedId) => { +const hasActiveChildren = (args) => { + const { children, currentPath, lastFocusedId } = args; + return !!children.find( (child) => child.path === currentPath || child.id === lastFocusedId || - (child.children && hasActiveChildren(child.children, currentPath, lastFocusedId)) + (child.children && hasActiveChildren({ ...args, children: child.children })) ); }; @@ -277,7 +279,11 @@ const getOpenState = ({ currentPath, didChangeCurrentPath, }) => { - const withActiveChildren = hasActiveChildren(item.children, currentPath, lastFocusedId); + const withActiveChildren = hasActiveChildren({ + children: item.children, + currentPath, + lastFocusedId, + }); // If there is no 'isOpen' field yet, set a default based on whether or not // any of the children are active. if (typeof item.isOpen !== 'boolean') return withActiveChildren; @@ -285,15 +291,14 @@ const getOpenState = ({ if (didChangeCurrentPath && withActiveChildren) return true; if (typeof globalItemUpdate.isOpen === 'boolean') return globalItemUpdate.isOpen; - if (item.id === 'customize-0') { - console.log({ item, singleItemUpdate }); - } + if (typeof singleItemUpdate.isOpen === 'boolean' && singleItemUpdate.id === item.id) return singleItemUpdate.isOpen; return item.isOpen; }; +// Add UI state to the 'items' that are passed in as props const mapItemUIState = (args) => { const { items, @@ -310,7 +315,10 @@ const mapItemUIState = (args) => { const item = { ...itemWithoutId, id, - // Recursively set the state of children to an infinite depth + // Recursively set the state of children to an infinite depth. + // getOpenState needs the children to have an id already to determine + // if there is a focused child, hence the placement of the recursive + // mapItemUIState call here before getOpenState is called. ...(itemWithoutId.children && { children: mapItemUIState({ ...args, items: itemWithoutId.children, depth: depth + 1 }), }), @@ -336,15 +344,15 @@ const mapItemUIState = (args) => { export function TableOfContents({ children, currentPath, items, ...rest }) { const [lastFocusedId, setLastFocusedId] = useState(undefined); + const mapItemUIStateCommonArgs = { currentPath, lastFocusedId }; const [itemsWithUIState, setItemsWithUIState] = useState( mapItemUIState({ items, currentPath, lastFocusedId }) ); const toggleAllOpenStates = (isOpen) => setItemsWithUIState( mapItemUIState({ + ...mapItemUIStateCommonArgs, items: itemsWithUIState, - lastFocusedId, - currentPath, globalItemUpdate: { isOpen }, }) ); @@ -353,9 +361,8 @@ export function TableOfContents({ children, currentPath, items, ...rest }) { const setMenuOpenStateById = (args) => setItemsWithUIState( mapItemUIState({ + ...mapItemUIStateCommonArgs, items: itemsWithUIState, - lastFocusedId, - currentPath, singleItemUpdate: args, }) ); @@ -365,10 +372,9 @@ export function TableOfContents({ children, currentPath, items, ...rest }) { if (didRunCurrentPathEffectOnMount.current) { setItemsWithUIState( mapItemUIState({ - lastFocusedId, + ...mapItemUIStateCommonArgs, didChangeCurrentPath: true, items: itemsWithUIState, - currentPath, }) ); } else { From e3a2bb656364e75261a0ed593e19cb8307ec8d6f Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 13:16:07 -0600 Subject: [PATCH 05/14] Fix keyboard nav --- build-storybook.log | 1305 +++++++++++++++++++++++++++++ src/components/TableOfContents.js | 78 +- 2 files changed, 1334 insertions(+), 49 deletions(-) create mode 100644 build-storybook.log diff --git a/build-storybook.log b/build-storybook.log new file mode 100644 index 00000000..da1d060e --- /dev/null +++ b/build-storybook.log @@ -0,0 +1,1305 @@ +info @storybook/react v6.0.0-beta.20 +info +info clean outputDir.. +info => Copying prebuild dll's.. +info => Building manager.. +info => Loading manager config.. +info => Loading presets +info => Compiling manager.. +info => manager built (7.79 s) +info => Building preview.. +info => Loading preview config.. +info => Loading presets +info => Loading config/preview file in "./.storybook". +info => Loading config/preview file in "./.storybook". +info => Adding stories defined in ".storybook/main.js". +info => Using default Webpack setup. +info => Compiling preview.. + [webpack.Progress] 0% compiling + [webpack.Progress] 10% building 0/0 modules 0 active + [webpack.Progress] 10% building 0/1 modules 1 active multi /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/server/common/polyfills.js /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/server/preview/globals.js /Users/kyle/Code/design-system/.storybook/storybook-init-framework-entry.js /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/config.js-generated-other-entry.js /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preset/addDecorator.js-generated-other-entry.js /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preset/addArgs.js-generated-other-entry.js /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/a11yRunner.js-generated-other-entry.js /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/a11yHighlight.js-generated-other-entry.js /Users/kyle/Code/design-system/.storybook/preview.js-generated-config-entry.js /Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 10% building 1/1 modules 0 active + [webpack.Progress] 10% building 1/2 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/a11yRunner.js-generated-other-entry.js + [webpack.Progress] 10% building 1/3 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/a11yHighlight.js-generated-other-entry.js + [webpack.Progress] 10% building 1/4 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preset/addDecorator.js-generated-other-entry.js + [webpack.Progress] 10% building 1/5 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preset/addArgs.js-generated-other-entry.js + [webpack.Progress] 10% building 1/6 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/config.js-generated-other-entry.js + [webpack.Progress] 10% building 1/7 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js + [webpack.Progress] 10% building 2/7 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js + [webpack.Progress] 10% building 3/7 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js + [webpack.Progress] 10% building 4/7 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js + [webpack.Progress] 10% building 5/7 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js + [webpack.Progress] 10% building 6/7 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js + [webpack.Progress] 10% building 7/7 modules 0 active + [webpack.Progress] 10% building 7/8 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/server/common/polyfills.js + [webpack.Progress] 10% building 7/9 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/server/preview/globals.js + [webpack.Progress] 10% building 7/10 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/a11yRunner.js + [webpack.Progress] 10% building 7/11 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/a11yHighlight.js + [webpack.Progress] 10% building 7/12 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preset/addDecorator.js + [webpack.Progress] 10% building 7/13 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preset/addArgs.js + [webpack.Progress] 10% building 7/14 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/config.js + [webpack.Progress] 10% building 7/15 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js + [webpack.Progress] 10% building 8/15 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js + [webpack.Progress] 11% building 9/15 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/config.js + [webpack.Progress] 11% building 9/16 modules 7 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/storybook-init-framework-entry.js + [webpack.Progress] 11% building 9/17 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js-generated-config-entry.js + [webpack.Progress] 11% building 9/18 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 10/18 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 11/18 modules 7 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 12/18 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 13/18 modules 5 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 14/18 modules 4 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 15/18 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 11% building 16/18 modules 2 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 12% building 17/18 modules 1 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/generated-stories-entry.js + [webpack.Progress] 12% building 18/18 modules 0 active + [webpack.Progress] 12% building 18/19 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/constants.js + [webpack.Progress] 12% building 18/20 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/index.js + [webpack.Progress] 12% building 18/21 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-a11y/dist/highlight.js + [webpack.Progress] 12% building 18/22 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/enhanceArgTypes.js + [webpack.Progress] 12% building 18/23 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/extractArgTypes.js + [webpack.Progress] 12% building 18/24 modules 6 active /Users/kyle/Code/design-system/src sync /(?:(?!\.).*?\.stories\.mdx)$/ + [webpack.Progress] 12% building 18/25 modules 7 active /Users/kyle/Code/design-system/src sync /(?:(?!\.).*?\.stories\.js)$/ + [webpack.Progress] 12% building 18/26 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 12% building 18/27 modules 9 active delegated "aYSr" from dll-reference storybook_docs_dll + [webpack.Progress] 12% building 19/27 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 12% building 19/28 modules 9 active external "storybook_docs_dll" + [webpack.Progress] 12% building 20/28 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 12% building 20/29 modules 9 active delegated "3yYM" from dll-reference storybook_docs_dll + [webpack.Progress] 12% building 21/29 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 12% building 22/29 modules 7 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 12% building 23/29 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 12% building 24/29 modules 5 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 25/29 modules 4 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 26/29 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 26/30 modules 4 active delegated "7x/C" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 27/30 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 27/31 modules 4 active delegated "JtPf" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 28/31 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 28/32 modules 4 active delegated "2G9S" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 29/32 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 29/33 modules 4 active delegated "7xRU" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 30/33 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 30/34 modules 4 active delegated "z84I" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 31/34 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 31/35 modules 4 active delegated "1t7P" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 32/35 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 32/36 modules 4 active delegated "LW0h" from dll-reference storybook_docs_dll + [webpack.Progress] 13% building 33/36 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 13% building 33/37 modules 4 active delegated "jwue" from dll-reference storybook_docs_dll + [webpack.Progress] 14% building 34/37 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 14% building 34/38 modules 4 active delegated "EgRP" from dll-reference storybook_docs_dll + [webpack.Progress] 14% building 35/38 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 14% building 35/39 modules 4 active delegated "UvmB" from dll-reference storybook_docs_dll + [webpack.Progress] 14% building 36/39 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 14% building 36/40 modules 4 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptor.js + [webpack.Progress] 14% building 36/41 modules 5 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptors.js + [webpack.Progress] 14% building 36/42 modules 6 active delegated "+KXO" from dll-reference storybook_docs_dll + [webpack.Progress] 14% building 37/42 modules 5 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptors.js + [webpack.Progress] 14% building 37/43 modules 6 active delegated "+oxZ" from dll-reference storybook_docs_dll + [webpack.Progress] 14% building 38/43 modules 5 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptors.js + [webpack.Progress] 14% building 39/43 modules 4 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptors.js + [webpack.Progress] 14% building 40/43 modules 3 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptors.js + [webpack.Progress] 14% building 41/43 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.object.get-own-property-descriptors.js + [webpack.Progress] 15% building 42/43 modules 1 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/.storybook/preview.js + [webpack.Progress] 15% building 42/44 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/constants.js + [webpack.Progress] 15% building 42/45 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/inferArgTypes.js + [webpack.Progress] 15% building 43/45 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/inferArgTypes.js + [webpack.Progress] 15% building 43/46 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/common/inferControls.js + [webpack.Progress] 15% building 43/47 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/extractProps.js + [webpack.Progress] 15% building 43/48 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/index.js + [webpack.Progress] 15% building 43/49 modules 6 active delegated "IAdD" from dll-reference storybook_docs_dll + [webpack.Progress] 15% building 44/49 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/index.js + [webpack.Progress] 15% building 44/50 modules 6 active delegated "iKE+" from dll-reference storybook_docs_dll + [webpack.Progress] 15% building 45/50 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/index.js + [webpack.Progress] 15% building 45/51 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/client-logger/dist/index.js + [webpack.Progress] 15% building 45/52 modules 7 active delegated "KqXw" from dll-reference storybook_docs_dll + [webpack.Progress] 15% building 46/52 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/client-logger/dist/index.js + [webpack.Progress] 15% building 46/53 modules 7 active delegated "DZ+c" from dll-reference storybook_docs_dll + [webpack.Progress] 15% building 47/53 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/client-logger/dist/index.js + [webpack.Progress] 15% building 47/54 modules 7 active /Users/kyle/Code/design-system/node_modules/lodash/mapValues.js + [webpack.Progress] 15% building 48/54 modules 6 active /Users/kyle/Code/design-system/node_modules/lodash/mapValues.js + [webpack.Progress] 15% building 49/54 modules 5 active /Users/kyle/Code/design-system/node_modules/lodash/mapValues.js + [webpack.Progress] 16% building 50/54 modules 4 active /Users/kyle/Code/design-system/node_modules/lodash/mapValues.js + [webpack.Progress] 16% building 50/55 modules 5 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/Intro.stories.mdx + [webpack.Progress] 16% building 50/56 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Color.stories.mdx + [webpack.Progress] 16% building 50/57 modules 7 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 51/57 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 51/58 modules 7 active delegated "ARua" from dll-reference storybook_docs_dll + [webpack.Progress] 16% building 52/58 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 52/59 modules 7 active delegated "NyMY" from dll-reference storybook_docs_dll + [webpack.Progress] 16% building 53/59 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 54/59 modules 5 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 55/59 modules 4 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 56/59 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--8-0!/Users/kyle/Code/design-system/node_modules/@mdx-js/loader/index.js??ref--8-1!/Users/kyle/Code/design-system/src/components/Typography.stories.mdx + [webpack.Progress] 16% building 56/60 modules 4 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Avatar.stories.js + [webpack.Progress] 16% building 56/61 modules 5 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/AvatarList.stories.js + [webpack.Progress] 16% building 56/62 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Badge.stories.js + [webpack.Progress] 16% building 56/63 modules 7 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Button.stories.js + [webpack.Progress] 16% building 56/64 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Checkbox.stories.js + [webpack.Progress] 16% building 56/65 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Highlight.stories.js + [webpack.Progress] 16% building 56/66 modules 10 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Icon.stories.js + [webpack.Progress] 16% building 56/67 modules 11 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Input.stories.js + [webpack.Progress] 16% building 56/68 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Link.stories.js + [webpack.Progress] 16% building 56/69 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/ProgressDots.stories.js + [webpack.Progress] 16% building 56/70 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Radio.stories.js + [webpack.Progress] 16% building 56/71 modules 15 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Select.stories.js + [webpack.Progress] 16% building 56/72 modules 16 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Spinner.stories.js + [webpack.Progress] 16% building 56/73 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Subheading.stories.js + [webpack.Progress] 16% building 56/74 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/TableOfContents.stories.js + [webpack.Progress] 16% building 56/75 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/Textarea.stories.js + [webpack.Progress] 16% building 56/76 modules 20 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/modal/Modal.stories.js + [webpack.Progress] 16% building 56/77 modules 21 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/modal/WithModal.stories.js + [webpack.Progress] 16% building 56/78 modules 22 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/tooltip/ListItem.stories.js + [webpack.Progress] 16% building 56/79 modules 23 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/tooltip/Tooltip.stories.js + [webpack.Progress] 16% building 56/80 modules 24 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/tooltip/TooltipLinkList.stories.js + [webpack.Progress] 16% building 56/81 modules 25 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/tooltip/TooltipMessage.stories.js + [webpack.Progress] 16% building 56/82 modules 26 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/tooltip/TooltipNote.stories.js + [webpack.Progress] 16% building 56/83 modules 27 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js??ref--10!/Users/kyle/Code/design-system/node_modules/@storybook/source-loader/dist/index.js!/Users/kyle/Code/design-system/src/components/tooltip/WithTooltip.stories.js + [webpack.Progress] 16% building 56/84 modules 28 active /Users/kyle/Code/design-system/node_modules/axe-core/axe.js + [webpack.Progress] 16% building 56/85 modules 29 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/utils/index.js + [webpack.Progress] 16% building 56/86 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 16% building 56/87 modules 31 active delegated "ax0f" from dll-reference storybook_docs_dll + [webpack.Progress] 16% building 57/87 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 16% building 57/88 modules 31 active delegated "ct80" from dll-reference storybook_docs_dll + [webpack.Progress] 16% building 58/88 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 16% building 58/89 modules 31 active delegated "N4z3" from dll-reference storybook_docs_dll + [webpack.Progress] 17% building 59/89 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 17% building 59/90 modules 31 active delegated "GFpt" from dll-reference storybook_docs_dll + [webpack.Progress] 17% building 60/90 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 17% building 60/91 modules 31 active delegated "1Mu/" from dll-reference storybook_docs_dll + [webpack.Progress] 17% building 61/91 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 17% building 61/92 modules 31 active delegated "oD4t" from dll-reference storybook_docs_dll + [webpack.Progress] 17% building 62/92 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 17% building 62/93 modules 31 active delegated "2sZ7" from dll-reference storybook_docs_dll + [webpack.Progress] 17% building 63/93 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/index.js + [webpack.Progress] 17% building 63/94 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/public_api.js + [webpack.Progress] 17% building 63/95 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/core-events/dist/index.js + [webpack.Progress] 17% building 63/96 modules 33 active delegated "fRV1" from dll-reference storybook_docs_dll + [webpack.Progress] 17% building 64/96 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/core-events/dist/index.js + [webpack.Progress] 17% building 64/97 modules 33 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/index.js + [webpack.Progress] 17% building 65/97 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/index.js + [webpack.Progress] 17% building 66/97 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/index.js + [webpack.Progress] 18% building 67/97 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/index.js + [webpack.Progress] 18% building 67/98 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/client_api.js + [webpack.Progress] 18% building 67/99 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/decorators.js + [webpack.Progress] 18% building 67/100 modules 33 active /Users/kyle/Code/design-system/node_modules/core-js/features/symbol/index.js + [webpack.Progress] 18% building 67/101 modules 34 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/parameters.js + [webpack.Progress] 18% building 67/102 modules 35 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/pathToId.js + [webpack.Progress] 18% building 67/103 modules 36 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/story_store.js + [webpack.Progress] 18% building 67/104 modules 37 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/queryparams.js + [webpack.Progress] 18% building 67/105 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/hooks.js + [webpack.Progress] 18% building 67/106 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/config_api.js + [webpack.Progress] 18% building 67/107 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 67/108 modules 41 active delegated "MvUL" from dll-reference storybook_docs_dll + [webpack.Progress] 18% building 68/108 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 68/109 modules 41 active delegated "KOtZ" from dll-reference storybook_docs_dll + [webpack.Progress] 18% building 69/109 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 69/110 modules 41 active delegated "ho0z" from dll-reference storybook_docs_dll + [webpack.Progress] 18% building 70/110 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 71/110 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 71/111 modules 40 active delegated "wC3K" from dll-reference storybook_docs_dll + [webpack.Progress] 18% building 72/111 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 72/112 modules 40 active delegated "S3pA" from dll-reference storybook_docs_dll + [webpack.Progress] 18% building 73/112 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 73/113 modules 40 active delegated "zKkv" from dll-reference storybook_docs_dll + [webpack.Progress] 18% building 74/113 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/types.js + [webpack.Progress] 18% building 74/114 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/handleProp.js + [webpack.Progress] 18% building 74/115 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/typeScript/handleProp.js + [webpack.Progress] 19% building 75/115 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/typeScript/handleProp.js + [webpack.Progress] 19% building 76/115 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/typeScript/handleProp.js + [webpack.Progress] 19% building 77/115 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/typeScript/handleProp.js + [webpack.Progress] 19% building 77/116 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 19% building 78/116 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 19% building 79/116 modules 37 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 19% building 80/116 modules 36 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 19% building 81/116 modules 35 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 19% building 82/116 modules 34 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 19% building 83/116 modules 33 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 84/116 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 85/116 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 86/116 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 87/116 modules 29 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 88/116 modules 28 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 89/116 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 89/117 modules 28 active delegated "kYxP" from dll-reference storybook_docs_dll + [webpack.Progress] 20% building 90/117 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 90/118 modules 28 active delegated "87if" from dll-reference storybook_docs_dll + [webpack.Progress] 20% building 91/118 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 20% building 91/119 modules 28 active delegated "lTEL" from dll-reference storybook_docs_dll + [webpack.Progress] 21% building 92/119 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 92/120 modules 28 active delegated "plBw" from dll-reference storybook_docs_dll + [webpack.Progress] 21% building 93/120 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 93/121 modules 28 active delegated "aLgo" from dll-reference storybook_docs_dll + [webpack.Progress] 21% building 94/121 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 94/122 modules 28 active delegated "jQ/y" from dll-reference storybook_docs_dll + [webpack.Progress] 21% building 95/122 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 96/122 modules 26 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 97/122 modules 25 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 98/122 modules 24 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/index.js + [webpack.Progress] 21% building 98/123 modules 25 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/index.js + [webpack.Progress] 21% building 98/124 modules 26 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/index.js + [webpack.Progress] 21% building 99/124 modules 25 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/index.js + [webpack.Progress] 21% building 99/125 modules 26 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Description.js + [webpack.Progress] 21% building 99/126 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/DocsContext.js + [webpack.Progress] 21% building 99/127 modules 28 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Anchor.js + [webpack.Progress] 21% building 99/128 modules 29 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/DocsPage.js + [webpack.Progress] 21% building 99/129 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/DocsContainer.js + [webpack.Progress] 21% building 99/130 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/DocsStory.js + [webpack.Progress] 21% building 99/131 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Heading.js + [webpack.Progress] 21% building 99/132 modules 33 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Preview.js + [webpack.Progress] 21% building 99/133 modules 34 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Meta.js + [webpack.Progress] 21% building 99/134 modules 35 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Primary.js + [webpack.Progress] 21% building 99/135 modules 36 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Props.js + [webpack.Progress] 21% building 99/136 modules 37 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Source.js + [webpack.Progress] 21% building 99/137 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Stories.js + [webpack.Progress] 21% building 99/138 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Story.js + [webpack.Progress] 21% building 99/139 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Subheading.js + [webpack.Progress] 21% building 99/140 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Subtitle.js + [webpack.Progress] 21% building 99/141 modules 42 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Title.js + [webpack.Progress] 22% building 100/141 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Title.js + [webpack.Progress] 22% building 101/141 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Title.js + [webpack.Progress] 22% building 102/141 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Title.js + [webpack.Progress] 22% building 102/142 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/index.js + [webpack.Progress] 22% building 103/142 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/index.js + [webpack.Progress] 22% building 103/143 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/hooks.js + [webpack.Progress] 22% building 103/144 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/storybook-channel-mock.js + [webpack.Progress] 22% building 103/145 modules 42 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/global.ts + [webpack.Progress] 22% building 103/146 modules 43 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/types.js + [webpack.Progress] 22% building 103/147 modules 44 active /Users/kyle/Code/design-system/node_modules/@storybook/addons/dist/make-decorator.js + [webpack.Progress] 22% building 103/148 modules 45 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/mdx.js + [webpack.Progress] 22% building 103/149 modules 46 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/types.js + [webpack.Progress] 22% building 103/150 modules 47 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 22% building 104/150 modules 46 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 22% building 105/150 modules 45 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 22% building 106/150 modules 44 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 22% building 107/150 modules 43 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 22% building 108/150 modules 42 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 23% building 109/150 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 23% building 110/150 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 23% building 111/150 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 23% building 112/150 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/Wrapper.js + [webpack.Progress] 23% building 112/151 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/types.js + [webpack.Progress] 23% building 112/152 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/extractDocgenProps.js + [webpack.Progress] 23% building 112/153 modules 41 active delegated "jQ3i" from dll-reference storybook_docs_dll + [webpack.Progress] 23% building 113/153 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/extractDocgenProps.js + [webpack.Progress] 23% building 113/154 modules 41 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 23% building 114/154 modules 40 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 23% building 115/154 modules 39 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 23% building 116/154 modules 38 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 117/154 modules 37 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 118/154 modules 36 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 119/154 modules 35 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 120/154 modules 34 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 121/154 modules 33 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 122/154 modules 32 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 123/154 modules 31 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 24% building 124/154 modules 30 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 125/154 modules 29 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 126/154 modules 28 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 127/154 modules 27 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 128/154 modules 26 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 129/154 modules 25 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 130/154 modules 24 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.map.js + [webpack.Progress] 25% building 130/155 modules 25 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 25% building 130/156 modules 26 active delegated "6U7i" from dll-reference storybook_docs_dll + [webpack.Progress] 25% building 131/156 modules 25 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 25% building 132/156 modules 24 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 25% building 133/156 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 26% building 134/156 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 26% building 135/156 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 26% building 136/156 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 26% building 137/156 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/blocks.js + [webpack.Progress] 26% building 137/157 modules 20 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 26% building 138/157 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 26% building 139/157 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 26% building 140/157 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 26% building 141/157 modules 16 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 27% building 142/157 modules 15 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 27% building 143/157 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 27% building 144/157 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 27% building 145/157 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Subheading.js + [webpack.Progress] 27% building 145/158 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/utils/loadFontsForStorybook.js + [webpack.Progress] 27% building 145/159 modules 14 active delegated "cARO" from dll-reference storybook_docs_dll + [webpack.Progress] 27% building 146/159 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/utils/loadFontsForStorybook.js + [webpack.Progress] 27% building 146/160 modules 14 active delegated "M+/F" from dll-reference storybook_docs_dll + [webpack.Progress] 27% building 147/160 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/utils/loadFontsForStorybook.js + [webpack.Progress] 27% building 147/161 modules 14 active delegated "hCOa" from dll-reference storybook_docs_dll + [webpack.Progress] 27% building 148/161 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/utils/loadFontsForStorybook.js + [webpack.Progress] 27% building 148/162 modules 14 active delegated "LJOr" from dll-reference storybook_docs_dll + [webpack.Progress] 27% building 149/162 modules 13 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/utils/loadFontsForStorybook.js + [webpack.Progress] 27% building 149/163 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 150/163 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 150/164 modules 14 active delegated "ERkP" from dll-reference storybook_docs_dll + [webpack.Progress] 28% building 151/164 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 152/164 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 153/164 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 154/164 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 155/164 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/client-api/dist/storySort.js + [webpack.Progress] 28% building 155/165 modules 10 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/styles.ts + [webpack.Progress] 28% building 155/166 modules 11 active /Users/kyle/Code/design-system/node_modules/file-loader/dist/cjs.js??ref--13!/Users/kyle/Code/design-system/src/design-system.png + [webpack.Progress] 28% building 155/167 modules 12 active delegated "5878" from dll-reference storybook_docs_dll + [webpack.Progress] 28% building 156/167 modules 11 active /Users/kyle/Code/design-system/node_modules/file-loader/dist/cjs.js??ref--13!/Users/kyle/Code/design-system/src/design-system.png + [webpack.Progress] 28% building 157/167 modules 10 active /Users/kyle/Code/design-system/node_modules/file-loader/dist/cjs.js??ref--13!/Users/kyle/Code/design-system/src/design-system.png + [webpack.Progress] 28% building 158/167 modules 9 active /Users/kyle/Code/design-system/node_modules/file-loader/dist/cjs.js??ref--13!/Users/kyle/Code/design-system/src/design-system.png + [webpack.Progress] 29% building 159/167 modules 8 active /Users/kyle/Code/design-system/node_modules/file-loader/dist/cjs.js??ref--13!/Users/kyle/Code/design-system/src/design-system.png + [webpack.Progress] 29% building 159/168 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/Tooltip.js + [webpack.Progress] 29% building 159/169 modules 10 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/TooltipMessage.js + [webpack.Progress] 29% building 159/170 modules 11 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/WithTooltip.js + [webpack.Progress] 29% building 159/171 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/WithModal.js + [webpack.Progress] 29% building 160/171 modules 11 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/WithModal.js + [webpack.Progress] 29% building 161/171 modules 10 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/WithModal.js + [webpack.Progress] 29% building 162/171 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/WithModal.js + [webpack.Progress] 29% building 162/172 modules 10 active delegated "aWzz" from dll-reference storybook_docs_dll + [webpack.Progress] 29% building 163/172 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/WithModal.js + [webpack.Progress] 29% building 163/173 modules 10 active delegated "kvVz" from dll-reference storybook_docs_dll + [webpack.Progress] 29% building 164/173 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/WithModal.js + [webpack.Progress] 29% building 164/174 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionDisplay.js + [webpack.Progress] 29% building 164/175 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/action.js + [webpack.Progress] 29% building 164/176 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/StoryLinkWrapper.js + [webpack.Progress] 29% building 165/176 modules 11 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/StoryLinkWrapper.js + [webpack.Progress] 29% building 165/177 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/utils.js + [webpack.Progress] 29% building 165/178 modules 13 active delegated "hBpG" from dll-reference storybook_docs_dll + [webpack.Progress] 29% building 166/178 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/utils.js + [webpack.Progress] 30% building 167/178 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/utils.js + [webpack.Progress] 30% building 167/179 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/TableOfContents.js + [webpack.Progress] 30% building 167/180 modules 13 active delegated "m3Bd" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 168/180 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/TableOfContents.js + [webpack.Progress] 30% building 168/181 modules 13 active delegated "97Jx" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 169/181 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/TableOfContents.js + [webpack.Progress] 30% building 169/182 modules 13 active delegated "KEM+" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 170/182 modules 12 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/TableOfContents.js + [webpack.Progress] 30% building 170/183 modules 13 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/taggedTemplateLiteral.js + [webpack.Progress] 30% building 170/184 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/icons.ts + [webpack.Progress] 30% building 170/185 modules 15 active delegated "Ysgh" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 171/185 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/icons.ts + [webpack.Progress] 30% building 171/186 modules 15 active delegated "1IsZ" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 172/186 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/icons.ts + [webpack.Progress] 30% building 172/187 modules 15 active delegated "vrRf" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 173/187 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/icons.ts + [webpack.Progress] 30% building 173/188 modules 15 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/slicedToArray.js + [webpack.Progress] 30% building 173/189 modules 16 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.unscopables.flat-map.js + [webpack.Progress] 30% building 173/190 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/ListItem.js + [webpack.Progress] 30% building 173/191 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/createPropDef.js + [webpack.Progress] 30% building 173/192 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Highlight.js + [webpack.Progress] 30% building 173/193 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/jsdocParser.js + [webpack.Progress] 30% building 173/194 modules 21 active delegated "iu90" from dll-reference storybook_docs_dll + [webpack.Progress] 30% building 174/194 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/jsdocParser.js + [webpack.Progress] 31% building 175/194 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/jsdocParser.js + [webpack.Progress] 31% building 176/194 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/jsdocParser.js + [webpack.Progress] 31% building 176/195 modules 19 active delegated "OtWY" from dll-reference storybook_docs_dll + [webpack.Progress] 31% building 177/195 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/jsdocParser.js + [webpack.Progress] 31% building 178/195 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/jsdocParser.js + [webpack.Progress] 31% building 178/196 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/Icon.tsx + [webpack.Progress] 31% building 178/197 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/Avatar.tsx + [webpack.Progress] 31% building 178/198 modules 20 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/AvatarList.tsx + [webpack.Progress] 31% building 179/198 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/AvatarList.tsx + [webpack.Progress] 31% building 179/199 modules 20 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Select.js + [webpack.Progress] 31% building 180/199 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Select.js + [webpack.Progress] 31% building 180/200 modules 20 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Textarea.js + [webpack.Progress] 31% building 181/200 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Textarea.js + [webpack.Progress] 31% building 181/201 modules 20 active delegated "nsO7" from dll-reference storybook_docs_dll + [webpack.Progress] 31% building 182/201 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Textarea.js + [webpack.Progress] 31% building 183/201 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Textarea.js + [webpack.Progress] 31% building 183/202 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Input.js + [webpack.Progress] 32% building 184/202 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Input.js + [webpack.Progress] 32% building 185/202 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Input.js + [webpack.Progress] 32% building 186/202 modules 16 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Input.js + [webpack.Progress] 32% building 186/203 modules 17 active delegated "1Iuc" from dll-reference storybook_docs_dll + [webpack.Progress] 32% building 187/203 modules 16 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Input.js + [webpack.Progress] 32% building 187/204 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Button.js + [webpack.Progress] 32% building 187/205 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/Modal.js + [webpack.Progress] 32% building 188/205 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/Modal.js + [webpack.Progress] 32% building 189/205 modules 16 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/modal/Modal.js + [webpack.Progress] 32% building 189/206 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/index.js + [webpack.Progress] 32% building 189/207 modules 18 active delegated "ZUdG" from dll-reference storybook_docs_dll + [webpack.Progress] 32% building 190/207 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/index.js + [webpack.Progress] 32% building 190/208 modules 18 active delegated "x4t0" from dll-reference storybook_docs_dll + [webpack.Progress] 32% building 191/208 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/index.js + [webpack.Progress] 32% building 191/209 modules 18 active delegated "LqLs" from dll-reference storybook_docs_dll + [webpack.Progress] 33% building 192/209 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/index.js + [webpack.Progress] 33% building 192/210 modules 18 active delegated "ZVkB" from dll-reference storybook_docs_dll + [webpack.Progress] 33% building 193/210 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/index.js + [webpack.Progress] 33% building 193/211 modules 18 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.flat-map.js + [webpack.Progress] 33% building 193/212 modules 19 active delegated "DfhM" from dll-reference storybook_docs_dll + [webpack.Progress] 33% building 194/212 modules 18 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.flat-map.js + [webpack.Progress] 33% building 195/212 modules 17 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.flat-map.js + [webpack.Progress] 33% building 196/212 modules 16 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.flat-map.js + [webpack.Progress] 33% building 197/212 modules 15 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.flat-map.js + [webpack.Progress] 33% building 197/213 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/utils/index.js + [webpack.Progress] 33% building 198/213 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/utils/index.js + [webpack.Progress] 33% building 198/214 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/configureActions.js + [webpack.Progress] 33% building 198/215 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/html.js + [webpack.Progress] 33% building 198/216 modules 18 active delegated "3voH" from dll-reference storybook_docs_dll + [webpack.Progress] 33% building 199/216 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/html.js + [webpack.Progress] 33% building 199/217 modules 18 active delegated "WNMA" from dll-reference storybook_docs_dll + [webpack.Progress] 34% building 200/217 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/html.js + [webpack.Progress] 34% building 201/217 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/components/html.js + [webpack.Progress] 34% building 202/217 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/html.js + [webpack.Progress] 34% building 202/218 modules 16 active delegated "pu3o" from dll-reference storybook_docs_dll + [webpack.Progress] 34% building 203/218 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/html.js + [webpack.Progress] 34% building 203/219 modules 16 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/arrayWithHoles.js + [webpack.Progress] 34% building 203/220 modules 17 active delegated "7St7" from dll-reference storybook_docs_dll + [webpack.Progress] 34% building 204/220 modules 16 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/arrayWithHoles.js + [webpack.Progress] 34% building 205/220 modules 15 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/arrayWithHoles.js + [webpack.Progress] 34% building 205/221 modules 16 active /Users/kyle/Code/design-system/node_modules/@mdx-js/react/dist/esm.js + [webpack.Progress] 34% building 206/221 modules 15 active /Users/kyle/Code/design-system/node_modules/@mdx-js/react/dist/esm.js + [webpack.Progress] 34% building 207/221 modules 14 active /Users/kyle/Code/design-system/node_modules/@mdx-js/react/dist/esm.js + [webpack.Progress] 34% building 207/222 modules 15 active /Users/kyle/Code/design-system/node_modules/core-js/es/symbol/index.js + [webpack.Progress] 34% building 208/222 modules 14 active /Users/kyle/Code/design-system/node_modules/core-js/es/symbol/index.js + [webpack.Progress] 35% building 209/222 modules 13 active /Users/kyle/Code/design-system/node_modules/core-js/es/symbol/index.js + [webpack.Progress] 35% building 209/223 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/utils/defaultValue.js + [webpack.Progress] 35% building 209/224 modules 15 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Link.js + [webpack.Progress] 35% building 210/224 modules 14 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Link.js + [webpack.Progress] 35% building 210/225 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/preview/index.js + [webpack.Progress] 35% building 210/226 modules 16 active delegated "uFXj" from dll-reference storybook_docs_dll + [webpack.Progress] 35% building 211/226 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/preview/index.js + [webpack.Progress] 35% building 211/227 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/utils.js + [webpack.Progress] 35% building 211/228 modules 17 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/nonIterableRest.js + [webpack.Progress] 35% building 211/229 modules 18 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js + [webpack.Progress] 35% building 211/230 modules 19 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js + [webpack.Progress] 35% building 212/230 modules 18 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js + [webpack.Progress] 35% building 213/230 modules 17 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js + [webpack.Progress] 35% building 214/230 modules 16 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js + [webpack.Progress] 35% building 214/231 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createPropDef.js + [webpack.Progress] 35% building 215/231 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createPropDef.js + [webpack.Progress] 35% building 216/231 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createPropDef.js + [webpack.Progress] 36% building 217/231 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createPropDef.js + [webpack.Progress] 36% building 218/231 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createPropDef.js + [webpack.Progress] 36% building 218/232 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/flow/createPropDef.js + [webpack.Progress] 36% building 219/232 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/flow/createPropDef.js + [webpack.Progress] 36% building 220/232 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/flow/createPropDef.js + [webpack.Progress] 36% building 221/232 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/flow/createPropDef.js + [webpack.Progress] 36% building 221/233 modules 12 active /Users/kyle/Code/design-system/node_modules/styled-components/dist/styled-components.browser.esm.js + [webpack.Progress] 36% building 221/234 modules 13 active /Users/kyle/Code/design-system/node_modules/lodash/pickBy.js + [webpack.Progress] 36% building 221/235 modules 14 active delegated "yH/f" from dll-reference storybook_docs_dll + [webpack.Progress] 36% building 222/235 modules 13 active /Users/kyle/Code/design-system/node_modules/lodash/pickBy.js + [webpack.Progress] 36% building 223/235 modules 12 active /Users/kyle/Code/design-system/node_modules/lodash/pickBy.js + [webpack.Progress] 36% building 223/236 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/blocks/enhanceSource.js + [webpack.Progress] 36% building 223/237 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/withActions.js + [webpack.Progress] 36% building 223/238 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/decorateAction.js + [webpack.Progress] 36% building 223/239 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/HandlerFunction.js + [webpack.Progress] 36% building 223/240 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/DecoratorFunction.js + [webpack.Progress] 36% building 223/241 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/preview/actions.js + [webpack.Progress] 36% building 223/242 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsMap.js + [webpack.Progress] 36% building 223/243 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionOptions.js + [webpack.Progress] 36% building 223/244 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 36% building 224/244 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 225/244 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 226/244 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 227/244 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 228/244 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 228/245 modules 17 active delegated "Yct5" from dll-reference storybook_docs_dll + [webpack.Progress] 37% building 229/245 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 229/246 modules 17 active delegated "aoZ+" from dll-reference storybook_docs_dll + [webpack.Progress] 37% building 230/246 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 231/246 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/dist/models/ActionsFunction.js + [webpack.Progress] 37% building 231/247 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/channels/dist/index.js + [webpack.Progress] 37% building 231/248 modules 17 active delegated "hpdy" from dll-reference storybook_docs_dll + [webpack.Progress] 37% building 232/248 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/channels/dist/index.js + [webpack.Progress] 37% building 232/249 modules 17 active delegated "tJVe" from dll-reference storybook_docs_dll + [webpack.Progress] 37% building 233/249 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/channels/dist/index.js + [webpack.Progress] 37% building 233/250 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/index.js + [webpack.Progress] 37% building 233/251 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/TooltipNote.js + [webpack.Progress] 38% building 234/251 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/TooltipNote.js + [webpack.Progress] 38% building 234/252 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/utils/string.js + [webpack.Progress] 38% building 234/253 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/utils/docgenInfo.js + [webpack.Progress] 38% building 234/254 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/Badge/Badge.js + [webpack.Progress] 38% building 235/254 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/Badge/Badge.js + [webpack.Progress] 38% building 235/255 modules 20 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Spinner.js + [webpack.Progress] 38% building 236/255 modules 19 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Spinner.js + [webpack.Progress] 38% building 237/255 modules 18 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Spinner.js + [webpack.Progress] 38% building 238/255 modules 17 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Spinner.js + [webpack.Progress] 38% building 238/256 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 38% building 239/256 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 38% building 240/256 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 38% building 241/256 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 242/256 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 243/256 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 244/256 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 245/256 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 246/256 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 247/256 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 248/256 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/html.js + [webpack.Progress] 39% building 248/257 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/animation.ts + [webpack.Progress] 39% building 248/258 modules 10 active delegated "PjZX" from dll-reference storybook_docs_dll + [webpack.Progress] 39% building 249/258 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/node_modules/react-docgen-typescript-loader/dist/index.js??ref--15-0!/Users/kyle/Code/design-system/src/components/shared/animation.ts + [webpack.Progress] 39% building 249/259 modules 10 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.json.to-string-tag.js + [webpack.Progress] 39% building 249/260 modules 11 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.math.to-string-tag.js + [webpack.Progress] 39% building 249/261 modules 12 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.unscopables.js + [webpack.Progress] 39% building 249/262 modules 13 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.to-string-tag.js + [webpack.Progress] 39% building 249/263 modules 14 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.to-primitive.js + [webpack.Progress] 39% building 249/264 modules 15 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.split.js + [webpack.Progress] 39% building 249/265 modules 16 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.species.js + [webpack.Progress] 39% building 249/266 modules 17 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.search.js + [webpack.Progress] 39% building 249/267 modules 18 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.replace.js + [webpack.Progress] 39% building 249/268 modules 19 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.match-all.js + [webpack.Progress] 39% building 249/269 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.match.js + [webpack.Progress] 39% building 249/270 modules 21 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.is-concat-spreadable.js + [webpack.Progress] 39% building 249/271 modules 22 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.has-instance.js + [webpack.Progress] 39% building 249/272 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 39% building 249/273 modules 24 active delegated "AuHH" from dll-reference storybook_docs_dll + [webpack.Progress] 40% building 250/273 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 250/274 modules 24 active delegated "N+ot" from dll-reference storybook_docs_dll + [webpack.Progress] 40% building 251/274 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 251/275 modules 24 active delegated "5Yy7" from dll-reference storybook_docs_dll + [webpack.Progress] 40% building 252/275 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 253/275 modules 22 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 253/276 modules 23 active delegated "Y9Ll" from dll-reference storybook_docs_dll + [webpack.Progress] 40% building 254/276 modules 22 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 254/277 modules 23 active delegated "VrFO" from dll-reference storybook_docs_dll + [webpack.Progress] 40% building 255/277 modules 22 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 255/278 modules 23 active delegated "OZaJ" from dll-reference storybook_docs_dll + [webpack.Progress] 40% building 256/278 modules 22 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 257/278 modules 21 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 258/278 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.symbol.async-iterator.js + [webpack.Progress] 40% building 258/279 modules 21 active /Users/kyle/Code/design-system/node_modules/core-js/internals/flatten-into-array.js + [webpack.Progress] 40% building 258/280 modules 22 active delegated "N9G2" from dll-reference storybook_docs_dll + [webpack.Progress] 41% building 259/280 modules 21 active /Users/kyle/Code/design-system/node_modules/core-js/internals/flatten-into-array.js + [webpack.Progress] 41% building 260/280 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/internals/flatten-into-array.js + [webpack.Progress] 41% building 260/281 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/preview/argsStory.js + [webpack.Progress] 41% building 260/282 modules 22 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/arrayLikeToArray.js + [webpack.Progress] 41% building 260/283 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/preview/render.js + [webpack.Progress] 41% building 260/284 modules 24 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/preview/globals.js + [webpack.Progress] 41% building 261/284 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/react/dist/client/preview/globals.js + [webpack.Progress] 41% building 261/285 modules 24 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-yaml.js + [webpack.Progress] 41% building 261/286 modules 25 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-css.js + [webpack.Progress] 41% building 261/287 modules 26 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-json.js + [webpack.Progress] 41% building 261/288 modules 27 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-typescript.js + [webpack.Progress] 41% building 261/289 modules 28 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-javascript.js + [webpack.Progress] 41% building 261/290 modules 29 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-bash.js + [webpack.Progress] 41% building 261/291 modules 30 active delegated "Cm4o" from dll-reference storybook_docs_dll + [webpack.Progress] 41% building 262/291 modules 29 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-bash.js + [webpack.Progress] 41% building 263/291 modules 28 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-bash.js + [webpack.Progress] 41% building 263/292 modules 29 active delegated "sVFb" from dll-reference storybook_docs_dll + [webpack.Progress] 41% building 264/292 modules 28 active /Users/kyle/Code/design-system/node_modules/prismjs/components/prism-bash.js + [webpack.Progress] 41% building 264/293 modules 29 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createType.js + [webpack.Progress] 41% building 264/294 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/Loader/Loader.js + [webpack.Progress] 41% building 264/295 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/typeScript/createDefaultValue.js + [webpack.Progress] 41% building 264/296 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/brand/StorybookIcon.js + [webpack.Progress] 41% building 264/297 modules 33 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/brand/StorybookLogo.js + [webpack.Progress] 41% building 264/298 modules 34 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/flow/createDefaultValue.js + [webpack.Progress] 41% building 264/299 modules 35 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/docgen/flow/createType.js + [webpack.Progress] 41% building 264/300 modules 36 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/icon/icon.js + [webpack.Progress] 41% building 264/301 modules 37 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/addon-panel/addon-panel.js + [webpack.Progress] 41% building 264/302 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/bar/bar.js + [webpack.Progress] 41% building 264/303 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/bar/separator.js + [webpack.Progress] 41% building 264/304 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/bar/button.js + [webpack.Progress] 41% building 264/305 modules 41 active delegated "tVqn" from dll-reference storybook_docs_dll + [webpack.Progress] 41% building 265/305 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/bar/button.js + [webpack.Progress] 41% building 265/306 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tabs/tabs.js + [webpack.Progress] 41% building 265/307 modules 42 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/TooltipLinkList.js + [webpack.Progress] 41% building 265/308 modules 43 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/TooltipNote.js + [webpack.Progress] 41% building 265/309 modules 44 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/TooltipMessage.js + [webpack.Progress] 41% building 265/310 modules 45 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 41% building 266/310 modules 44 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 267/310 modules 43 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 268/310 modules 42 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 269/310 modules 41 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 270/310 modules 40 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 271/310 modules 39 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 272/310 modules 38 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 273/310 modules 37 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 42% building 274/310 modules 36 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 275/310 modules 35 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 276/310 modules 34 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 277/310 modules 33 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 278/310 modules 32 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 279/310 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 279/311 modules 32 active delegated "H87J" from dll-reference storybook_docs_dll + [webpack.Progress] 43% building 280/311 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 281/311 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/WithTooltip.js + [webpack.Progress] 43% building 281/312 modules 31 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 43% building 282/312 modules 30 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 43% building 283/312 modules 29 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 284/312 modules 28 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 285/312 modules 27 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 286/312 modules 26 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 286/313 modules 27 active delegated "F63i" from dll-reference storybook_docs_dll + [webpack.Progress] 44% building 287/313 modules 26 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 288/313 modules 25 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 289/313 modules 24 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 290/313 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 44% building 291/313 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 45% building 292/313 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 45% building 293/313 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/index.js + [webpack.Progress] 45% building 293/314 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/utils.js + [webpack.Progress] 45% building 293/315 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/ensure.js + [webpack.Progress] 45% building 293/316 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/create.js + [webpack.Progress] 45% building 293/317 modules 24 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/convert.js + [webpack.Progress] 45% building 294/317 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/convert.js + [webpack.Progress] 45% building 295/317 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/convert.js + [webpack.Progress] 45% building 296/317 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/convert.js + [webpack.Progress] 45% building 297/317 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/convert.js + [webpack.Progress] 45% building 297/318 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/global.js + [webpack.Progress] 45% building 298/318 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/global.js + [webpack.Progress] 45% building 299/318 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/global.js + [webpack.Progress] 45% building 299/319 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/index.js + [webpack.Progress] 45% building 299/320 modules 21 active /Users/kyle/Code/design-system/node_modules/uuid/index.js + [webpack.Progress] 45% building 299/321 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/types.js + [webpack.Progress] 45% building 299/322 modules 23 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 300/322 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 301/322 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 302/322 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 303/322 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 304/322 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 305/322 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 306/322 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 307/322 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 46% building 308/322 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 47% building 309/322 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 47% building 310/322 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 47% building 311/322 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/base.js + [webpack.Progress] 47% building 311/323 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/index.js + [webpack.Progress] 47% building 311/324 modules 13 active delegated "/Qos" from dll-reference storybook_docs_dll + [webpack.Progress] 47% building 312/324 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/index.js + [webpack.Progress] 47% building 312/325 modules 13 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 47% building 313/325 modules 12 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 47% building 314/325 modules 11 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 47% building 314/326 modules 12 active delegated "P2aG" from dll-reference storybook_docs_dll + [webpack.Progress] 47% building 315/326 modules 11 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 47% building 315/327 modules 12 active delegated "JY+C" from dll-reference storybook_docs_dll + [webpack.Progress] 47% building 316/327 modules 11 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 317/327 modules 10 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 318/327 modules 9 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 319/327 modules 8 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 320/327 modules 7 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 320/328 modules 8 active delegated "5BYb" from dll-reference storybook_docs_dll + [webpack.Progress] 48% building 321/328 modules 7 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 322/328 modules 6 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 323/328 modules 5 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 323/329 modules 6 active delegated "9JhN" from dll-reference storybook_docs_dll + [webpack.Progress] 48% building 324/329 modules 5 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 48% building 324/330 modules 6 active delegated "aokA" from dll-reference storybook_docs_dll + [webpack.Progress] 49% building 325/330 modules 5 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 49% building 326/330 modules 4 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 49% building 326/331 modules 5 active delegated "+kY7" from dll-reference storybook_docs_dll + [webpack.Progress] 49% building 327/331 modules 4 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 49% building 328/331 modules 3 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 49% building 328/332 modules 4 active delegated "A3UQ" from dll-reference storybook_docs_dll + [webpack.Progress] 49% building 329/332 modules 3 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/doctrine.js + [webpack.Progress] 49% building 329/333 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/DocumentFormatting.js + [webpack.Progress] 49% building 330/333 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/DocumentFormatting.js + [webpack.Progress] 49% building 330/334 modules 4 active delegated "xt6W" from dll-reference storybook_docs_dll + [webpack.Progress] 49% building 331/334 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/DocumentFormatting.js + [webpack.Progress] 49% building 332/334 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/DocumentFormatting.js + [webpack.Progress] 49% building 332/335 modules 3 active delegated "IRf+" from dll-reference storybook_docs_dll + [webpack.Progress] 49% building 333/335 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/DocumentFormatting.js + [webpack.Progress] 49% building 333/336 modules 3 active /Users/kyle/Code/design-system/node_modules/prismjs/prism.js + [webpack.Progress] 50% building 334/336 modules 2 active /Users/kyle/Code/design-system/node_modules/prismjs/prism.js + [webpack.Progress] 50% building 334/337 modules 3 active delegated "OCSl" from dll-reference storybook_docs_dll + [webpack.Progress] 50% building 335/337 modules 2 active /Users/kyle/Code/design-system/node_modules/prismjs/prism.js + [webpack.Progress] 50% building 335/338 modules 3 active delegated "7nmT" from dll-reference storybook_docs_dll + [webpack.Progress] 50% building 336/338 modules 2 active /Users/kyle/Code/design-system/node_modules/prismjs/prism.js + [webpack.Progress] 50% building 336/339 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/icon/svg.js + [webpack.Progress] 50% building 336/340 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/icon/icons.js + [webpack.Progress] 50% building 336/341 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v1.js + [webpack.Progress] 50% building 337/341 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v1.js + [webpack.Progress] 50% building 337/342 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v5.js + [webpack.Progress] 50% building 337/343 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/core/client.js + [webpack.Progress] 50% building 337/344 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/Tooltip.js + [webpack.Progress] 50% building 337/345 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/shared/animation.js + [webpack.Progress] 50% building 338/345 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/shared/animation.js + [webpack.Progress] 50% building 338/346 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v4.js + [webpack.Progress] 50% building 338/347 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v3.js + [webpack.Progress] 50% building 338/348 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/convert.js + [webpack.Progress] 50% building 338/349 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/types.js + [webpack.Progress] 50% building 338/350 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/animation.js + [webpack.Progress] 50% building 338/351 modules 13 active /Users/kyle/Code/design-system/node_modules/uuid/v1.js + [webpack.Progress] 50% building 338/352 modules 14 active /Users/kyle/Code/design-system/node_modules/uuid/v4.js + [webpack.Progress] 50% building 338/353 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/input/input.js + [webpack.Progress] 50% building 338/354 modules 16 active /Users/kyle/Code/design-system/node_modules/stylis/stylis.min.js + [webpack.Progress] 50% building 338/355 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/field/field.js + [webpack.Progress] 50% building 339/355 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/field/field.js + [webpack.Progress] 50% building 340/355 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/form/field/field.js + [webpack.Progress] 50% building 340/356 modules 16 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/index.js + [webpack.Progress] 50% building 340/357 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/index.js + [webpack.Progress] 50% building 340/358 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/index.js + [webpack.Progress] 50% building 341/358 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/index.js + [webpack.Progress] 51% building 342/358 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/index.js + [webpack.Progress] 51% building 343/358 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/index.js + [webpack.Progress] 51% building 344/358 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/index.js + [webpack.Progress] 51% building 345/358 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/index.js + [webpack.Progress] 51% building 345/359 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/modules/syntax.js + [webpack.Progress] 51% building 345/360 modules 15 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/utility.js + [webpack.Progress] 51% building 345/361 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/themes/light.js + [webpack.Progress] 51% building 345/362 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/themes/dark.js + [webpack.Progress] 51% building 345/363 modules 18 active delegated "lN5B" from dll-reference storybook_docs_dll + [webpack.Progress] 51% building 346/363 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/dist/themes/dark.js + [webpack.Progress] 51% building 346/364 modules 18 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/typed.js + [webpack.Progress] 51% building 347/364 modules 17 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/typed.js + [webpack.Progress] 51% building 348/364 modules 16 active /Users/kyle/Code/design-system/node_modules/doctrine/lib/typed.js + [webpack.Progress] 51% building 348/365 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 51% building 349/365 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 350/365 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 351/365 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 352/365 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 353/365 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 354/365 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 355/365 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/rng.js + [webpack.Progress] 52% building 355/366 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/shared.js + [webpack.Progress] 52% building 355/367 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v35.js + [webpack.Progress] 52% building 356/367 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v35.js + [webpack.Progress] 52% building 356/368 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/sha1.js + [webpack.Progress] 52% building 356/369 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 52% building 357/369 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 52% building 358/369 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 53% building 359/369 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 53% building 360/369 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 53% building 361/369 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 53% building 362/369 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 53% building 363/369 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/bytesToUuid.js + [webpack.Progress] 53% building 363/370 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 53% building 364/370 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 53% building 365/370 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 53% building 365/371 modules 6 active delegated "LJ7e" from dll-reference storybook_docs_dll + [webpack.Progress] 53% building 366/371 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 53% building 366/372 modules 6 active delegated "DY47" from dll-reference storybook_docs_dll + [webpack.Progress] 54% building 367/372 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 367/373 modules 6 active delegated "I2fK" from dll-reference storybook_docs_dll + [webpack.Progress] 54% building 368/373 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 368/374 modules 6 active delegated "l1C2" from dll-reference storybook_docs_dll + [webpack.Progress] 54% building 369/374 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 370/374 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 371/374 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 372/374 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 373/374 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 373/375 modules 2 active /Users/kyle/Code/design-system/node_modules/doctrine/package.json + [webpack.Progress] 54% building 374/375 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/md5.js + [webpack.Progress] 54% building 375/375 modules 0 active + [webpack.Progress] 54% building 375/376 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/types.js + [webpack.Progress] 54% building 375/377 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Text.js + [webpack.Progress] 54% building 375/378 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Range.js + [webpack.Progress] 54% building 375/379 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/Description.js + [webpack.Progress] 54% building 375/380 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/IconGallery.js + [webpack.Progress] 54% building 375/381 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ColorPalette.js + [webpack.Progress] 54% building 375/382 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/Typeset.js + [webpack.Progress] 54% building 375/383 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/IFrame.js + [webpack.Progress] 54% building 375/384 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/Story.js + [webpack.Progress] 54% building 375/385 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/Source.js + [webpack.Progress] 54% building 375/386 modules 11 active /Users/kyle/Code/design-system/node_modules/uuid/lib/bytesToUuid.js + [webpack.Progress] 54% building 375/387 modules 12 active /Users/kyle/Code/design-system/node_modules/uuid/lib/rng-browser.js + [webpack.Progress] 54% building 375/388 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/Button/Button.js + [webpack.Progress] 54% building 375/389 modules 14 active /Users/kyle/Code/design-system/node_modules/assert/assert.js + [webpack.Progress] 54% building 375/390 modules 15 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/components/Modal.js + [webpack.Progress] 54% building 375/391 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/Preview.js + [webpack.Progress] 54% building 375/392 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/DocsPage.js + [webpack.Progress] 54% building 375/393 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Object.js + [webpack.Progress] 54% building 375/394 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Number.js + [webpack.Progress] 54% building 375/395 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Date.js + [webpack.Progress] 54% building 375/396 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Color.js + [webpack.Progress] 54% building 375/397 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 376/397 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 377/397 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 378/397 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 379/397 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 380/397 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 381/397 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 382/397 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 55% building 383/397 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 56% building 384/397 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 56% building 385/397 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Boolean.js + [webpack.Progress] 56% building 385/398 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 386/398 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 386/399 modules 13 active delegated "vbDw" from dll-reference storybook_docs_dll + [webpack.Progress] 56% building 387/399 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 388/399 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 389/399 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 390/399 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 391/399 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/Array.js + [webpack.Progress] 56% building 391/400 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 392/400 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 392/401 modules 9 active delegated "3kp9" from dll-reference storybook_docs_dll + [webpack.Progress] 57% building 393/401 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 394/401 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 395/401 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 396/401 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 397/401 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 398/401 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 399/401 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/tooltip/ListItem.js + [webpack.Progress] 57% building 399/402 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/link/link.js + [webpack.Progress] 57% building 399/403 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/placeholder/placeholder.js + [webpack.Progress] 57% building 399/404 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/theming/node_modules/polished/dist/polished.esm.js + [webpack.Progress] 57% building 399/405 modules 6 active /Users/kyle/Code/design-system/node_modules/esutils/lib/utils.js + [webpack.Progress] 57% building 400/405 modules 5 active /Users/kyle/Code/design-system/node_modules/esutils/lib/utils.js + [webpack.Progress] 58% building 401/405 modules 4 active /Users/kyle/Code/design-system/node_modules/esutils/lib/utils.js + [webpack.Progress] 58% building 401/406 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ScrollArea/ScrollArea.js + [webpack.Progress] 58% building 401/407 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/EmptyBlock.js + [webpack.Progress] 58% building 401/408 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ZoomContext.js + [webpack.Progress] 58% building 402/408 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ZoomContext.js + [webpack.Progress] 58% building 403/408 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ZoomContext.js + [webpack.Progress] 58% building 404/408 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ZoomContext.js + [webpack.Progress] 58% building 405/408 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ZoomContext.js + [webpack.Progress] 58% building 405/409 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/syntaxhighlighter/syntaxhighlighter.js + [webpack.Progress] 58% building 405/410 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/Toolbar.js + [webpack.Progress] 58% building 405/411 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/index.js + [webpack.Progress] 58% building 405/412 modules 7 active /Users/kyle/Code/design-system/node_modules/util/util.js + [webpack.Progress] 58% building 406/412 modules 6 active /Users/kyle/Code/design-system/node_modules/util/util.js + [webpack.Progress] 58% building 406/413 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/BlockBackgroundStyles.js + [webpack.Progress] 58% building 406/414 modules 8 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/components/ModalPortal.js + [webpack.Progress] 58% building 406/415 modules 9 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/safeHTMLElement.js + [webpack.Progress] 58% building 406/416 modules 10 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/ariaAppHider.js + [webpack.Progress] 58% building 407/416 modules 9 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/ariaAppHider.js + [webpack.Progress] 58% building 408/416 modules 8 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/ariaAppHider.js + [webpack.Progress] 58% building 408/417 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/typescript/index.js + [webpack.Progress] 58% building 408/418 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 409/418 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 410/418 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 410/419 modules 9 active delegated "mmUj" from dll-reference storybook_docs_dll + [webpack.Progress] 59% building 411/419 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 411/420 modules 9 active delegated "5o43" from dll-reference storybook_docs_dll + [webpack.Progress] 59% building 412/420 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 412/421 modules 9 active delegated "LUwd" from dll-reference storybook_docs_dll + [webpack.Progress] 59% building 413/421 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 413/422 modules 9 active delegated "j4Sf" from dll-reference storybook_docs_dll + [webpack.Progress] 59% building 414/422 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 415/422 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 59% building 416/422 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 60% building 417/422 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 60% building 418/422 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ActionBar/ActionBar.js + [webpack.Progress] 60% building 418/423 modules 5 active /Users/kyle/Code/design-system/node_modules/esutils/lib/ast.js + [webpack.Progress] 60% building 419/423 modules 4 active /Users/kyle/Code/design-system/node_modules/esutils/lib/ast.js + [webpack.Progress] 60% building 420/423 modules 3 active /Users/kyle/Code/design-system/node_modules/esutils/lib/ast.js + [webpack.Progress] 60% building 420/424 modules 4 active /Users/kyle/Code/design-system/node_modules/esutils/lib/code.js + [webpack.Progress] 60% building 420/425 modules 5 active /Users/kyle/Code/design-system/node_modules/esutils/lib/keyword.js + [webpack.Progress] 60% building 420/426 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/index.js + [webpack.Progress] 60% building 420/427 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/index.js + [webpack.Progress] 60% building 420/428 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/index.js + [webpack.Progress] 60% building 421/428 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/index.js + [webpack.Progress] 60% building 422/428 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/index.js + [webpack.Progress] 60% building 422/429 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ScrollArea/ScrollAreaStyles.js + [webpack.Progress] 60% building 422/430 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ScrollArea/OverlayScrollbarsComponent.js + [webpack.Progress] 60% building 422/431 modules 9 active delegated "zF5n" from dll-reference storybook_docs_dll + [webpack.Progress] 60% building 423/431 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ScrollArea/OverlayScrollbarsComponent.js + [webpack.Progress] 60% building 423/432 modules 9 active delegated "O1Sc" from dll-reference storybook_docs_dll + [webpack.Progress] 60% building 424/432 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/ScrollArea/OverlayScrollbarsComponent.js + [webpack.Progress] 60% building 424/433 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/node_modules/polished/dist/polished.esm.js + [webpack.Progress] 61% building 425/433 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/node_modules/polished/dist/polished.esm.js + [webpack.Progress] 61% building 425/434 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 426/434 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 427/434 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 427/435 modules 8 active delegated "lZm3" from dll-reference storybook_docs_dll + [webpack.Progress] 61% building 428/435 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 428/436 modules 8 active delegated "ssvU" from dll-reference storybook_docs_dll + [webpack.Progress] 61% building 429/436 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 430/436 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 431/436 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/index.js + [webpack.Progress] 61% building 431/437 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/syntaxhighlighter/formatter.js + [webpack.Progress] 61% building 432/437 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/syntaxhighlighter/formatter.js + [webpack.Progress] 61% building 432/438 modules 6 active delegated "Blm6" from dll-reference storybook_docs_dll + [webpack.Progress] 61% building 433/438 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/syntaxhighlighter/formatter.js + [webpack.Progress] 62% building 434/438 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/syntaxhighlighter/formatter.js + [webpack.Progress] 62% building 435/438 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/syntaxhighlighter/formatter.js + [webpack.Progress] 62% building 435/439 modules 4 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/bodyTrap.js + [webpack.Progress] 62% building 435/440 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/types.js + [webpack.Progress] 62% building 436/440 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/types.js + [webpack.Progress] 62% building 437/440 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/types.js + [webpack.Progress] 62% building 437/441 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/typescript/convert.js + [webpack.Progress] 62% building 437/442 modules 5 active /Users/kyle/Code/design-system/node_modules/util/support/isBufferBrowser.js + [webpack.Progress] 62% building 438/442 modules 4 active /Users/kyle/Code/design-system/node_modules/util/support/isBufferBrowser.js + [webpack.Progress] 62% building 438/443 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/typescript/types.js + [webpack.Progress] 62% building 438/444 modules 6 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Radio.js + [webpack.Progress] 62% building 438/445 modules 7 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Checkbox.js + [webpack.Progress] 62% building 438/446 modules 8 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/tooltip/TooltipLinkList.js + [webpack.Progress] 62% building 438/447 modules 9 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/ProgressDots.js + [webpack.Progress] 62% building 438/448 modules 10 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Badge.js + [webpack.Progress] 62% building 438/449 modules 11 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/portalOpenInstances.js + [webpack.Progress] 62% building 438/450 modules 12 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/scopeTab.js + [webpack.Progress] 62% building 438/451 modules 13 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/classList.js + [webpack.Progress] 62% building 438/452 modules 14 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/focusManager.js + [webpack.Progress] 62% building 438/453 modules 15 active delegated "HUCg" from dll-reference storybook_docs_dll + [webpack.Progress] 62% building 439/453 modules 14 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/focusManager.js + [webpack.Progress] 62% building 439/454 modules 15 active delegated "CUMQ" from dll-reference storybook_docs_dll + [webpack.Progress] 62% building 440/454 modules 14 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/focusManager.js + [webpack.Progress] 62% building 440/455 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/typography/DocumentWrapper.js + [webpack.Progress] 62% building 440/456 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/rawDefaultPropResolvers.js + [webpack.Progress] 62% building 440/457 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/sortProps.js + [webpack.Progress] 62% building 441/457 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/sortProps.js + [webpack.Progress] 63% building 442/457 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/sortProps.js + [webpack.Progress] 63% building 442/458 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/createType.js + [webpack.Progress] 63% building 442/459 modules 17 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.sort.js + [webpack.Progress] 63% building 442/460 modules 18 active delegated "PuIx" from dll-reference storybook_docs_dll + [webpack.Progress] 63% building 443/460 modules 17 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.array.sort.js + [webpack.Progress] 63% building 443/461 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/spaced/Spaced.js + [webpack.Progress] 63% building 443/462 modules 19 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/types.js + [webpack.Progress] 63% building 443/463 modules 20 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/PropsTable.js + [webpack.Progress] 63% building 443/464 modules 21 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/Options.js + [webpack.Progress] 63% building 443/465 modules 22 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/TabbedArgsTable.js + [webpack.Progress] 63% building 443/466 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.replace-all.js + [webpack.Progress] 63% building 443/467 modules 24 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/ArgsTable.js + [webpack.Progress] 63% building 443/468 modules 25 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.pattern-match.js + [webpack.Progress] 63% building 443/469 modules 26 active delegated "b2e3" from dll-reference storybook_docs_dll + [webpack.Progress] 63% building 444/469 modules 25 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.pattern-match.js + [webpack.Progress] 63% building 445/469 modules 24 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.pattern-match.js + [webpack.Progress] 63% building 445/470 modules 25 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.observable.js + [webpack.Progress] 63% building 446/470 modules 24 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.observable.js + [webpack.Progress] 63% building 447/470 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.observable.js + [webpack.Progress] 63% building 447/471 modules 24 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 63% building 448/471 modules 23 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 63% building 449/471 modules 22 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 450/471 modules 21 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 451/471 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 451/472 modules 21 active delegated "kA4r" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 452/472 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 452/473 modules 21 active delegated "maj8" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 453/473 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 453/474 modules 21 active delegated "fhSp" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 454/474 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 454/475 modules 21 active delegated "cxan" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 455/475 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 455/476 modules 21 active delegated "pWxA" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 456/476 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 456/477 modules 21 active delegated "+lMt" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 457/477 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 64% building 457/478 modules 21 active delegated "BFfR" from dll-reference storybook_docs_dll + [webpack.Progress] 64% building 458/478 modules 20 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 65% building 459/478 modules 19 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 65% building 460/478 modules 18 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 65% building 461/478 modules 17 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.dispose.js + [webpack.Progress] 65% building 461/479 modules 18 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/convert.js + [webpack.Progress] 65% building 462/479 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/convert.js + [webpack.Progress] 65% building 463/479 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/convert.js + [webpack.Progress] 65% building 463/480 modules 17 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 65% building 464/480 modules 16 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 65% building 465/480 modules 15 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 65% building 466/480 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 467/480 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 468/480 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 469/480 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 470/480 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 471/480 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 472/480 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 473/480 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 66% building 474/480 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 67% building 475/480 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 67% building 476/480 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 67% building 477/480 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 67% building 478/480 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/proptypes/types.js + [webpack.Progress] 67% building 479/480 modules 1 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--4-0!/Users/kyle/Code/design-system/src/components/Radio.js + [webpack.Progress] 67% building 479/481 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 67% building 479/482 modules 3 active delegated "Monn" from dll-reference storybook_docs_dll + [webpack.Progress] 67% building 480/482 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 67% building 480/483 modules 3 active delegated "xaiR" from dll-reference storybook_docs_dll + [webpack.Progress] 67% building 481/483 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 67% building 481/484 modules 3 active delegated "JmTi" from dll-reference storybook_docs_dll + [webpack.Progress] 67% building 482/484 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 67% building 482/485 modules 3 active delegated "o3fS" from dll-reference storybook_docs_dll + [webpack.Progress] 67% building 483/485 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 67% building 483/486 modules 3 active delegated "WoRU" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 484/486 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 484/487 modules 3 active delegated "Wci6" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 485/487 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 485/488 modules 3 active delegated "muFx" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 486/488 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 486/489 modules 3 active delegated "+Bxv" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 487/489 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 487/490 modules 3 active delegated "/JuR" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 488/490 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 488/491 modules 3 active delegated "/bc2" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 489/491 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 490/491 modules 1 active /Users/kyle/Code/design-system/node_modules/core-js/modules/esnext.symbol.async-dispose.js + [webpack.Progress] 68% building 490/492 modules 2 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/tabbable.js + [webpack.Progress] 68% building 490/493 modules 3 active delegated "T4+q" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 491/493 modules 2 active /Users/kyle/Code/design-system/node_modules/react-modal/lib/helpers/tabbable.js + [webpack.Progress] 68% building 491/494 modules 3 active /Users/kyle/Code/design-system/node_modules/merge-anything/dist/index.esm.js + [webpack.Progress] 68% building 491/495 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/generateFuncSignature.js + [webpack.Progress] 68% building 491/496 modules 5 active delegated "lSUb" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 492/496 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/generateFuncSignature.js + [webpack.Progress] 69% building 492/497 modules 5 active delegated "f4p7" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 493/497 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/propTypes/generateFuncSignature.js + [webpack.Progress] 69% building 493/498 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/index.js + [webpack.Progress] 69% building 493/499 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/PropRow.js + [webpack.Progress] 69% building 493/500 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/SectionRow.js + [webpack.Progress] 69% building 493/501 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/PropDef.js + [webpack.Progress] 68% building 493/502 modules 9 active delegated "SlD/" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 494/502 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/PropDef.js + [webpack.Progress] 68% building 494/503 modules 9 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/Checkbox.js + [webpack.Progress] 68% building 494/504 modules 10 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/Radio.js + [webpack.Progress] 68% building 494/505 modules 11 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/controls/options/Select.js + [webpack.Progress] 68% building 494/506 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/prettyIdentifier.js + [webpack.Progress] 68% building 494/507 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/SectionRow.js + [webpack.Progress] 68% building 494/508 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/ArgRow.js + [webpack.Progress] 68% building 494/509 modules 15 active /Users/kyle/Code/design-system/node_modules/exenv/index.js + [webpack.Progress] 68% building 495/509 modules 14 active /Users/kyle/Code/design-system/node_modules/exenv/index.js + [webpack.Progress] 68% building 495/510 modules 15 active delegated "lEaq" from dll-reference storybook_docs_dll + [webpack.Progress] 68% building 496/510 modules 14 active /Users/kyle/Code/design-system/node_modules/exenv/index.js + [webpack.Progress] 68% building 497/510 modules 13 active /Users/kyle/Code/design-system/node_modules/exenv/index.js + [webpack.Progress] 68% building 497/511 modules 14 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/utils.js + [webpack.Progress] 68% building 498/511 modules 13 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/utils.js + [webpack.Progress] 68% building 499/511 modules 12 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/sbtypes/utils.js + [webpack.Progress] 68% building 499/512 modules 13 active /Users/kyle/Code/design-system/node_modules/util/node_modules/inherits/inherits_browser.js + [webpack.Progress] 68% building 500/512 modules 12 active /Users/kyle/Code/design-system/node_modules/util/node_modules/inherits/inherits_browser.js + [webpack.Progress] 68% building 501/512 modules 11 active /Users/kyle/Code/design-system/node_modules/util/node_modules/inherits/inherits_browser.js + [webpack.Progress] 68% building 501/513 modules 12 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 68% building 502/513 modules 11 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 68% building 503/513 modules 10 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 68% building 504/513 modules 9 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 505/513 modules 8 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 506/513 modules 7 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 507/513 modules 6 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 508/513 modules 5 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 509/513 modules 4 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 510/513 modules 3 active /Users/kyle/Code/design-system/node_modules/stylis-rule-sheet/index.js + [webpack.Progress] 69% building 510/514 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/index.js + [webpack.Progress] 69% building 510/515 modules 5 active /Users/kyle/Code/design-system/node_modules/stable/stable.js + [webpack.Progress] 69% building 511/515 modules 4 active /Users/kyle/Code/design-system/node_modules/stable/stable.js + [webpack.Progress] 69% building 512/515 modules 3 active /Users/kyle/Code/design-system/node_modules/stable/stable.js + [webpack.Progress] 69% building 513/515 modules 2 active /Users/kyle/Code/design-system/node_modules/stable/stable.js + [webpack.Progress] 69% building 514/515 modules 1 active /Users/kyle/Code/design-system/node_modules/stable/stable.js + [webpack.Progress] 69% building 514/516 modules 2 active delegated "fmNP" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 515/516 modules 1 active /Users/kyle/Code/design-system/node_modules/stable/stable.js + [webpack.Progress] 70% building 516/516 modules 0 active + [webpack.Progress] 69% building 516/517 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/PropJsDoc.js + [webpack.Progress] 69% building 516/518 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/PropsTable/PropValue.js + [webpack.Progress] 69% building 516/519 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/start.js + [webpack.Progress] 69% building 516/520 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/ArgJsDoc.js + [webpack.Progress] 69% building 516/521 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/ArgValue.js + [webpack.Progress] 69% building 516/522 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/components/dist/blocks/ArgsTable/ArgControl.js + [webpack.Progress] 69% building 516/523 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/lib/index.js + [webpack.Progress] 69% building 516/524 modules 8 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 517/524 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 518/524 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 519/524 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 520/524 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 521/524 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 522/524 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/index.js + [webpack.Progress] 69% building 522/525 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/createDefaultValue.js + [webpack.Progress] 69% building 522/526 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/createFromRawDefaultProp.js + [webpack.Progress] 69% building 522/527 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/index.js + [webpack.Progress] 69% building 523/527 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/index.js + [webpack.Progress] 69% building 524/527 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/index.js + [webpack.Progress] 69% building 525/527 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/index.js + [webpack.Progress] 69% building 526/527 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/index.js + [webpack.Progress] 70% building 527/527 modules 0 active + [webpack.Progress] 69% building 527/528 modules 1 active delegated "Ee2X" from dll-reference storybook_docs_dll + [webpack.Progress] 70% building 528/528 modules 0 active + [webpack.Progress] 69% building 528/529 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/url.js + [webpack.Progress] 69% building 528/530 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/loadCsf.js + [webpack.Progress] 69% building 528/531 modules 3 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/StoryRenderer.js + [webpack.Progress] 69% building 528/532 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/captions.js + [webpack.Progress] 69% building 528/533 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/isHtmlTag.js + [webpack.Progress] 69% building 528/534 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/generateCode.js + [webpack.Progress] 69% building 528/535 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/generateObject.js + [webpack.Progress] 69% building 529/535 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/generateObject.js + [webpack.Progress] 69% building 530/535 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/generateObject.js + [webpack.Progress] 69% building 531/535 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/generateObject.js + [webpack.Progress] 69% building 531/536 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/defaultValues/generateArray.js + [webpack.Progress] 69% building 531/537 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/types.js + [webpack.Progress] 69% building 531/538 modules 7 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/inspectValue.js + [webpack.Progress] 69% building 532/538 modules 6 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/inspectValue.js + [webpack.Progress] 69% building 533/538 modules 5 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/inspectValue.js + [webpack.Progress] 69% building 534/538 modules 4 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/inspectValue.js + [webpack.Progress] 69% building 534/539 modules 5 active /Users/kyle/Code/design-system/node_modules/is-what/dist/index.esm.js + [webpack.Progress] 69% building 534/540 modules 6 active delegated "BGTi" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 535/540 modules 5 active /Users/kyle/Code/design-system/node_modules/is-what/dist/index.esm.js + [webpack.Progress] 69% building 536/540 modules 4 active /Users/kyle/Code/design-system/node_modules/is-what/dist/index.esm.js + [webpack.Progress] 69% building 537/540 modules 3 active /Users/kyle/Code/design-system/node_modules/is-what/dist/index.esm.js + [webpack.Progress] 69% building 538/540 modules 2 active /Users/kyle/Code/design-system/node_modules/is-what/dist/index.esm.js + [webpack.Progress] 69% building 539/540 modules 1 active /Users/kyle/Code/design-system/node_modules/is-what/dist/index.esm.js + [webpack.Progress] 70% building 540/540 modules 0 active + [webpack.Progress] 69% building 540/541 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/NoDocs.js + [webpack.Progress] 69% building 540/542 modules 2 active delegated "Kkar" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 541/542 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/NoDocs.js + [webpack.Progress] 69% building 541/543 modules 2 active delegated "2q8g" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 542/543 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/NoDocs.js + [webpack.Progress] 69% building 542/544 modules 2 active delegated "nDih" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 543/544 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/core/dist/client/preview/NoDocs.js + [webpack.Progress] 70% building 544/544 modules 0 active + [webpack.Progress] 69% building 544/545 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/addon-docs/dist/frameworks/react/lib/inspection/acornParser.js + [webpack.Progress] 69% building 544/546 modules 2 active /Users/kyle/Code/design-system/node_modules/@storybook/channel-postmessage/dist/index.js + [webpack.Progress] 69% building 545/546 modules 1 active /Users/kyle/Code/design-system/node_modules/@storybook/channel-postmessage/dist/index.js + [webpack.Progress] 69% building 545/547 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.string.ends-with.js + [webpack.Progress] 69% building 546/547 modules 1 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.string.ends-with.js + [webpack.Progress] 69% building 546/548 modules 2 active /Users/kyle/Code/design-system/node_modules/react-element-to-jsx-string/dist/cjs/index.js + [webpack.Progress] 69% building 547/548 modules 1 active /Users/kyle/Code/design-system/node_modules/react-element-to-jsx-string/dist/cjs/index.js + [webpack.Progress] 69% building 547/549 modules 2 active /Users/kyle/Code/design-system/node_modules/core-js/modules/es.number.is-integer.js + [webpack.Progress] 69% building 547/550 modules 3 active /Users/kyle/Code/design-system/node_modules/escodegen/escodegen.js + [webpack.Progress] 69% building 547/551 modules 4 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 548/551 modules 3 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 548/552 modules 4 active delegated "nuol" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 549/552 modules 3 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 549/553 modules 4 active delegated "cww3" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 550/553 modules 3 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 550/554 modules 4 active delegated "PjJO" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 551/554 modules 3 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 551/555 modules 4 active delegated "DpO5" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 552/555 modules 3 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 553/555 modules 2 active /Users/kyle/Code/design-system/node_modules/ansi-to-html/lib/ansi_to_html.js + [webpack.Progress] 69% building 553/556 modules 3 active /Users/kyle/Code/design-system/node_modules/html-tags/index.js + [webpack.Progress] 69% building 554/556 modules 2 active /Users/kyle/Code/design-system/node_modules/html-tags/index.js + [webpack.Progress] 69% building 555/556 modules 1 active /Users/kyle/Code/design-system/node_modules/html-tags/index.js + [webpack.Progress] 69% building 555/557 modules 2 active /Users/kyle/Code/design-system/node_modules/escodegen/package.json + [webpack.Progress] 69% building 556/557 modules 1 active /Users/kyle/Code/design-system/node_modules/html-tags/index.js + [webpack.Progress] 70% building 557/557 modules 0 active + [webpack.Progress] 69% building 557/558 modules 1 active /Users/kyle/Code/design-system/node_modules/core-js/internals/is-integer.js + [webpack.Progress] 69% building 557/559 modules 2 active /Users/kyle/Code/design-system/node_modules/html-tags/html-tags.json + [webpack.Progress] 69% building 558/559 modules 1 active /Users/kyle/Code/design-system/node_modules/html-tags/html-tags.json + [webpack.Progress] 70% building 559/559 modules 0 active + [webpack.Progress] 69% building 559/560 modules 1 active /Users/kyle/Code/design-system/node_modules/acorn/dist/acorn.mjs + [webpack.Progress] 69% building 559/561 modules 2 active /Users/kyle/Code/design-system/node_modules/acorn-walk/dist/walk.mjs + [webpack.Progress] 69% building 559/562 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/index.js + [webpack.Progress] 69% building 559/563 modules 4 active delegated "hQin" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 560/563 modules 3 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/index.js + [webpack.Progress] 69% building 561/563 modules 2 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/index.js + [webpack.Progress] 69% building 561/564 modules 3 active delegated "dSaG" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 562/564 modules 2 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/index.js + [webpack.Progress] 69% building 563/564 modules 1 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/index.js + [webpack.Progress] 70% building 564/564 modules 0 active + [webpack.Progress] 69% building 564/565 modules 1 active /Users/kyle/Code/design-system/node_modules/estraverse/estraverse.js + [webpack.Progress] 69% building 564/566 modules 2 active /Users/kyle/Code/design-system/node_modules/source-map/source-map.js + [webpack.Progress] 69% building 564/567 modules 3 active /Users/kyle/Code/design-system/node_modules/entities/index.js + [webpack.Progress] 69% building 565/567 modules 2 active /Users/kyle/Code/design-system/node_modules/entities/index.js + [webpack.Progress] 69% building 566/567 modules 1 active /Users/kyle/Code/design-system/node_modules/entities/index.js + [webpack.Progress] 69% building 566/568 modules 2 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/xhtml.js + [webpack.Progress] 69% building 567/568 modules 1 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/xhtml.js + [webpack.Progress] 69% building 567/569 modules 2 active /Users/kyle/Code/design-system/node_modules/estraverse/package.json + [webpack.Progress] 69% building 568/569 modules 1 active /Users/kyle/Code/design-system/node_modules/babel-loader/lib/index.js??ref--7-0!/Users/kyle/Code/design-system/node_modules/acorn-jsx/xhtml.js + [webpack.Progress] 70% building 569/569 modules 0 active + [webpack.Progress] 69% building 569/570 modules 1 active /Users/kyle/Code/design-system/node_modules/entities/lib/encode.js + [webpack.Progress] 69% building 569/571 modules 2 active /Users/kyle/Code/design-system/node_modules/entities/lib/decode.js + [webpack.Progress] 69% building 569/572 modules 3 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-map-generator.js + [webpack.Progress] 69% building 569/573 modules 4 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-map-consumer.js + [webpack.Progress] 69% building 569/574 modules 5 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-node.js + [webpack.Progress] 69% building 570/574 modules 4 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-node.js + [webpack.Progress] 69% building 571/574 modules 3 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-node.js + [webpack.Progress] 69% building 572/574 modules 2 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-node.js + [webpack.Progress] 69% building 573/574 modules 1 active /Users/kyle/Code/design-system/node_modules/source-map/lib/source-node.js + [webpack.Progress] 70% building 574/574 modules 0 active + [webpack.Progress] 69% building 574/575 modules 1 active /Users/kyle/Code/design-system/node_modules/entities/lib/decode_codepoint.js + [webpack.Progress] 69% building 574/576 modules 2 active delegated "IGGJ" from dll-reference storybook_docs_dll + [webpack.Progress] 69% building 575/576 modules 1 active /Users/kyle/Code/design-system/node_modules/entities/lib/decode_codepoint.js + [webpack.Progress] 69% building 575/577 modules 2 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/get.js + [webpack.Progress] 69% building 575/578 modules 3 active /Users/kyle/Code/design-system/node_modules/entities/maps/xml.json + [webpack.Progress] 69% building 575/579 modules 4 active /Users/kyle/Code/design-system/node_modules/entities/maps/entities.json + [webpack.Progress] 69% building 575/580 modules 5 active /Users/kyle/Code/design-system/node_modules/entities/maps/legacy.json + [webpack.Progress] 69% building 576/580 modules 4 active /Users/kyle/Code/design-system/node_modules/entities/maps/legacy.json + [webpack.Progress] 69% building 576/581 modules 5 active /Users/kyle/Code/design-system/node_modules/source-map/lib/base64-vlq.js + [webpack.Progress] 69% building 576/582 modules 6 active /Users/kyle/Code/design-system/node_modules/source-map/lib/util.js + [webpack.Progress] 69% building 576/583 modules 7 active /Users/kyle/Code/design-system/node_modules/source-map/lib/array-set.js + [webpack.Progress] 69% building 576/584 modules 8 active /Users/kyle/Code/design-system/node_modules/source-map/lib/mapping-list.js + [webpack.Progress] 69% building 576/585 modules 9 active /Users/kyle/Code/design-system/node_modules/source-map/lib/binary-search.js + [webpack.Progress] 68% building 576/586 modules 10 active /Users/kyle/Code/design-system/node_modules/source-map/lib/quick-sort.js + [webpack.Progress] 69% building 577/586 modules 9 active /Users/kyle/Code/design-system/node_modules/source-map/lib/quick-sort.js + [webpack.Progress] 69% building 578/586 modules 8 active /Users/kyle/Code/design-system/node_modules/source-map/lib/quick-sort.js + [webpack.Progress] 69% building 579/586 modules 7 active /Users/kyle/Code/design-system/node_modules/source-map/lib/quick-sort.js + [webpack.Progress] 69% building 580/586 modules 6 active /Users/kyle/Code/design-system/node_modules/source-map/lib/quick-sort.js + [webpack.Progress] 69% building 580/587 modules 7 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 69% building 581/587 modules 6 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 69% building 582/587 modules 5 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 69% building 583/587 modules 4 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 69% building 584/587 modules 3 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 69% building 585/587 modules 2 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 69% building 586/587 modules 1 active /Users/kyle/Code/design-system/node_modules/entities/maps/decode.json + [webpack.Progress] 70% building 587/587 modules 0 active + [webpack.Progress] 69% building 587/588 modules 1 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/superPropBase.js + [webpack.Progress] 69% building 587/589 modules 2 active /Users/kyle/Code/design-system/node_modules/source-map/lib/base64.js + [webpack.Progress] 69% building 588/589 modules 1 active /Users/kyle/Code/design-system/node_modules/@babel/runtime/helpers/superPropBase.js + [webpack.Progress] 70% building 589/589 modules 0 active + [webpack.Progress] 70% building 589/589 modules 0 active + [webpack.Progress] 70% finish module graph + [webpack.Progress] 70% finish module graph FlagDependencyExportsPlugin + [webpack.Progress] 70% finish module graph WasmFinalizeExportsPlugin + [webpack.Progress] 70% sealing + [webpack.Progress] 70% sealing WarnCaseSensitiveModulesPlugin + [webpack.Progress] 72% basic dependencies optimization + [webpack.Progress] 72% dependencies optimization + [webpack.Progress] 72% dependencies optimization SideEffectsFlagPlugin + [webpack.Progress] 72% dependencies optimization FlagDependencyUsagePlugin + [webpack.Progress] 73% advanced dependencies optimization + [webpack.Progress] 73% after dependencies optimization + [webpack.Progress] 71% chunk graph + [webpack.Progress] 71% after chunk graph + [webpack.Progress] 71% after chunk graph WebAssemblyModulesPlugin + [webpack.Progress] 74% optimizing + [webpack.Progress] 74% basic module optimization + [webpack.Progress] 75% module optimization + [webpack.Progress] 75% advanced module optimization + [webpack.Progress] 76% after module optimization + [webpack.Progress] 76% basic chunk optimization + [webpack.Progress] 76% basic chunk optimization EnsureChunkConditionsPlugin + [webpack.Progress] 76% basic chunk optimization RemoveParentModulesPlugin + [webpack.Progress] 76% basic chunk optimization RemoveEmptyChunksPlugin + [webpack.Progress] 76% basic chunk optimization MergeDuplicateChunksPlugin + [webpack.Progress] 77% chunk optimization + [webpack.Progress] 77% advanced chunk optimization + [webpack.Progress] 77% advanced chunk optimization SplitChunksPlugin + [webpack.Progress] 77% advanced chunk optimization RuntimeChunkPlugin + [webpack.Progress] 77% advanced chunk optimization RemoveEmptyChunksPlugin + [webpack.Progress] 77% after chunk optimization + [webpack.Progress] 78% module and chunk tree optimization + [webpack.Progress] 78% module and chunk tree optimization PersistentChildCompilerSingletonPlugin + [webpack.Progress] 78% after module and chunk tree optimization + [webpack.Progress] 79% basic chunk modules optimization + [webpack.Progress] 80% chunk modules optimization + [webpack.Progress] 80% chunk modules optimization ModuleConcatenationPlugin + [webpack.Progress] 80% advanced chunk modules optimization + [webpack.Progress] 81% after chunk modules optimization + [webpack.Progress] 81% module reviving + [webpack.Progress] 81% module reviving RecordIdsPlugin + [webpack.Progress] 82% module order optimization + [webpack.Progress] 82% module order optimization OccurrenceOrderModuleIdsPlugin + [webpack.Progress] 82% advanced module order optimization + [webpack.Progress] 83% before module ids + [webpack.Progress] 83% module ids + [webpack.Progress] 84% module id optimization + [webpack.Progress] 84% module id optimization + [webpack.Progress] 85% chunk reviving + [webpack.Progress] 85% chunk reviving RecordIdsPlugin + [webpack.Progress] 85% chunk order optimization + [webpack.Progress] 85% chunk order optimization OccurrenceOrderChunkIdsPlugin + [webpack.Progress] 86% before chunk ids + [webpack.Progress] 86% chunk id optimization + [webpack.Progress] 86% chunk id optimization FlagIncludedChunksPlugin + [webpack.Progress] 87% after chunk id optimization + [webpack.Progress] 87% record modules + [webpack.Progress] 87% record modules RecordIdsPlugin + [webpack.Progress] 87% record chunks + [webpack.Progress] 87% record chunks RecordIdsPlugin + [webpack.Progress] 88% hashing + [webpack.Progress] 88% after hashing + [webpack.Progress] 89% record hash + [webpack.Progress] 89% module assets processing + [webpack.Progress] 90% chunk assets processing + [webpack.Progress] 90% additional chunk assets processing + [webpack.Progress] 91% recording + [webpack.Progress] 92% additional asset processing + [webpack.Progress] 92% additional asset processing PersistentChildCompilerSingletonPlugin + [webpack.Progress] 92% chunk asset optimization + [webpack.Progress] 92% chunk asset optimization TerserPlugin + [webpack.Progress] 93% after chunk asset optimization + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin main.9f3031661e55b3b61b0c.bundle.js generate SourceMap + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin runtime~main.9f3031661e55b3b61b0c.bundle.js generate SourceMap + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin vendors~main.9f3031661e55b3b61b0c.bundle.js generate SourceMap + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin resolve sources + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin main.9f3031661e55b3b61b0c.bundle.js attach SourceMap + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin runtime~main.9f3031661e55b3b61b0c.bundle.js attach SourceMap + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin vendors~main.9f3031661e55b3b61b0c.bundle.js attach SourceMap + [webpack.Progress] 93% after chunk asset optimization SourceMapDevToolPlugin + [webpack.Progress] 93% asset optimization + [webpack.Progress] 94% after asset optimization + [webpack.Progress] 94% after seal + [webpack.Progress] 95% emitting + [webpack.Progress] 95% emitting HtmlWebpackPlugin + [webpack.Progress] 98% after emitting + [webpack.Progress] 98% after emitting SizeLimitsPlugin + [webpack.Progress] 100% + +info => Preview built (18 s) +WARN asset size limit: The following asset(s) exceed the recommended size limit (244 KiB). +WARN This can impact web performance. +WARN Assets: +WARN main.9f3031661e55b3b61b0c.bundle.js (2.41 MiB) +WARN vendors~main.9f3031661e55b3b61b0c.bundle.js (7.74 MiB) +WARN entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance. +WARN Entrypoints: +WARN main (10.2 MiB) +WARN runtime~main.9f3031661e55b3b61b0c.bundle.js +WARN vendors~main.9f3031661e55b3b61b0c.bundle.js +WARN main.9f3031661e55b3b61b0c.bundle.js +WARN +WARN webpack performance recommendations: +WARN You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application. +WARN For more info visit https://webpack.js.org/guides/code-splitting/ +info => Output directory: /var/folders/0w/813nt5gj0bnfk7jlqz8r_btr0000gn/T/chromatic-67704EVe0bPjmQKmG diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js index fa7e7687..ee84c8ac 100644 --- a/src/components/TableOfContents.js +++ b/src/components/TableOfContents.js @@ -140,21 +140,15 @@ function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { if (!item.children) return null; const arrow = ; const MenuToggle = isTopLevel ? TopLevelMenuToggle : MenuLink; - const openOnTab = (event) => { - if (event.key !== 'Tab') return; - setMenuOpenStateById({ id: item.id, isOpen: true }); - }; const toggleOpenState = () => setMenuOpenStateById({ id: item.id, isOpen: !item.isOpen }); return (
{isTopLevel && arrow} {isTopLevel ? ( - - {item.title} - + {item.title} ) : ( - + {item.title} )} @@ -261,12 +255,11 @@ PureTableOfContents.defaultProps = { const toKebabcase = (string) => string.toLowerCase().split(' ').join('-'); const hasActiveChildren = (args) => { - const { children, currentPath, lastFocusedId } = args; + const { children, currentPath } = args; return !!children.find( (child) => child.path === currentPath || - child.id === lastFocusedId || (child.children && hasActiveChildren({ ...args, children: child.children })) ); }; @@ -284,6 +277,7 @@ const getOpenState = ({ currentPath, lastFocusedId, }); + // If there is no 'isOpen' field yet, set a default based on whether or not // any of the children are active. if (typeof item.isOpen !== 'boolean') return withActiveChildren; @@ -298,6 +292,15 @@ const getOpenState = ({ return item.isOpen; }; +const mapItemIds = (items, depth = 0) => + items.map((item) => ({ + ...item, + id: `${toKebabcase(item.title)}-${depth}`, + ...(item.children && { + children: mapItemIds(item.children, depth + 1), + }), + })); + // Add UI state to the 'items' that are passed in as props const mapItemUIState = (args) => { const { @@ -310,19 +313,7 @@ const mapItemUIState = (args) => { lastFocusedId, } = args; - return items.map((itemWithoutId) => { - const id = `${toKebabcase(itemWithoutId.title)}-${depth}`; - const item = { - ...itemWithoutId, - id, - // Recursively set the state of children to an infinite depth. - // getOpenState needs the children to have an id already to determine - // if there is a focused child, hence the placement of the recursive - // mapItemUIState call here before getOpenState is called. - ...(itemWithoutId.children && { - children: mapItemUIState({ ...args, items: itemWithoutId.children, depth: depth + 1 }), - }), - }; + return items.map((item) => { const isMenuWithChildren = item.type === ITEM_TYPES.MENU && !!item.children; return { @@ -338,45 +329,35 @@ const mapItemUIState = (args) => { didChangeCurrentPath, }), }), + // Recursively set the state of children to an infinite depth. + // getOpenState needs the children to have an id already to determine + // if there is a focused child, hence the placement of the recursive + // mapItemUIState call here before getOpenState is called. + ...(item.children && { + children: mapItemUIState({ ...args, items: item.children, depth: depth + 1 }), + }), }; }); }; export function TableOfContents({ children, currentPath, items, ...rest }) { - const [lastFocusedId, setLastFocusedId] = useState(undefined); - const mapItemUIStateCommonArgs = { currentPath, lastFocusedId }; + const [itemsWithIds] = useState(mapItemIds(items)); const [itemsWithUIState, setItemsWithUIState] = useState( - mapItemUIState({ items, currentPath, lastFocusedId }) + mapItemUIState({ currentPath, items: itemsWithIds }) ); + const uiStateCommonArgs = { currentPath, items: itemsWithUIState }; const toggleAllOpenStates = (isOpen) => - setItemsWithUIState( - mapItemUIState({ - ...mapItemUIStateCommonArgs, - items: itemsWithUIState, - globalItemUpdate: { isOpen }, - }) - ); + setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, globalItemUpdate: { isOpen } })); const toggleAllOpen = () => toggleAllOpenStates(true); const toggleAllClosed = () => toggleAllOpenStates(false); - const setMenuOpenStateById = (args) => - setItemsWithUIState( - mapItemUIState({ - ...mapItemUIStateCommonArgs, - items: itemsWithUIState, - singleItemUpdate: args, - }) - ); + const setMenuOpenStateById = (args) => { + setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, singleItemUpdate: args })); + }; const didRunCurrentPathEffectOnMount = useRef(false); useEffect(() => { if (didRunCurrentPathEffectOnMount.current) { - setItemsWithUIState( - mapItemUIState({ - ...mapItemUIStateCommonArgs, - didChangeCurrentPath: true, - items: itemsWithUIState, - }) - ); + setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, didChangeCurrentPath: true })); } else { didRunCurrentPathEffectOnMount.current = true; } @@ -387,7 +368,6 @@ export function TableOfContents({ children, currentPath, items, ...rest }) { currentPath={currentPath} items={itemsWithUIState} setMenuOpenStateById={setMenuOpenStateById} - setLastFocusedId={setLastFocusedId} {...rest} /> ); From 6bb8984286bb0a39f54bc956dc6e7721cf364d7c Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 13:24:08 -0600 Subject: [PATCH 06/14] Make the arrows apart of the links --- src/components/TableOfContents.js | 22 +++++++++++++--------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js index ee84c8ac..09060fd0 100644 --- a/src/components/TableOfContents.js +++ b/src/components/TableOfContents.js @@ -129,30 +129,34 @@ const MenuChild = styled.div` `; const ArrowIcon = styled(Icon).attrs({ icon: 'arrowright' })` - width: 14px; - width: 14px; - color: ${color.mediumdark}; - transform: translateY(-1px) ${(props) => props.isOpen && `rotate(90deg)`}; - ${(props) => (props.isTopLevel ? `margin-right: 8px;` : `margin-left: 8px;`)} + && { + width: 14px; + width: 14px; + color: ${color.mediumdark}; + transform: translateY(1px) ${(props) => props.isOpen && `rotate(90deg)`}; + ${(props) => (props.isTopLevel ? `margin-right: 8px;` : `margin-left: 8px;`)} + } `; function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { if (!item.children) return null; - const arrow = ; + const arrow = ; const MenuToggle = isTopLevel ? TopLevelMenuToggle : MenuLink; const toggleOpenState = () => setMenuOpenStateById({ id: item.id, isOpen: !item.isOpen }); return (
- {isTopLevel && arrow} {isTopLevel ? ( - {item.title} + + {arrow} + {item.title} + ) : ( {item.title} + {arrow} )} - {!isTopLevel && arrow} {item.isOpen && ( Date: Thu, 30 Jul 2020 13:31:00 -0600 Subject: [PATCH 07/14] Fix spacing under ItemLink last item --- src/components/TableOfContents.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js index 09060fd0..a5fb2904 100644 --- a/src/components/TableOfContents.js +++ b/src/components/TableOfContents.js @@ -186,9 +186,15 @@ Menu.defaultProps = { isTopLevel: false, }; +const ItemLinkWrapper = styled.div` + &:last-of-type ${MenuLink} { + margin-bottom: 0; + } +`; + function ItemLink({ currentPath, item }) { return ( -
+ {item.title} -
+ ); } From 5c25112f6d333faa92b5df98e456f4c588313756 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 14:44:42 -0600 Subject: [PATCH 08/14] Style fixes, ul/ol/li markup --- src/components/TableOfContents.js | 59 ++++++++++++++++++++++++------- 1 file changed, 47 insertions(+), 12 deletions(-) diff --git a/src/components/TableOfContents.js b/src/components/TableOfContents.js index a5fb2904..e16b8bf2 100644 --- a/src/components/TableOfContents.js +++ b/src/components/TableOfContents.js @@ -49,7 +49,11 @@ const StyledBulletLink = styled(({ isActive, ...rest }) => )` } `; -const BulletLinkWrapper = styled.div` +const BulletLinkWrapper = styled.li` + && { + padding-top: 0; + } + &:first-of-type ${StyledBulletLink} { margin-top: -6px; @@ -112,20 +116,18 @@ BulletLink.propTypes = { const TopLevelMenuToggle = styled(Link).attrs({ isButton: true, tertiary: true })` font-weight: ${typography.weight.bold}; - margin-bottom: 12px; `; const MenuLink = styled(({ isActive, ...rest }) => )` color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; - margin-bottom: 12px; `; const MenuChild = styled.div` - margin-left: 22px; + padding-left: 22px; + padding-top: 12px; display: flex; flex-direction: column; - margin-bottom: 12px; `; const ArrowIcon = styled(Icon).attrs({ icon: 'arrowright' })` @@ -145,7 +147,7 @@ function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { const toggleOpenState = () => setMenuOpenStateById({ id: item.id, isOpen: !item.isOpen }); return ( -
+
  • {isTopLevel ? ( {arrow} @@ -167,7 +169,7 @@ function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { /> )} -
    • + ); } @@ -186,7 +188,7 @@ Menu.defaultProps = { isTopLevel: false, }; -const ItemLinkWrapper = styled.div` +const ItemLinkWrapper = styled.li` &:last-of-type ${MenuLink} { margin-bottom: 0; } @@ -216,19 +218,52 @@ ItemLink.propTypes = { }).isRequired, }; -function Items({ currentPath, items, ...rest }) { +const List = styled.ul` + list-style-type: none; + padding: 0; + margin: 0; + + li { + padding-top: 12px; + + &:first-child { + padding-top: 0; + } + } + + ${(props) => + props.isTopLevel && + ` + > li { + padding-top: 20px; + } + `} +`; + +function Items({ currentPath, isTopLevel, items, ...rest }) { + const isOrderedList = items.every((item) => item.type === ITEM_TYPES.BULLET_LINK); + return ( - <> + {items.map((item) => { const ItemComponent = getItemComponent(item.type); - return ; + return ( + + ); })} - + ); } Items.propTypes = { currentPath: PropTypes.string.isRequired, + isTopLevel: PropTypes.bool.isRequired, items: PropTypes.arrayOf( PropTypes.shape({ type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, From 8a0a2e2a4d5379f77ff8a3fab4a0deda1b1abb83 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 15:12:55 -0600 Subject: [PATCH 09/14] Pull out TableOfContentsItems --- .../table-of-contents/TableOfContents.js | 147 ++++++++++++++ .../TableOfContents.stories.js | 4 +- .../TableOfContentsItems.js} | 183 +----------------- 3 files changed, 158 insertions(+), 176 deletions(-) create mode 100644 src/components/table-of-contents/TableOfContents.js rename src/components/{ => table-of-contents}/TableOfContents.stories.js (96%) rename src/components/{TableOfContents.js => table-of-contents/TableOfContentsItems.js} (53%) diff --git a/src/components/table-of-contents/TableOfContents.js b/src/components/table-of-contents/TableOfContents.js new file mode 100644 index 00000000..19ad5a04 --- /dev/null +++ b/src/components/table-of-contents/TableOfContents.js @@ -0,0 +1,147 @@ +import React, { useEffect, useRef, useState } from 'react'; +import PropTypes from 'prop-types'; +import { TableOfContentsItems, ITEM_TYPES } from './TableOfContentsItems'; +import { breakpoint, color, typography } from '../shared/styles'; +import { Icon } from '../Icon'; +import { Link } from '../Link'; + +const toKebabcase = (string) => string.toLowerCase().split(' ').join('-'); + +const hasActiveChildren = (args) => { + const { children, currentPath } = args; + + return !!children.find( + (child) => + child.path === currentPath || + (child.children && hasActiveChildren({ ...args, children: child.children })) + ); +}; + +const getOpenState = ({ + item, + globalItemUpdate = {}, + singleItemUpdate = {}, + lastFocusedId, + currentPath, + didChangeCurrentPath, +}) => { + const withActiveChildren = hasActiveChildren({ + children: item.children, + currentPath, + lastFocusedId, + }); + + // If there is no 'isOpen' field yet, set a default based on whether or not + // any of the children are active. + if (typeof item.isOpen !== 'boolean') return withActiveChildren; + // Path changes should open up a tree for all parents of an active item. + if (didChangeCurrentPath && withActiveChildren) return true; + + if (typeof globalItemUpdate.isOpen === 'boolean') return globalItemUpdate.isOpen; + + if (typeof singleItemUpdate.isOpen === 'boolean' && singleItemUpdate.id === item.id) + return singleItemUpdate.isOpen; + + return item.isOpen; +}; + +const mapItemIds = (items, depth = 0) => + items.map((item) => ({ + ...item, + id: `${toKebabcase(item.title)}-${depth}`, + ...(item.children && { + children: mapItemIds(item.children, depth + 1), + }), + })); + +// Add UI state to the 'items' that are passed in as props +const mapItemUIState = (args) => { + const { + items, + currentPath, + didChangeCurrentPath, + depth = 0, + globalItemUpdate, + singleItemUpdate, + lastFocusedId, + } = args; + + return items.map((item) => { + const isMenuWithChildren = item.type === ITEM_TYPES.MENU && !!item.children; + + return { + ...item, + // The concept of 'isOpen' only applies to menus that have children + ...(isMenuWithChildren && { + isOpen: getOpenState({ + item, + globalItemUpdate, + singleItemUpdate, + lastFocusedId, + currentPath, + didChangeCurrentPath, + }), + }), + // Recursively set the state of children to an infinite depth. + // getOpenState needs the children to have an id already to determine + // if there is a focused child, hence the placement of the recursive + // mapItemUIState call here before getOpenState is called. + ...(item.children && { + children: mapItemUIState({ ...args, items: item.children, depth: depth + 1 }), + }), + }; + }); +}; + +// State management and event handlers for the TableOfContentsItems +export function TableOfContents({ children, currentPath, items, ...rest }) { + const [itemsWithIds] = useState(mapItemIds(items)); + const [itemsWithUIState, setItemsWithUIState] = useState( + mapItemUIState({ currentPath, items: itemsWithIds }) + ); + const uiStateCommonArgs = { currentPath, items: itemsWithUIState }; + const toggleAllOpenStates = (isOpen) => + setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, globalItemUpdate: { isOpen } })); + const toggleAllOpen = () => toggleAllOpenStates(true); + const toggleAllClosed = () => toggleAllOpenStates(false); + const setMenuOpenStateById = (args) => { + setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, singleItemUpdate: args })); + }; + + const didRunCurrentPathEffectOnMount = useRef(false); + useEffect(() => { + if (didRunCurrentPathEffectOnMount.current) { + setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, didChangeCurrentPath: true })); + } else { + didRunCurrentPathEffectOnMount.current = true; + } + }, [currentPath]); + + const tableOfContentsMenu = ( + + ); + + return typeof children === 'function' + ? children({ menu: tableOfContentsMenu, toggleAllOpen, toggleAllClosed }) + : tableOfContentsMenu; +} + +TableOfContents.propTypes = { + children: PropTypes.func, + currentPath: PropTypes.string.isRequired, + items: PropTypes.arrayOf( + PropTypes.shape({ + type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, + }).isRequired + ).isRequired, +}; + +TableOfContents.defaultProps = { + children: undefined, +}; diff --git a/src/components/TableOfContents.stories.js b/src/components/table-of-contents/TableOfContents.stories.js similarity index 96% rename from src/components/TableOfContents.stories.js rename to src/components/table-of-contents/TableOfContents.stories.js index 7737ceb8..e45bed19 100644 --- a/src/components/TableOfContents.stories.js +++ b/src/components/table-of-contents/TableOfContents.stories.js @@ -1,9 +1,9 @@ import React, { useState } from 'react'; import { TableOfContents } from './TableOfContents'; -import { StoryLinkWrapper } from './StoryLinkWrapper'; +import { StoryLinkWrapper } from '../StoryLinkWrapper'; export default { - title: 'Design System/Table of Contents', + title: 'Design System/TableOfContents', component: TableOfContents, }; diff --git a/src/components/TableOfContents.js b/src/components/table-of-contents/TableOfContentsItems.js similarity index 53% rename from src/components/TableOfContents.js rename to src/components/table-of-contents/TableOfContentsItems.js index e16b8bf2..2bd6f09f 100644 --- a/src/components/TableOfContents.js +++ b/src/components/table-of-contents/TableOfContentsItems.js @@ -1,14 +1,14 @@ import React, { useEffect, useRef, useState } from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; -import { breakpoint, color, typography } from './shared/styles'; -import { Icon } from './Icon'; -import { Link } from './Link'; +import { breakpoint, color, typography } from '../shared/styles'; +import { Icon } from '../Icon'; +import { Link } from '../Link'; const MENU = 'menu'; const LINK = 'link'; const BULLET_LINK = 'bullet-link'; -const ITEM_TYPES = Object.freeze({ +export const ITEM_TYPES = Object.freeze({ MENU, LINK, BULLET_LINK, @@ -161,7 +161,7 @@ function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { )} {item.isOpen && ( - item.type === ITEM_TYPES.BULLET_LINK); return ( @@ -261,7 +261,7 @@ function Items({ currentPath, isTopLevel, items, ...rest }) { ); } -Items.propTypes = { +TableOfContentsItems.propTypes = { currentPath: PropTypes.string.isRequired, isTopLevel: PropTypes.bool.isRequired, items: PropTypes.arrayOf( @@ -270,168 +270,3 @@ Items.propTypes = { }).isRequired ).isRequired, }; - -const Section = styled.section` - position: relative; -`; - -function PureTableOfContents({ className, ...rest }) { - return ( -
    - -
    - ); -} - -PureTableOfContents.propTypes = { - className: PropTypes.string, - currentPath: PropTypes.string.isRequired, - items: PropTypes.arrayOf( - PropTypes.shape({ - type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, - }).isRequired - ).isRequired, -}; - -PureTableOfContents.defaultProps = { - className: '', -}; - -const toKebabcase = (string) => string.toLowerCase().split(' ').join('-'); - -const hasActiveChildren = (args) => { - const { children, currentPath } = args; - - return !!children.find( - (child) => - child.path === currentPath || - (child.children && hasActiveChildren({ ...args, children: child.children })) - ); -}; - -const getOpenState = ({ - item, - globalItemUpdate = {}, - singleItemUpdate = {}, - lastFocusedId, - currentPath, - didChangeCurrentPath, -}) => { - const withActiveChildren = hasActiveChildren({ - children: item.children, - currentPath, - lastFocusedId, - }); - - // If there is no 'isOpen' field yet, set a default based on whether or not - // any of the children are active. - if (typeof item.isOpen !== 'boolean') return withActiveChildren; - // Path changes should open up a tree for all parents of an active item. - if (didChangeCurrentPath && withActiveChildren) return true; - - if (typeof globalItemUpdate.isOpen === 'boolean') return globalItemUpdate.isOpen; - - if (typeof singleItemUpdate.isOpen === 'boolean' && singleItemUpdate.id === item.id) - return singleItemUpdate.isOpen; - - return item.isOpen; -}; - -const mapItemIds = (items, depth = 0) => - items.map((item) => ({ - ...item, - id: `${toKebabcase(item.title)}-${depth}`, - ...(item.children && { - children: mapItemIds(item.children, depth + 1), - }), - })); - -// Add UI state to the 'items' that are passed in as props -const mapItemUIState = (args) => { - const { - items, - currentPath, - didChangeCurrentPath, - depth = 0, - globalItemUpdate, - singleItemUpdate, - lastFocusedId, - } = args; - - return items.map((item) => { - const isMenuWithChildren = item.type === ITEM_TYPES.MENU && !!item.children; - - return { - ...item, - // The concept of 'isOpen' only applies to menus that have children - ...(isMenuWithChildren && { - isOpen: getOpenState({ - item, - globalItemUpdate, - singleItemUpdate, - lastFocusedId, - currentPath, - didChangeCurrentPath, - }), - }), - // Recursively set the state of children to an infinite depth. - // getOpenState needs the children to have an id already to determine - // if there is a focused child, hence the placement of the recursive - // mapItemUIState call here before getOpenState is called. - ...(item.children && { - children: mapItemUIState({ ...args, items: item.children, depth: depth + 1 }), - }), - }; - }); -}; - -export function TableOfContents({ children, currentPath, items, ...rest }) { - const [itemsWithIds] = useState(mapItemIds(items)); - const [itemsWithUIState, setItemsWithUIState] = useState( - mapItemUIState({ currentPath, items: itemsWithIds }) - ); - const uiStateCommonArgs = { currentPath, items: itemsWithUIState }; - const toggleAllOpenStates = (isOpen) => - setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, globalItemUpdate: { isOpen } })); - const toggleAllOpen = () => toggleAllOpenStates(true); - const toggleAllClosed = () => toggleAllOpenStates(false); - const setMenuOpenStateById = (args) => { - setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, singleItemUpdate: args })); - }; - - const didRunCurrentPathEffectOnMount = useRef(false); - useEffect(() => { - if (didRunCurrentPathEffectOnMount.current) { - setItemsWithUIState(mapItemUIState({ ...uiStateCommonArgs, didChangeCurrentPath: true })); - } else { - didRunCurrentPathEffectOnMount.current = true; - } - }, [currentPath]); - - const tableOfContentsMenu = ( - - ); - - return typeof children === 'function' - ? children({ menu: tableOfContentsMenu, toggleAllOpen, toggleAllClosed }) - : tableOfContentsMenu; -} - -TableOfContents.propTypes = { - children: PropTypes.func, - currentPath: PropTypes.string.isRequired, - items: PropTypes.arrayOf( - PropTypes.shape({ - type: PropTypes.oneOf(Object.values(ITEM_TYPES)).isRequired, - }).isRequired - ).isRequired, -}; - -TableOfContents.defaultProps = { - children: undefined, -}; From eb5efc8c3bd97dce3e8e422c42c6e6115ada7b3c Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 15:35:01 -0600 Subject: [PATCH 10/14] Pull out components, add stories for docs, hide in chromatic --- .../table-of-contents/BulletLink.js | 93 +++++++++++++ .../table-of-contents/BulletLink.stories.js | 18 +++ src/components/table-of-contents/ItemLink.js | 38 ++++++ .../table-of-contents/ItemLink.stories.js | 17 +++ src/components/table-of-contents/MenuLink.js | 9 ++ .../table-of-contents/MenuLink.stories.js | 11 ++ .../table-of-contents/TableOfContentsItems.js | 127 +----------------- 7 files changed, 190 insertions(+), 123 deletions(-) create mode 100644 src/components/table-of-contents/BulletLink.js create mode 100644 src/components/table-of-contents/BulletLink.stories.js create mode 100644 src/components/table-of-contents/ItemLink.js create mode 100644 src/components/table-of-contents/ItemLink.stories.js create mode 100644 src/components/table-of-contents/MenuLink.js create mode 100644 src/components/table-of-contents/MenuLink.stories.js diff --git a/src/components/table-of-contents/BulletLink.js b/src/components/table-of-contents/BulletLink.js new file mode 100644 index 00000000..3614a31a --- /dev/null +++ b/src/components/table-of-contents/BulletLink.js @@ -0,0 +1,93 @@ +import React, { useEffect, useRef, useState } from 'react'; +import PropTypes from 'prop-types'; +import styled from 'styled-components'; +import { color, typography } from '../shared/styles'; +import { Link } from '../Link'; + +const StyledBulletLink = styled(({ isActive, ...rest }) => )` + display: inline-block; + padding: 6px 0; + line-height: 1.5; + position: relative; + z-index: 1; + ${(props) => props.isActive && `font-weight: ${typography.weight.bold};`} + + &::after { + position: absolute; + top: 0px; + right: auto; + bottom: 0px; + left: 3px; + width: auto; + height: auto; + border-left: 1px solid ${color.mediumlight}; + content: ''; + z-index: -1; + } +`; + +const BulletLinkWrapper = styled.li` + && { + padding-top: 0; + list-style-type: none; + } + + &:first-of-type ${StyledBulletLink} { + margin-top: -6px; + + &::after { + height: 50%; + top: 50%; + } + } + + &:last-of-type ${StyledBulletLink} { + margin-bottom: -6px; + + &::after { + height: 50%; + bottom: 50%; + } + } +`; + +const Bullet = styled.span` + display: inline-block; + margin-bottom: 1px; + margin-right: 16px; + background: ${color.medium}; + box-shadow: white 0 0 0 4px; + height: 8px; + width: 8px; + border-radius: 1em; + text-decoration: none !important; + content: ''; + ${(props) => props.isActive && `background: ${color.secondary};`} +`; + +export function BulletLink({ currentPath, item, ...rest }) { + const isActive = currentPath === item.path; + + return ( + + + + {item.title} + + + ); +} + +BulletLink.propTypes = { + currentPath: PropTypes.string.isRequired, + item: PropTypes.shape({ + LinkWrapper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), + path: PropTypes.string.isRequired, + title: PropTypes.string.isRequired, + }).isRequired, +}; diff --git a/src/components/table-of-contents/BulletLink.stories.js b/src/components/table-of-contents/BulletLink.stories.js new file mode 100644 index 00000000..1bb0c45a --- /dev/null +++ b/src/components/table-of-contents/BulletLink.stories.js @@ -0,0 +1,18 @@ +import React, { useState } from 'react'; +import styled from 'styled-components'; +import { BulletLink } from './BulletLink'; + +export default { + title: 'Design System/TableOfContents/BulletLink', + component: BulletLink, + parameters: { chromatic: { disable: true } }, +}; + +const currentPath = '/path-1'; +// Bullet links should always be used in a series +export const Series = (args) => ( +
      + + +
    +); diff --git a/src/components/table-of-contents/ItemLink.js b/src/components/table-of-contents/ItemLink.js new file mode 100644 index 00000000..96326619 --- /dev/null +++ b/src/components/table-of-contents/ItemLink.js @@ -0,0 +1,38 @@ +import React, { useEffect, useRef, useState } from 'react'; +import PropTypes from 'prop-types'; +import styled from 'styled-components'; +import { color, typography } from '../shared/styles'; +import { Link } from '../Link'; +import { MenuLink } from './MenuLink'; + +const ItemLinkWrapper = styled.li` + list-style-type: none; + + &:last-of-type ${MenuLink} { + margin-bottom: 0; + } +`; + +export function ItemLink({ currentPath, item }) { + return ( + + + {item.title} + + + ); +} + +ItemLink.propTypes = { + currentPath: PropTypes.string.isRequired, + item: PropTypes.shape({ + path: PropTypes.string.isRequired, + LinkWrapper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), + title: PropTypes.string.isRequired, + }).isRequired, +}; diff --git a/src/components/table-of-contents/ItemLink.stories.js b/src/components/table-of-contents/ItemLink.stories.js new file mode 100644 index 00000000..e8ec471e --- /dev/null +++ b/src/components/table-of-contents/ItemLink.stories.js @@ -0,0 +1,17 @@ +import React, { useState } from 'react'; +import styled from 'styled-components'; +import { ItemLink } from './ItemLink'; + +export default { + title: 'Design System/TableOfContents/ItemLink', + component: ItemLink, + parameters: { chromatic: { disable: true } }, +}; + +export const Base = () => ( + +); + +export const Active = () => ( + +); diff --git a/src/components/table-of-contents/MenuLink.js b/src/components/table-of-contents/MenuLink.js new file mode 100644 index 00000000..f07312c9 --- /dev/null +++ b/src/components/table-of-contents/MenuLink.js @@ -0,0 +1,9 @@ +import React from 'react'; +import styled from 'styled-components'; +import { color, typography } from '../shared/styles'; +import { Link } from '../Link'; + +export const MenuLink = styled(({ isActive, ...rest }) => )` + color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; + font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; +`; diff --git a/src/components/table-of-contents/MenuLink.stories.js b/src/components/table-of-contents/MenuLink.stories.js new file mode 100644 index 00000000..af3f9855 --- /dev/null +++ b/src/components/table-of-contents/MenuLink.stories.js @@ -0,0 +1,11 @@ +import React, { useState } from 'react'; +import styled from 'styled-components'; +import { MenuLink } from './MenuLink'; + +export default { + title: 'Design System/TableOfContents/MenuLink', + component: MenuLink, + parameters: { chromatic: { disable: true } }, +}; + +export const Base = () => Menu link; diff --git a/src/components/table-of-contents/TableOfContentsItems.js b/src/components/table-of-contents/TableOfContentsItems.js index 2bd6f09f..b9f041ff 100644 --- a/src/components/table-of-contents/TableOfContentsItems.js +++ b/src/components/table-of-contents/TableOfContentsItems.js @@ -1,7 +1,10 @@ import React, { useEffect, useRef, useState } from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; -import { breakpoint, color, typography } from '../shared/styles'; +import { BulletLink } from './BulletLink'; +import { ItemLink } from './ItemLink'; +import { MenuLink } from './MenuLink'; +import { color, typography } from '../shared/styles'; import { Icon } from '../Icon'; import { Link } from '../Link'; @@ -27,102 +30,10 @@ const getItemComponent = (itemType) => { } }; -const StyledBulletLink = styled(({ isActive, ...rest }) => )` - display: inline-block; - padding: 6px 0; - line-height: 1.5; - position: relative; - z-index: 1; - ${(props) => props.isActive && `font-weight: ${typography.weight.bold};`} - - &::after { - position: absolute; - top: 0px; - right: auto; - bottom: 0px; - left: 3px; - width: auto; - height: auto; - border-left: 1px solid ${color.mediumlight}; - content: ''; - z-index: -1; - } -`; - -const BulletLinkWrapper = styled.li` - && { - padding-top: 0; - } - - &:first-of-type ${StyledBulletLink} { - margin-top: -6px; - - &::after { - height: 50%; - top: 50%; - } - } - - &:last-of-type ${StyledBulletLink} { - margin-bottom: -6px; - - &::after { - height: 50%; - bottom: 50%; - } - } -`; - -const Bullet = styled.span` - display: inline-block; - margin-bottom: 1px; - margin-right: 16px; - background: ${color.medium}; - box-shadow: white 0 0 0 4px; - height: 8px; - width: 8px; - border-radius: 1em; - text-decoration: none !important; - content: ''; - ${(props) => props.isActive && `background: ${color.secondary};`} -`; - -function BulletLink({ currentPath, item, ...rest }) { - const isActive = currentPath === item.path; - - return ( - - - - {item.title} - - - ); -} - -BulletLink.propTypes = { - currentPath: PropTypes.string.isRequired, - item: PropTypes.shape({ - LinkWrapper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), - path: PropTypes.string.isRequired, - title: PropTypes.string.isRequired, - }).isRequired, -}; - const TopLevelMenuToggle = styled(Link).attrs({ isButton: true, tertiary: true })` font-weight: ${typography.weight.bold}; `; -const MenuLink = styled(({ isActive, ...rest }) => )` - color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; - font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; -`; - const MenuChild = styled.div` padding-left: 22px; padding-top: 12px; @@ -188,36 +99,6 @@ Menu.defaultProps = { isTopLevel: false, }; -const ItemLinkWrapper = styled.li` - &:last-of-type ${MenuLink} { - margin-bottom: 0; - } -`; - -function ItemLink({ currentPath, item }) { - return ( - - - {item.title} - - - ); -} - -ItemLink.propTypes = { - currentPath: PropTypes.string.isRequired, - item: PropTypes.shape({ - path: PropTypes.string.isRequired, - LinkWrapper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), - title: PropTypes.string.isRequired, - }).isRequired, -}; - const List = styled.ul` list-style-type: none; padding: 0; From 2fc1a573350791cbb3913dfe6f2b43e2a61d53e2 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 15:36:34 -0600 Subject: [PATCH 11/14] Add export for toc --- src/components/index.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/components/index.js b/src/components/index.js index 714c2e33..def2c6b4 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -31,3 +31,5 @@ export { default as WithTooltip } from './tooltip/WithTooltip'; export * from './modal/Modal'; export { default as WithModal } from './modal/WithModal'; + +export * from './table-of-contents/TableOfContents'; From f73a1d87a3203e891db82bfa534d4619e3f3c1b6 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 15:41:40 -0600 Subject: [PATCH 12/14] Add line height to MenuLink --- src/components/table-of-contents/MenuLink.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/table-of-contents/MenuLink.js b/src/components/table-of-contents/MenuLink.js index f07312c9..6e3d7a7a 100644 --- a/src/components/table-of-contents/MenuLink.js +++ b/src/components/table-of-contents/MenuLink.js @@ -6,4 +6,5 @@ import { Link } from '../Link'; export const MenuLink = styled(({ isActive, ...rest }) => )` color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; + line-height: 24px; `; From 950276b7e6e47432afc070212a68c96f0f5aec72 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 16:47:58 -0600 Subject: [PATCH 13/14] Remove outline on links --- src/components/table-of-contents/BulletLink.js | 1 + src/components/table-of-contents/MenuLink.js | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/table-of-contents/BulletLink.js b/src/components/table-of-contents/BulletLink.js index 3614a31a..91d1680c 100644 --- a/src/components/table-of-contents/BulletLink.js +++ b/src/components/table-of-contents/BulletLink.js @@ -5,6 +5,7 @@ import { color, typography } from '../shared/styles'; import { Link } from '../Link'; const StyledBulletLink = styled(({ isActive, ...rest }) => )` + outline: none; display: inline-block; padding: 6px 0; line-height: 1.5; diff --git a/src/components/table-of-contents/MenuLink.js b/src/components/table-of-contents/MenuLink.js index 6e3d7a7a..ae14b029 100644 --- a/src/components/table-of-contents/MenuLink.js +++ b/src/components/table-of-contents/MenuLink.js @@ -4,6 +4,7 @@ import { color, typography } from '../shared/styles'; import { Link } from '../Link'; export const MenuLink = styled(({ isActive, ...rest }) => )` + outline: none; color: ${(props) => (props.isActive ? color.secondary : color.darkest)}; font-weight: ${(props) => (props.isActive ? typography.weight.bold : typography.weight.regular)}; line-height: 24px; From 401233c1e1c4bd6209eecdae3b0e543a94587fa4 Mon Sep 17 00:00:00 2001 From: Kyle Suss Date: Thu, 30 Jul 2020 16:52:31 -0600 Subject: [PATCH 14/14] Remove extra div --- .../table-of-contents/TableOfContentsItems.js | 29 +++++++++---------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/src/components/table-of-contents/TableOfContentsItems.js b/src/components/table-of-contents/TableOfContentsItems.js index b9f041ff..19c0c44d 100644 --- a/src/components/table-of-contents/TableOfContentsItems.js +++ b/src/components/table-of-contents/TableOfContentsItems.js @@ -34,13 +34,6 @@ const TopLevelMenuToggle = styled(Link).attrs({ isButton: true, tertiary: true } font-weight: ${typography.weight.bold}; `; -const MenuChild = styled.div` - padding-left: 22px; - padding-top: 12px; - display: flex; - flex-direction: column; -`; - const ArrowIcon = styled(Icon).attrs({ icon: 'arrowright' })` && { width: 14px; @@ -71,14 +64,12 @@ function Menu({ isTopLevel, item, setMenuOpenStateById, ...rest }) { )} {item.isOpen && ( - - - + )} ); @@ -103,6 +94,14 @@ const List = styled.ul` list-style-type: none; padding: 0; margin: 0; + ${(props) => + !props.isTopLevel && + ` + padding-left: 22px; + padding-top: 12px; + display: flex; + flex-direction: column; + `} li { padding-top: 12px;