My Story
\n\n War tore me apart from my home, coffee reconnected me\n
\n\n\n My family was torn away from our country because of the Vietnam War. We arrived in America in 1991 -- I was 1. After surviving through the hell-on-earth phase of life, my immigrant parents raised me in a very traditional Vietnamese way, until I went off to college. I adopted the American culture, fulfilled my family's dream by becoming an engineer and followed their one rule -- never go back to Vietnam, there's nothing there.\n
\n\nI grew up speaking Vietnamese, speaking Vietnamese, looking Vietnamese, but I had never seen my country or the people over there.
\n\nI did the most American thing ever - I challenged the rule and followed my dreams.
\n\nI booked a flight to Vietnam and stepped on my ancestral soil. What I saw there wasn't the pain and suffering from my parent's war-torn story, but a beautiful country full of life, opportunity, and undiscovered quality.
\n\nI realized then, that I was blessed with the ability to live in 2 amazing worlds. Vietnam and America - Vietnamese-American.
\n\nMy adventure made me fall in love with Vietnam and my people.
\n\nMy vision is to bring to America the love, feels, adventure and comfort I experienced coming back to my home country. What better way to capture that, then through a wonderful familiarity in both worlds -- Coffee
\n\nThe average American drinks 3.1 coffee drinks per day.\n
\n\nVietnam is the 2nd largest exporter of coffee in the world.\n
\n\nHowever, ask anyone about these facts, and they would have no idea. But you and I -- we can change that.
\n\nI want everyone to know about the beauty, quality, and taste of Vietnam. Let's do that together with Vietnamese Coffee.
\n\n\n - An Le, Founder\n
\n\n \nFounders
\n \nAn Le
\nFounder
\nBy trade, An is a Sr. Software Engineer. Born in Saigon, Vietnam and came to the States when he was 1. Growing up with Vietnamese and American culture, there has always been a deep longing in his heart to follow his heart and return and learn about his home country.
\n \nBen Nguyen
\nFounder
\nBen is a Vietnamese-American who was born in Russian, moved to the U.S. when he was nine. He recently moved back to Vietnam to understands his roots as well as to explore the tech Start-Up scene and the entrepreneurial spirits of Vietnam.
\n \nOur Mission
\n\n We're here to bring you Vietnamese Specialty Coffee. You won't find it anywhere in your local grocery store. Even though Vietnam is:\n
\n\n- \n
- The 2nd largest exporter of coffee in the world \n
- The 3rd largest exporter of coffee to the US \n
\n With your help, we can make Specialty Arabica and Robusta coffee straight to you and your friends.\n
\n\nSo what are you waiting for?
\n\n\n \n
\n\n \n {child.text}
\n // \n // )\n // }\n } else {\n return (\n {child.text}\n )\n }\n })\n return{htmlBlock}
\n\n } else if (_type == \"image\") {\n if (!block.asset?.url) { return }\n console.log(block)\n return (\n \n 
\n
\n )\n } else if (_type == \"span\") {\n // TODO: create Span handler\n if (block.marks.length > 0 ) {\n if (block.marks[0] == \"strong\") {\n return (\n \n {block.text}\n \n )\n } else {\n // marks would be a uuid found in block.markDefs\n let def = markDefs.find( (markDef) => { return markDef._key == block.marks[0]})\n if (def._type == \"link\") {\n return (\n {block.text}\n )\n } else {\n return (\n {block.text}\n )\n }\n }\n }\n\n }\n }\n\n return (\n <>\n {renderContent()}\n \n )\n};\n\nexport default TypeHandler;","import React from 'react';\n\nconst ArticleCard = ({ contentData }) => {\n\n return (\n \n
\n );\n};\n\nexport default ArticleCard;","import React from 'react';\nimport ArticleCard from './ArticleCard.jsx';\n\nconst ArticleLists = ({ articles }) => {\n // Group articles by category\n // and ideally we want to return an array of article category cards\n\n const groupedArticles = articles.reduce((acc, article) => {\n const category = article.categories[0].title\n\n if (!acc[category]) {\n acc[category] = [];\n }\n\n acc[category].push(article);\n return acc;\n }, {});\n\n\n const renderArticles = (articles, category) => {\n return articles.map((article) => (\n \n
\n \n
\n \n 
\n \n
\n \n
\n ))\n }\n\n return (\n <>\n {Object.entries(groupedArticles).map(([category, articles]) => (\n renderArticles(articles, category)\n ))}\n \n );\n};\n\nexport default ArticleLists;","import React from 'react';\n\nconst Parser = ({ data }) => {\n const findTitle = (title) => {\n return data.find(item => item.title === title);\n };\n\n const getTitle = (title) => {\n const item = findTitle(title);\n return item ? item.title : '';\n };\n\n const getCategories = (title) => {\n const item = findTitle(title);\n return item ? item.categories : [];\n };\n\n const getPublishedAt = (title) => {\n const item = findTitle(title);\n return item ? item.publishedAt : '';\n };\n\n const getImage = (title) => {\n const item = findTitle(title);\n return item ? item.image : '';\n };\n\n const getBody = (title) => {\n const item = findTitle(title);\n return item ? item.body : '';\n };\n\n return (\n \n {/* Your JSX code here */}\n
\n );\n};\n\nexport default Parser;","import React from 'react'\nimport Row from 'react-bootstrap/Row'\nimport Col from 'react-bootstrap/Col'\nimport Container from 'react-bootstrap/Container'\nimport Button from 'react-bootstrap/Button'\n\nconst BusinessInfo = (props) => {\n return (\n {props.info.name}
\n\n {props.info.address}, {props.info.city} {props.info.zip_code}\n
\n {props.info.phone_number}\n
\n Website\n
Yelp
\n{props.info.yelp_count} Reviews | {props.info.yelp_rating} Stars
\n\n\n \n \nWhy You Should Try Our Coffee
*/}\nCoffee the Way it Should Be
\nVietnam is the 2nd biggest coffee exporter—and for good reason.
\n \n\n 
\n
\n \n Award-Winning Flavor
\nRated #26 Best Coffee of 2021, VN Beans has exploded onto the coffee scene by championing the only Vietnamese coffee to rank on Coffee Review.
\nAwakening Aroma
\nOne cup of coffee combines the smell of nutty peanut butter, lightly roasted coffee, and a mix of fruit to give you an unforgettable aroma.
\n \nDistinct Taste
\nWhether you prefer coffee that tastes fruity and sweet or the more traditional chocolate taste, you'll find your favorite with VN Beans.
\n \nTreat Yourself To Better Coffee
\n \nHung Farm
\nTaste Notes: Fruity | Strawberries | Cherries
\nAbout 17 cups of coffee
\n12 oz (340g)
\n$24.50
\n \n \nWhat Taste Buds Are Saying
\n \n“Light body, inviting taste, tangy flavor”
\n Tyler Phillips - Sr. Field Sales Rep
San Francisco, CA
“적절한 물의 온도와 커피의 양으로 추출된듯한 풍미있고 단 커피를 마실수 있어서 행복했다”\n
\n (I was happy to have a savory, sweet coffee that was extracted with the proper water temperature and the amount of coffee.)
\n Heesun Choi - SBA Brewing Certified
Seoul, South Korea
\n \n {html}\n
\n
\n )\n}\n\nexport default InstagramFeed\n\n","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"as\", \"disabled\", \"onKeyDown\"];\nimport React from 'react';\nimport createChainedFunction from './createChainedFunction';\nfunction isTrivialHref(href) {\n return !href || href.trim() === '#';\n}\n/**\n * There are situations due to browser quirks or Bootstrap CSS where\n * an anchor tag is needed, when semantically a button tag is the\n * better choice. SafeAnchor ensures that when an anchor is used like a\n * button its accessible. It also emulates input `disabled` behavior for\n * links, which is usually desirable for Buttons, NavItems, DropdownItems, etc.\n */\n\nvar SafeAnchor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {\n var _ref$as = _ref.as,\n Component = _ref$as === void 0 ? 'a' : _ref$as,\n disabled = _ref.disabled,\n onKeyDown = _ref.onKeyDown,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n var handleClick = function handleClick(event) {\n var href = props.href,\n onClick = props.onClick;\n if (disabled || isTrivialHref(href)) {\n event.preventDefault();\n }\n if (disabled) {\n event.stopPropagation();\n return;\n }\n if (onClick) {\n onClick(event);\n }\n };\n var handleKeyDown = function handleKeyDown(event) {\n if (event.key === ' ') {\n event.preventDefault();\n handleClick(event);\n }\n };\n if (isTrivialHref(props.href)) {\n props.role = props.role || 'button'; // we want to make sure there is a href attribute on the node\n // otherwise, the cursor incorrectly styled (except with role='button')\n\n props.href = props.href || '#';\n }\n if (disabled) {\n props.tabIndex = -1;\n props['aria-disabled'] = true;\n }\n return /*#__PURE__*/React.createElement(Component, _extends({\n ref: ref\n }, props, {\n onClick: handleClick,\n onKeyDown: createChainedFunction(handleKeyDown, onKeyDown)\n }));\n});\nSafeAnchor.displayName = 'SafeAnchor';\nexport default SafeAnchor;","import invariant from 'invariant';\nvar noop = function noop() {};\nfunction readOnlyPropType(handler, name) {\n return function (props, propName) {\n if (props[propName] !== undefined) {\n if (!props[handler]) {\n return new Error(\"You have provided a `\" + propName + \"` prop to `\" + name + \"` \" + (\"without an `\" + handler + \"` handler prop. This will render a read-only field. \") + (\"If the field should be mutable use `\" + defaultKey(propName) + \"`. \") + (\"Otherwise, set `\" + handler + \"`.\"));\n }\n }\n };\n}\nexport function uncontrolledPropTypes(controlledValues, displayName) {\n var propTypes = {};\n Object.keys(controlledValues).forEach(function (prop) {\n // add default propTypes for folks that use runtime checks\n propTypes[defaultKey(prop)] = noop;\n if (process.env.NODE_ENV !== 'production') {\n var handler = controlledValues[prop];\n !(typeof handler === 'string' && handler.trim().length) ? process.env.NODE_ENV !== \"production\" ? invariant(false, 'Uncontrollable - [%s]: the prop `%s` needs a valid handler key name in order to make it uncontrollable', displayName, prop) : invariant(false) : void 0;\n propTypes[prop] = readOnlyPropType(handler, displayName);\n }\n });\n return propTypes;\n}\nexport function isProp(props, prop) {\n return props[prop] !== undefined;\n}\nexport function defaultKey(key) {\n return 'default' + key.charAt(0).toUpperCase() + key.substr(1);\n}\n/**\n * Copyright (c) 2013-present, Facebook, Inc.\n * All rights reserved.\n *\n * This source code is licensed under the BSD-style license found in the\n * LICENSE file in the root directory of this source tree. An additional grant\n * of patent rights can be found in the PATENTS file in the same directory.\n */\n\nexport function canAcceptRef(component) {\n return !!component && (typeof component !== 'function' || component.prototype && component.prototype.isReactComponent);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return typeof key === \"symbol\" ? key : String(key);\n}\nfunction _toPrimitive(input, hint) {\n if (typeof input !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (typeof res !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\nimport { useCallback, useRef, useState } from 'react';\nimport * as Utils from './utils';\nfunction useUncontrolledProp(propValue, defaultValue, handler) {\n var wasPropRef = useRef(propValue !== undefined);\n var _useState = useState(defaultValue),\n stateValue = _useState[0],\n setState = _useState[1];\n var isProp = propValue !== undefined;\n var wasProp = wasPropRef.current;\n wasPropRef.current = isProp;\n /**\n * If a prop switches from controlled to Uncontrolled\n * reset its value to the defaultValue\n */\n\n if (!isProp && wasProp && stateValue !== defaultValue) {\n setState(defaultValue);\n }\n return [isProp ? propValue : stateValue, useCallback(function (value) {\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n if (handler) handler.apply(void 0, [value].concat(args));\n setState(value);\n }, [handler])];\n}\nexport { useUncontrolledProp };\nexport default function useUncontrolled(props, config) {\n return Object.keys(config).reduce(function (result, fieldName) {\n var _extends2;\n var _ref = result,\n defaultValue = _ref[Utils.defaultKey(fieldName)],\n propsValue = _ref[fieldName],\n rest = _objectWithoutPropertiesLoose(_ref, [Utils.defaultKey(fieldName), fieldName].map(_toPropertyKey));\n var handlerName = config[fieldName];\n var _useUncontrolledProp = useUncontrolledProp(propsValue, defaultValue, props[handlerName]),\n value = _useUncontrolledProp[0],\n handler = _useUncontrolledProp[1];\n return _extends({}, rest, (_extends2 = {}, _extends2[fieldName] = value, _extends2[handlerName] = handler, _extends2));\n }, props);\n}","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nfunction componentWillMount() {\n // Call this.constructor.gDSFP to support sub-classes.\n var state = this.constructor.getDerivedStateFromProps(this.props, this.state);\n if (state !== null && state !== undefined) {\n this.setState(state);\n }\n}\nfunction componentWillReceiveProps(nextProps) {\n // Call this.constructor.gDSFP to support sub-classes.\n // Use the setState() updater to ensure state isn't stale in certain edge cases.\n function updater(prevState) {\n var state = this.constructor.getDerivedStateFromProps(nextProps, prevState);\n return state !== null && state !== undefined ? state : null;\n }\n // Binding \"this\" is important for shallow renderer support.\n this.setState(updater.bind(this));\n}\nfunction componentWillUpdate(nextProps, nextState) {\n try {\n var prevProps = this.props;\n var prevState = this.state;\n this.props = nextProps;\n this.state = nextState;\n this.__reactInternalSnapshotFlag = true;\n this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(prevProps, prevState);\n } finally {\n this.props = prevProps;\n this.state = prevState;\n }\n}\n\n// React may warn about cWM/cWRP/cWU methods being deprecated.\n// Add a flag to suppress these warnings for this special case.\ncomponentWillMount.__suppressDeprecationWarning = true;\ncomponentWillReceiveProps.__suppressDeprecationWarning = true;\ncomponentWillUpdate.__suppressDeprecationWarning = true;\nfunction polyfill(Component) {\n var prototype = Component.prototype;\n if (!prototype || !prototype.isReactComponent) {\n throw new Error('Can only polyfill class components');\n }\n if (typeof Component.getDerivedStateFromProps !== 'function' && typeof prototype.getSnapshotBeforeUpdate !== 'function') {\n return Component;\n }\n\n // If new component APIs are defined, \"unsafe\" lifecycles won't be called.\n // Error if any of these lifecycles are present,\n // Because they would work differently between older and newer (16.3+) versions of React.\n var foundWillMountName = null;\n var foundWillReceivePropsName = null;\n var foundWillUpdateName = null;\n if (typeof prototype.componentWillMount === 'function') {\n foundWillMountName = 'componentWillMount';\n } else if (typeof prototype.UNSAFE_componentWillMount === 'function') {\n foundWillMountName = 'UNSAFE_componentWillMount';\n }\n if (typeof prototype.componentWillReceiveProps === 'function') {\n foundWillReceivePropsName = 'componentWillReceiveProps';\n } else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {\n foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';\n }\n if (typeof prototype.componentWillUpdate === 'function') {\n foundWillUpdateName = 'componentWillUpdate';\n } else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {\n foundWillUpdateName = 'UNSAFE_componentWillUpdate';\n }\n if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) {\n var componentName = Component.displayName || Component.name;\n var newApiName = typeof Component.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()';\n throw Error('Unsafe legacy lifecycles will not be called for components using new component APIs.\\n\\n' + componentName + ' uses ' + newApiName + ' but also contains the following legacy lifecycles:' + (foundWillMountName !== null ? '\\n ' + foundWillMountName : '') + (foundWillReceivePropsName !== null ? '\\n ' + foundWillReceivePropsName : '') + (foundWillUpdateName !== null ? '\\n ' + foundWillUpdateName : '') + '\\n\\nThe above lifecycles should be removed. Learn more about this warning here:\\n' + 'https://fb.me/react-async-component-lifecycle-hooks');\n }\n\n // React <= 16.2 does not support static getDerivedStateFromProps.\n // As a workaround, use cWM and cWRP to invoke the new static lifecycle.\n // Newer versions of React will ignore these lifecycles if gDSFP exists.\n if (typeof Component.getDerivedStateFromProps === 'function') {\n prototype.componentWillMount = componentWillMount;\n prototype.componentWillReceiveProps = componentWillReceiveProps;\n }\n\n // React <= 16.2 does not support getSnapshotBeforeUpdate.\n // As a workaround, use cWU to invoke the new lifecycle.\n // Newer versions of React will ignore that lifecycle if gSBU exists.\n if (typeof prototype.getSnapshotBeforeUpdate === 'function') {\n if (typeof prototype.componentDidUpdate !== 'function') {\n throw new Error('Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype');\n }\n prototype.componentWillUpdate = componentWillUpdate;\n var componentDidUpdate = prototype.componentDidUpdate;\n prototype.componentDidUpdate = function componentDidUpdatePolyfill(prevProps, prevState, maybeSnapshot) {\n // 16.3+ will not execute our will-update method;\n // It will pass a snapshot value to did-update though.\n // Older versions will require our polyfilled will-update value.\n // We need to handle both cases, but can't just check for the presence of \"maybeSnapshot\",\n // Because for <= 15.x versions this might be a \"prevContext\" object.\n // We also can't just check \"__reactInternalSnapshot\",\n // Because get-snapshot might return a falsy value.\n // So check for the explicit __reactInternalSnapshotFlag flag to determine behavior.\n var snapshot = this.__reactInternalSnapshotFlag ? this.__reactInternalSnapshot : maybeSnapshot;\n componentDidUpdate.call(this, prevProps, prevState, snapshot);\n };\n }\n return Component;\n}\nexport { polyfill };","import { useEffect, useRef } from 'react';\n\n/**\n * Creates a `Ref` whose value is updated in an effect, ensuring the most recent\n * value is the one rendered with. Generally only required for Concurrent mode usage\n * where previous work in `render()` may be discarded before being used.\n *\n * This is safe to access in an event handler.\n *\n * @param value The `Ref` value\n */\nfunction useCommittedRef(value) {\n const ref = useRef(value);\n useEffect(() => {\n ref.current = value;\n }, [value]);\n return ref;\n}\nexport default useCommittedRef;","import { useCallback } from 'react';\nimport useCommittedRef from './useCommittedRef';\nexport default function useEventCallback(fn) {\n const ref = useCommittedRef(fn);\n return useCallback(function () {\n return ref.current && ref.current(...arguments);\n }, [ref]);\n}","export default function _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n return _setPrototypeOf(o, p);\n}","import setPrototypeOf from \"./setPrototypeOf.js\";\nexport default function _inheritsLoose(subClass, superClass) {\n subClass.prototype = Object.create(superClass.prototype);\n subClass.prototype.constructor = subClass;\n setPrototypeOf(subClass, superClass);\n}","// shim for using process in browser\nvar process = module.exports = {};\n\n// cached from whatever global is present so that test runners that stub it\n// don't break things. But we need to wrap it in a try catch in case it is\n// wrapped in strict mode code which doesn't define any globals. It's inside a\n// function because try/catches deoptimize in certain engines.\n\nvar cachedSetTimeout;\nvar cachedClearTimeout;\nfunction defaultSetTimout() {\n throw new Error('setTimeout has not been defined');\n}\nfunction defaultClearTimeout() {\n throw new Error('clearTimeout has not been defined');\n}\n(function () {\n try {\n if (typeof setTimeout === 'function') {\n cachedSetTimeout = setTimeout;\n } else {\n cachedSetTimeout = defaultSetTimout;\n }\n } catch (e) {\n cachedSetTimeout = defaultSetTimout;\n }\n try {\n if (typeof clearTimeout === 'function') {\n cachedClearTimeout = clearTimeout;\n } else {\n cachedClearTimeout = defaultClearTimeout;\n }\n } catch (e) {\n cachedClearTimeout = defaultClearTimeout;\n }\n})();\nfunction runTimeout(fun) {\n if (cachedSetTimeout === setTimeout) {\n //normal enviroments in sane situations\n return setTimeout(fun, 0);\n }\n // if setTimeout wasn't available but was latter defined\n if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) {\n cachedSetTimeout = setTimeout;\n return setTimeout(fun, 0);\n }\n try {\n // when when somebody has screwed with setTimeout but no I.E. maddness\n return cachedSetTimeout(fun, 0);\n } catch (e) {\n try {\n // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally\n return cachedSetTimeout.call(null, fun, 0);\n } catch (e) {\n // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error\n return cachedSetTimeout.call(this, fun, 0);\n }\n }\n}\nfunction runClearTimeout(marker) {\n if (cachedClearTimeout === clearTimeout) {\n //normal enviroments in sane situations\n return clearTimeout(marker);\n }\n // if clearTimeout wasn't available but was latter defined\n if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) {\n cachedClearTimeout = clearTimeout;\n return clearTimeout(marker);\n }\n try {\n // when when somebody has screwed with setTimeout but no I.E. maddness\n return cachedClearTimeout(marker);\n } catch (e) {\n try {\n // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally\n return cachedClearTimeout.call(null, marker);\n } catch (e) {\n // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error.\n // Some versions of I.E. have different rules for clearTimeout vs setTimeout\n return cachedClearTimeout.call(this, marker);\n }\n }\n}\nvar queue = [];\nvar draining = false;\nvar currentQueue;\nvar queueIndex = -1;\nfunction cleanUpNextTick() {\n if (!draining || !currentQueue) {\n return;\n }\n draining = false;\n if (currentQueue.length) {\n queue = currentQueue.concat(queue);\n } else {\n queueIndex = -1;\n }\n if (queue.length) {\n drainQueue();\n }\n}\nfunction drainQueue() {\n if (draining) {\n return;\n }\n var timeout = runTimeout(cleanUpNextTick);\n draining = true;\n var len = queue.length;\n while (len) {\n currentQueue = queue;\n queue = [];\n while (++queueIndex < len) {\n if (currentQueue) {\n currentQueue[queueIndex].run();\n }\n }\n queueIndex = -1;\n len = queue.length;\n }\n currentQueue = null;\n draining = false;\n runClearTimeout(timeout);\n}\nprocess.nextTick = function (fun) {\n var args = new Array(arguments.length - 1);\n if (arguments.length > 1) {\n for (var i = 1; i < arguments.length; i++) {\n args[i - 1] = arguments[i];\n }\n }\n queue.push(new Item(fun, args));\n if (queue.length === 1 && !draining) {\n runTimeout(drainQueue);\n }\n};\n\n// v8 likes predictible objects\nfunction Item(fun, array) {\n this.fun = fun;\n this.array = array;\n}\nItem.prototype.run = function () {\n this.fun.apply(null, this.array);\n};\nprocess.title = 'browser';\nprocess.browser = true;\nprocess.env = {};\nprocess.argv = [];\nprocess.version = ''; // empty string to avoid regexp issues\nprocess.versions = {};\nfunction noop() {}\nprocess.on = noop;\nprocess.addListener = noop;\nprocess.once = noop;\nprocess.off = noop;\nprocess.removeListener = noop;\nprocess.removeAllListeners = noop;\nprocess.emit = noop;\nprocess.prependListener = noop;\nprocess.prependOnceListener = noop;\nprocess.listeners = function (name) {\n return [];\n};\nprocess.binding = function (name) {\n throw new Error('process.binding is not supported');\n};\nprocess.cwd = function () {\n return '/';\n};\nprocess.chdir = function (dir) {\n throw new Error('process.chdir is not supported');\n};\nprocess.umask = function () {\n return 0;\n};","// Assume className is simple and can be found at top-level (window).\n// Fallback to eval to handle cases like 'My.React.ComponentName'.\n// Also, try to gracefully import Babel 6 style default exports\nvar topLevel = typeof window === \"undefined\" ? this : window;\nmodule.exports = function (className) {\n var constructor;\n // Try to access the class globally first\n constructor = topLevel[className];\n\n // If that didn't work, try eval\n if (!constructor) {\n constructor = eval(className);\n }\n\n // Lastly, if there is a default attribute try that\n if (constructor && constructor['default']) {\n constructor = constructor['default'];\n }\n return constructor;\n};","// Load React components by requiring them from \"components/\", for example:\n//\n// - \"pages/index\" -> `require(\"components/pages/index\")`\n// - \"pages/show.Header\" -> `require(\"components/pages/show\").Header`\n// - \"pages/show.Body.Content\" -> `require(\"components/pages/show\").Body.Content`\n//\nmodule.exports = function (reqctx) {\n return function (className) {\n var parts = className.split(\".\");\n var filename = parts.shift();\n var keys = parts;\n // Load the module:\n var component = reqctx(\"./\" + filename);\n // Then access each key:\n keys.forEach(function (k) {\n component = component[k];\n });\n // support `export default`\n if (component.__esModule) {\n component = component[\"default\"];\n }\n return component;\n };\n};","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\n/**\n * Use invariant() to assert state which your program assumes to be true.\n *\n * Provide sprintf-style format (only %s is supported) and arguments\n * to provide information about what broke and what you were\n * expecting.\n *\n * The invariant message will be stripped in production, but the invariant\n * will remain to ensure logic does not differ in production.\n */\nvar invariant = function (condition, format, a, b, c, d, e, f) {\n if (process.env.NODE_ENV !== 'production') {\n if (format === undefined) {\n throw new Error('invariant requires an error message argument');\n }\n }\n if (!condition) {\n var error;\n if (format === undefined) {\n error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');\n } else {\n var args = [a, b, c, d, e, f];\n var argIndex = 0;\n error = new Error(format.replace(/%s/g, function () {\n return args[argIndex++];\n }));\n error.name = 'Invariant Violation';\n }\n error.framesToPop = 1; // we don't care about invariant's own frame\n throw error;\n }\n};\nmodule.exports = invariant;","import React from \"react\"\nimport Hero from \"./Hero\"\nimport Story from \"./Story\"\nimport Founders from \"./Founders\"\nimport Mission from \"./Mission\"\nimport Container from 'react-bootstrap/Container'\nimport Row from 'react-bootstrap/Row'\nimport Col from 'react-bootstrap/Col'\n\nconst About = (props) => {\n return (\n <>\n @vnbeans Community
\n\n
\n )\n }\n\n return (\n {content.title}
\n {renderBody()}\n\n
\n );\n};\n\nexport default Article;","import React, { useState, useEffect } from \"react\";\nimport { sanityClient } from \"../Sanity/sanityClient.jsx\"\nimport Parser from \"../Sanity/Parser.jsx\"\nimport ArticleLists from \"./ArticleLists.jsx\"\n\n\nconst Main = (props) => {\n useEffect(() => {\n getContent()\n }, [])\n\n const [content, setContent] = useState([])\n const [parser, setParser] = useState([])\n\n // Fetch content with GROQ\n const getContent = async () => {\n const CONTENT_QUERY = `*[_type == \"post\"] {\n ...,\n author->,\n categories[]->,\n mainImage {\n asset-> {\n url\n },\n },\n body[] {\n ...,\n children,\n }\n }\n `\n const content = await sanityClient.fetch(CONTENT_QUERY)\n setContent(content)\n setParser(Parser(content))\n return content\n}\n\n return (\n \n
\n \n {content && renderTitleAndBody()}\n
\n \n
\n )\n}\n\nexport default Main;\n\n\n\n\n","import React from \"react\"\nimport Container from 'react-bootstrap/Container'\nimport Row from 'react-bootstrap/Row'\nimport Col from 'react-bootstrap/Col'\nimport Button from 'react-bootstrap/Button'\n\nconst FAQ = (props) => {\n return (\n <>\n \n
\n Frequently Asked Questions
\n\n\n
\n\n What is Vietnamese Specialty Coffee?
\nVietnamese Specialty coffee is coffee, from Vietnam, that is cultivated, harvested, processed, and brewed in a high-quality manner. This results unique tasting notes like: fruity, sweet, sour, blueberries, chocolatey, nutty, earthy, acidic, and etc. The technical definition of specialty coffee, by the Specialty Coffee Association, is a coffee that scores above 80 in the 100-point coffee review.
\n\n
\n\n What does VN Beans taste like?
\nWe have two amazing coffee beans. Our natural-processed coffee has a very unique taste. The coffee tastes fruity, sweet, light-bodied, low-acidity, blueberries and strawberries. Our semi-wash processed coffee carries the traditional smooth flavor of chocolate and mocha.
\n\n
\n\n What is the difference between Vietnamese iced coffee (cà phê sữa đá) and VN Beans specialty coffee?
\nVietnamese iced coffee is a coffee drink style, orginating from Vietnam, that contains robusta coffee and sweetened condensed milk. Unfortunately, coffee drinks called \"Vietnamese style iced coffee\" is sold to consumers but the often time coffee doesn't originate from Vietnam. This leads to coffee shops benefitting from the culture of Vietnam but the coffee farmers don't.
\nVN Beans specialty coffee is arabica coffee beans from Vietnam that is cultivated, harvested, processed, and brewed in a high-quality manner. This results in straight coffee that doesn't require cream, sure, or additives for flavor.
\n\n
\n\n What does single-origin coffee mean?
\nThis refers to coffee that comes a country's specific region or farm. This increases accountability because consumers can match the coffee flavor and origin to a specific place.
\n\n
\n\n How long is shipping
\n2-3 days!
\n\n
\n\n How do I brew VN Beans coffee?
\nWe highly recommend brewing VN Beans coffee in a v60 dripper. We are working on a VN Beans brew guide, but in the meantime please refer to this Blue Bottle v60 Brew Guide.
\n\n
\n\n More questions?
\nPlease feel free to contact us at the button below, we'd love to chat with you!
\n\n \n
\n\n \n Locations
\n \nBest Coffee in {city}
\n {renderAllBusinessesInCity(props.businesses[city])}\n \n )\n })\n}\n\nconst renderAllBusinessesInCity = (businesses) => {\n return businesses.map( (biz) => {\n return\n
\n
Our Mission and Vision
\n \nIntroducing Real Vietnamese Coffee.
\nYou probably don't think of Vietnam when thinking about where your coffee comes from, even though they're the second largest exporter of coffee in the world. We're here to change that and put Vietnamese coffee on the map—and on your kitchen counter.
\n \n \nDiscover the Beauty of Single Origin Coffee, Directly Traded from Dalat, Vietnam
\nThe most important thing you should know about single origin beans is that it's of higher quality and you know exactly where your coffee comes from. VN Beans are harvested in the beautiful mountains of Dalat, Vietnam, where they're known for their Arabica coffee beans.
\n \n \nA Coffee Cup for Good
\nYou may have tried Vietnamese Iced Coffee (cà phê sữa đá), but most coffee shops don't use Vietnamese coffee beans to brew it. When you buy VN Beans, you are getting coffee beans that originate in Vietnam while championing for the hard-working farmers.
\n \n \n\n * I'm a fade Transition!\n *
\n * )}\n * \n * \n * {state => (\n * // ...\n * )}\n * \n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state\n * and stay there for 500ms (the value of `timeout`) before it finally switches\n * to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from\n * `'exiting'` to `'exited'`.\n */\n\nvar Transition = /*#__PURE__*/function (_React$Component) {\n _inheritsLoose(Transition, _React$Component);\n function Transition(props, context) {\n var _this;\n _this = _React$Component.call(this, props, context) || this;\n var parentGroup = context; // In the context of a TransitionGroup all enters are really appears\n\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n var initialStatus;\n _this.appearStatus = null;\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.appearStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n _this.state = {\n status: initialStatus\n };\n _this.nextCallback = null;\n return _this;\n }\n Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var nextIn = _ref.in;\n if (nextIn && prevState.status === UNMOUNTED) {\n return {\n status: EXITED\n };\n }\n return null;\n } // getSnapshotBeforeUpdate(prevProps) {\n // let nextStatus = null\n // if (prevProps !== this.props) {\n // const { status } = this.state\n // if (this.props.in) {\n // if (status !== ENTERING && status !== ENTERED) {\n // nextStatus = ENTERING\n // }\n // } else {\n // if (status === ENTERING || status === ENTERED) {\n // nextStatus = EXITING\n // }\n // }\n // }\n // return { nextStatus }\n // }\n ;\n\n var _proto = Transition.prototype;\n _proto.componentDidMount = function componentDidMount() {\n this.updateStatus(true, this.appearStatus);\n };\n _proto.componentDidUpdate = function componentDidUpdate(prevProps) {\n var nextStatus = null;\n if (prevProps !== this.props) {\n var status = this.state.status;\n if (this.props.in) {\n if (status !== ENTERING && status !== ENTERED) {\n nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n nextStatus = EXITING;\n }\n }\n }\n this.updateStatus(false, nextStatus);\n };\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n _proto.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n var exit, enter, appear;\n exit = enter = appear = timeout;\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter; // TODO: remove fallback for next major\n\n appear = timeout.appear !== undefined ? timeout.appear : enter;\n }\n return {\n exit: exit,\n enter: enter,\n appear: appear\n };\n };\n _proto.updateStatus = function updateStatus(mounting, nextStatus) {\n if (mounting === void 0) {\n mounting = false;\n }\n if (nextStatus !== null) {\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n if (nextStatus === ENTERING) {\n if (this.props.unmountOnExit || this.props.mountOnEnter) {\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749\n // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.\n // To make the animation happen, we have to separate each rendering and avoid being processed as batched.\n\n if (node) forceReflow(node);\n }\n this.performEnter(mounting);\n } else {\n this.performExit();\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({\n status: UNMOUNTED\n });\n }\n };\n _proto.performEnter = function performEnter(mounting) {\n var _this2 = this;\n var enter = this.props.enter;\n var appearing = this.context ? this.context.isMounting : mounting;\n var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],\n maybeNode = _ref2[0],\n maybeAppearing = _ref2[1];\n var timeouts = this.getTimeouts();\n var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n\n if (!mounting && !enter || config.disabled) {\n this.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode);\n });\n return;\n }\n this.props.onEnter(maybeNode, maybeAppearing);\n this.safeSetState({\n status: ENTERING\n }, function () {\n _this2.props.onEntering(maybeNode, maybeAppearing);\n _this2.onTransitionEnd(enterTimeout, function () {\n _this2.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode, maybeAppearing);\n });\n });\n });\n };\n _proto.performExit = function performExit() {\n var _this3 = this;\n var exit = this.props.exit;\n var timeouts = this.getTimeouts();\n var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED\n\n if (!exit || config.disabled) {\n this.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n return;\n }\n this.props.onExit(maybeNode);\n this.safeSetState({\n status: EXITING\n }, function () {\n _this3.props.onExiting(maybeNode);\n _this3.onTransitionEnd(timeouts.exit, function () {\n _this3.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n });\n });\n };\n _proto.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n _proto.safeSetState = function safeSetState(nextState, callback) {\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, callback);\n };\n _proto.setNextCallback = function setNextCallback(callback) {\n var _this4 = this;\n var active = true;\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this4.nextCallback = null;\n callback(event);\n }\n };\n this.nextCallback.cancel = function () {\n active = false;\n };\n return this.nextCallback;\n };\n _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {\n this.setNextCallback(handler);\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);\n var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;\n if (!node || doesNotHaveTimeoutOrListener) {\n setTimeout(this.nextCallback, 0);\n return;\n }\n if (this.props.addEndListener) {\n var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],\n maybeNode = _ref3[0],\n maybeNextCallback = _ref3[1];\n this.props.addEndListener(maybeNode, maybeNextCallback);\n }\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n };\n _proto.render = function render() {\n var status = this.state.status;\n if (status === UNMOUNTED) {\n return null;\n }\n var _this$props = this.props,\n children = _this$props.children,\n _in = _this$props.in,\n _mountOnEnter = _this$props.mountOnEnter,\n _unmountOnExit = _this$props.unmountOnExit,\n _appear = _this$props.appear,\n _enter = _this$props.enter,\n _exit = _this$props.exit,\n _timeout = _this$props.timeout,\n _addEndListener = _this$props.addEndListener,\n _onEnter = _this$props.onEnter,\n _onEntering = _this$props.onEntering,\n _onEntered = _this$props.onEntered,\n _onExit = _this$props.onExit,\n _onExiting = _this$props.onExiting,\n _onExited = _this$props.onExited,\n _nodeRef = _this$props.nodeRef,\n childProps = _objectWithoutPropertiesLoose(_this$props, [\"children\", \"in\", \"mountOnEnter\", \"unmountOnExit\", \"appear\", \"enter\", \"exit\", \"timeout\", \"addEndListener\", \"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"onExited\", \"nodeRef\"]);\n return /*#__PURE__*/(\n // allows for nested Transitions\n React.createElement(TransitionGroupContext.Provider, {\n value: null\n }, typeof children === 'function' ? children(status, childProps) : /*#__PURE__*/React.cloneElement(React.Children.only(children), childProps))\n );\n };\n return Transition;\n}(React.Component);\nTransition.contextType = TransitionGroupContext;\n// Name the function so it is clearer in the documentation\n\nfunction noop() {}\nTransition.defaultProps = {\n in: false,\n mountOnEnter: false,\n unmountOnExit: false,\n appear: false,\n enter: true,\n exit: true,\n onEnter: noop,\n onEntering: noop,\n onEntered: noop,\n onExit: noop,\n onExiting: noop,\n onExited: noop\n};\nTransition.UNMOUNTED = UNMOUNTED;\nTransition.EXITED = EXITED;\nTransition.ENTERING = ENTERING;\nTransition.ENTERED = ENTERED;\nTransition.EXITING = EXITING;\nexport default Transition;","export var forceReflow = function forceReflow(node) {\n return node.scrollTop;\n};","export default !!(typeof window !== 'undefined' && window.document && window.document.createElement);","/* eslint-disable no-return-assign */\nimport canUseDOM from './canUseDOM';\nexport var optionsSupported = false;\nexport var onceSupported = false;\ntry {\n var options = {\n get passive() {\n return optionsSupported = true;\n },\n get once() {\n // eslint-disable-next-line no-multi-assign\n return onceSupported = optionsSupported = true;\n }\n };\n if (canUseDOM) {\n window.addEventListener('test', options, options);\n window.removeEventListener('test', options, true);\n }\n} catch (e) {\n /* */\n}\n\n/**\n * An `addEventListener` ponyfill, supports the `once` option\n * \n * @param node the element\n * @param eventName the event name\n * @param handle the handler\n * @param options event options\n */\nfunction addEventListener(node, eventName, handler, options) {\n if (options && typeof options !== 'boolean' && !onceSupported) {\n var once = options.once,\n capture = options.capture;\n var wrappedHandler = handler;\n if (!onceSupported && once) {\n wrappedHandler = handler.__once || function onceHandler(event) {\n this.removeEventListener(eventName, onceHandler, capture);\n handler.call(this, event);\n };\n handler.__once = wrappedHandler;\n }\n node.addEventListener(eventName, wrappedHandler, optionsSupported ? options : capture);\n }\n node.addEventListener(eventName, handler, options);\n}\nexport default addEventListener;","/**\n * A `removeEventListener` ponyfill\n * \n * @param node the element\n * @param eventName the event name\n * @param handle the handler\n * @param options event options\n */\nfunction removeEventListener(node, eventName, handler, options) {\n var capture = options && typeof options !== 'boolean' ? options.capture : options;\n node.removeEventListener(eventName, handler, capture);\n if (handler.__once) {\n node.removeEventListener(eventName, handler.__once, capture);\n }\n}\nexport default removeEventListener;","import addEventListener from './addEventListener';\nimport removeEventListener from './removeEventListener';\nfunction listen(node, eventName, handler, options) {\n addEventListener(node, eventName, handler, options);\n return function () {\n removeEventListener(node, eventName, handler, options);\n };\n}\nexport default listen;","import css from './css';\nimport listen from './listen';\nimport triggerEvent from './triggerEvent';\nfunction parseDuration(node) {\n var str = css(node, 'transitionDuration') || '';\n var mult = str.indexOf('ms') === -1 ? 1000 : 1;\n return parseFloat(str) * mult;\n}\nfunction emulateTransitionEnd(element, duration, padding) {\n if (padding === void 0) {\n padding = 5;\n }\n var called = false;\n var handle = setTimeout(function () {\n if (!called) triggerEvent(element, 'transitionend', true);\n }, duration + padding);\n var remove = listen(element, 'transitionend', function () {\n called = true;\n }, {\n once: true\n });\n return function () {\n clearTimeout(handle);\n remove();\n };\n}\nexport default function transitionEnd(element, handler, duration, padding) {\n if (duration == null) duration = parseDuration(element) || 0;\n var removeEmulate = emulateTransitionEnd(element, duration, padding);\n var remove = listen(element, 'transitionend', handler);\n return function () {\n removeEmulate();\n remove();\n };\n}","/**\n * Triggers an event on a given element.\n * \n * @param node the element\n * @param eventName the event name to trigger\n * @param bubbles whether the event should bubble up\n * @param cancelable whether the event should be cancelable\n */\nexport default function triggerEvent(node, eventName, bubbles, cancelable) {\n if (bubbles === void 0) {\n bubbles = false;\n }\n if (cancelable === void 0) {\n cancelable = true;\n }\n if (node) {\n var event = document.createEvent('HTMLEvents');\n event.initEvent(eventName, bubbles, cancelable);\n node.dispatchEvent(event);\n }\n}","import css from 'dom-helpers/css';\nimport transitionEnd from 'dom-helpers/transitionEnd';\nfunction parseDuration(node, property) {\n var str = css(node, property) || '';\n var mult = str.indexOf('ms') === -1 ? 1000 : 1;\n return parseFloat(str) * mult;\n}\nexport default function transitionEndListener(element, handler) {\n var duration = parseDuration(element, 'transitionDuration');\n var delay = parseDuration(element, 'transitionDelay');\n var remove = transitionEnd(element, function (e) {\n if (e.target === element) {\n remove();\n handler(e);\n }\n }, duration + delay);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"className\", \"children\", \"dimension\", \"getDimensionValue\"];\nvar _collapseStyles;\nimport classNames from 'classnames';\nimport css from 'dom-helpers/css';\nimport React, { useMemo } from 'react';\nimport Transition, { ENTERED, ENTERING, EXITED, EXITING } from 'react-transition-group/Transition';\nimport transitionEndListener from './transitionEndListener';\nimport createChainedFunction from './createChainedFunction';\nimport triggerBrowserReflow from './triggerBrowserReflow';\nvar MARGINS = {\n height: ['marginTop', 'marginBottom'],\n width: ['marginLeft', 'marginRight']\n};\nfunction getDefaultDimensionValue(dimension, elem) {\n var offset = \"offset\" + dimension[0].toUpperCase() + dimension.slice(1);\n var value = elem[offset];\n var margins = MARGINS[dimension];\n return value +\n // @ts-ignore\n parseInt(css(elem, margins[0]), 10) +\n // @ts-ignore\n parseInt(css(elem, margins[1]), 10);\n}\nvar collapseStyles = (_collapseStyles = {}, _collapseStyles[EXITED] = 'collapse', _collapseStyles[EXITING] = 'collapsing', _collapseStyles[ENTERING] = 'collapsing', _collapseStyles[ENTERED] = 'collapse show', _collapseStyles);\nvar defaultProps = {\n in: false,\n timeout: 300,\n mountOnEnter: false,\n unmountOnExit: false,\n appear: false,\n getDimensionValue: getDefaultDimensionValue\n};\nvar Collapse = /*#__PURE__*/React.forwardRef(function (_ref, ref) {\n var onEnter = _ref.onEnter,\n onEntering = _ref.onEntering,\n onEntered = _ref.onEntered,\n onExit = _ref.onExit,\n onExiting = _ref.onExiting,\n className = _ref.className,\n children = _ref.children,\n _ref$dimension = _ref.dimension,\n dimension = _ref$dimension === void 0 ? 'height' : _ref$dimension,\n _ref$getDimensionValu = _ref.getDimensionValue,\n getDimensionValue = _ref$getDimensionValu === void 0 ? getDefaultDimensionValue : _ref$getDimensionValu,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n\n /* Compute dimension */\n var computedDimension = typeof dimension === 'function' ? dimension() : dimension;\n /* -- Expanding -- */\n\n var handleEnter = useMemo(function () {\n return createChainedFunction(function (elem) {\n elem.style[computedDimension] = '0';\n }, onEnter);\n }, [computedDimension, onEnter]);\n var handleEntering = useMemo(function () {\n return createChainedFunction(function (elem) {\n var scroll = \"scroll\" + computedDimension[0].toUpperCase() + computedDimension.slice(1);\n elem.style[computedDimension] = elem[scroll] + \"px\";\n }, onEntering);\n }, [computedDimension, onEntering]);\n var handleEntered = useMemo(function () {\n return createChainedFunction(function (elem) {\n elem.style[computedDimension] = null;\n }, onEntered);\n }, [computedDimension, onEntered]);\n /* -- Collapsing -- */\n\n var handleExit = useMemo(function () {\n return createChainedFunction(function (elem) {\n elem.style[computedDimension] = getDimensionValue(computedDimension, elem) + \"px\";\n triggerBrowserReflow(elem);\n }, onExit);\n }, [onExit, getDimensionValue, computedDimension]);\n var handleExiting = useMemo(function () {\n return createChainedFunction(function (elem) {\n elem.style[computedDimension] = null;\n }, onExiting);\n }, [computedDimension, onExiting]);\n return /*#__PURE__*/React.createElement(Transition // @ts-ignore\n , _extends({\n ref: ref,\n addEndListener: transitionEndListener\n }, props, {\n \"aria-expanded\": props.role ? props.in : null,\n onEnter: handleEnter,\n onEntering: handleEntering,\n onEntered: handleEntered,\n onExit: handleExit,\n onExiting: handleExiting\n }), function (state, innerProps) {\n return /*#__PURE__*/React.cloneElement(children, _extends({}, innerProps, {\n className: classNames(className, children.props.className, collapseStyles[state], computedDimension === 'width' && 'width')\n }));\n });\n}); // @ts-ignore\n\n// @ts-ignore\nCollapse.defaultProps = defaultProps;\nexport default Collapse;","// reading a dimension prop will cause the browser to recalculate,\n// which will let our animations work\nexport default function triggerBrowserReflow(node) {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n node.offsetHeight;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"children\", \"bsPrefix\"];\nimport React from 'react';\nimport Collapse from './Collapse';\nimport { useBootstrapPrefix } from './ThemeProvider';\nimport NavbarContext from './NavbarContext';\nvar NavbarCollapse = /*#__PURE__*/React.forwardRef(function (_ref, ref) {\n var children = _ref.children,\n bsPrefix = _ref.bsPrefix,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n bsPrefix = useBootstrapPrefix(bsPrefix, 'navbar-collapse');\n return /*#__PURE__*/React.createElement(NavbarContext.Consumer, null, function (context) {\n return /*#__PURE__*/React.createElement(Collapse, _extends({\n in: !!(context && context.expanded)\n }, props), /*#__PURE__*/React.createElement(\"div\", {\n ref: ref,\n className: bsPrefix\n }, children));\n });\n});\nNavbarCollapse.displayName = 'NavbarCollapse';\nexport default NavbarCollapse;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"bsPrefix\", \"className\", \"children\", \"label\", \"as\", \"onClick\"];\nimport classNames from 'classnames';\nimport React, { useContext } from 'react';\nimport useEventCallback from '@restart/hooks/useEventCallback';\nimport { useBootstrapPrefix } from './ThemeProvider';\nimport NavbarContext from './NavbarContext';\nvar defaultProps = {\n label: 'Toggle navigation'\n};\nvar NavbarToggle = /*#__PURE__*/React.forwardRef(function (_ref, ref) {\n var bsPrefix = _ref.bsPrefix,\n className = _ref.className,\n children = _ref.children,\n label = _ref.label,\n _ref$as = _ref.as,\n Component = _ref$as === void 0 ? 'button' : _ref$as,\n onClick = _ref.onClick,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n bsPrefix = useBootstrapPrefix(bsPrefix, 'navbar-toggler');\n var _ref2 = useContext(NavbarContext) || {},\n onToggle = _ref2.onToggle,\n expanded = _ref2.expanded;\n var handleClick = useEventCallback(function (e) {\n if (onClick) onClick(e);\n if (onToggle) onToggle();\n });\n if (Component === 'button') {\n props.type = 'button';\n }\n return /*#__PURE__*/React.createElement(Component, _extends({}, props, {\n ref: ref,\n onClick: handleClick,\n \"aria-label\": label,\n className: classNames(className, bsPrefix, !expanded && 'collapsed')\n }), children || /*#__PURE__*/React.createElement(\"span\", {\n className: bsPrefix + \"-icon\"\n }));\n});\nNavbarToggle.displayName = 'NavbarToggle';\nNavbarToggle.defaultProps = defaultProps;\nexport default NavbarToggle;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"bsPrefix\", \"expand\", \"variant\", \"bg\", \"fixed\", \"sticky\", \"className\", \"children\", \"as\", \"expanded\", \"onToggle\", \"onSelect\", \"collapseOnSelect\"];\nimport classNames from 'classnames';\nimport React, { useCallback, useMemo } from 'react';\nimport { useUncontrolled } from 'uncontrollable';\nimport createWithBsPrefix from './createWithBsPrefix';\nimport NavbarBrand from './NavbarBrand';\nimport NavbarCollapse from './NavbarCollapse';\nimport NavbarToggle from './NavbarToggle';\nimport { useBootstrapPrefix } from './ThemeProvider';\nimport NavbarContext from './NavbarContext';\nimport SelectableContext from './SelectableContext';\nvar NavbarText = createWithBsPrefix('navbar-text', {\n Component: 'span'\n});\nvar defaultProps = {\n expand: true,\n variant: 'light',\n collapseOnSelect: false\n};\nvar Navbar = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _useUncontrolled = useUncontrolled(props, {\n expanded: 'onToggle'\n }),\n initialBsPrefix = _useUncontrolled.bsPrefix,\n expand = _useUncontrolled.expand,\n variant = _useUncontrolled.variant,\n bg = _useUncontrolled.bg,\n fixed = _useUncontrolled.fixed,\n sticky = _useUncontrolled.sticky,\n className = _useUncontrolled.className,\n children = _useUncontrolled.children,\n _useUncontrolled$as = _useUncontrolled.as,\n Component = _useUncontrolled$as === void 0 ? 'nav' : _useUncontrolled$as,\n expanded = _useUncontrolled.expanded,\n _onToggle = _useUncontrolled.onToggle,\n onSelect = _useUncontrolled.onSelect,\n collapseOnSelect = _useUncontrolled.collapseOnSelect,\n controlledProps = _objectWithoutPropertiesLoose(_useUncontrolled, _excluded);\n var bsPrefix = useBootstrapPrefix(initialBsPrefix, 'navbar');\n var handleCollapse = useCallback(function () {\n if (onSelect) onSelect.apply(void 0, arguments);\n if (collapseOnSelect && expanded) {\n if (_onToggle) {\n _onToggle(false);\n }\n }\n }, [onSelect, collapseOnSelect, expanded, _onToggle]); // will result in some false positives but that seems better\n // than false negatives. strict `undefined` check allows explicit\n // \"nulling\" of the role if the user really doesn't want one\n\n if (controlledProps.role === undefined && Component !== 'nav') {\n controlledProps.role = 'navigation';\n }\n var expandClass = bsPrefix + \"-expand\";\n if (typeof expand === 'string') expandClass = expandClass + \"-\" + expand;\n var navbarContext = useMemo(function () {\n return {\n onToggle: function onToggle() {\n return _onToggle && _onToggle(!expanded);\n },\n bsPrefix: bsPrefix,\n expanded: !!expanded\n };\n }, [bsPrefix, expanded, _onToggle]);\n return /*#__PURE__*/React.createElement(NavbarContext.Provider, {\n value: navbarContext\n }, /*#__PURE__*/React.createElement(SelectableContext.Provider, {\n value: handleCollapse\n }, /*#__PURE__*/React.createElement(Component, _extends({\n ref: ref\n }, controlledProps, {\n className: classNames(className, bsPrefix, expand && expandClass, variant && bsPrefix + \"-\" + variant, bg && \"bg-\" + bg, sticky && \"sticky-\" + sticky, fixed && \"fixed-\" + fixed)\n }), children)));\n});\nNavbar.defaultProps = defaultProps;\nNavbar.displayName = 'Navbar';\nNavbar.Brand = NavbarBrand;\nNavbar.Toggle = NavbarToggle;\nNavbar.Collapse = NavbarCollapse;\nNavbar.Text = NavbarText;\nexport default Navbar;","import React from 'react'\nimport NavLink from './NavLink'\nimport Nav from 'react-bootstrap/Nav'\nimport Navbar from 'react-bootstrap/Navbar'\nimport Button from 'react-bootstrap/Button'\n\n\nconst NavLayout = ({logo, controllerAction}) => {\n\n return (\n <>\n