\n {secondaryButtons &&\n secondaryButtons.map((button, index) => (\n \n {button.title}\n \n ))}\n
\n \n {primaryButtons &&\n primaryButtons.map((button, index) => (\n \n {button.isLoading ? (\n \n ) : (\n button.title\n )}\n \n ))}\n
\n \n ) : (\n <>\n {dangerButtons &&\n dangerButtons.map((button, index) => (\n \n ))}\n {secondaryButtons &&\n secondaryButtons.map((button, index) => (\n Discount Code
\n \n {\n props.setPromoCode(e.target.value);\n }}\n />\n
\n \n {props.promoCode && (\n \n Discount code is not valid!\n
\n ) : (\n <>\n {props.restrictionCoupon ? (\n props.applyDis ? (\n \n {props.matchedCode.coupon.percent_off\n ? `${props.matchedCode.coupon.percent_off}% `\n : `${props.matchedCode.coupon.amount_off / 100}$ `}\n discount is applied!\n {props.matchedCode.coupon.percent_off == 100 && (\n
\n ) : (\n A minimum amount of $0.50 will be applied to your card.
\n )}\n \n coupon not applied: minimum of{' '}\n {props.matchedCode.restrictions.minimum_amount} order value\n was not met!\n
\n )\n ) : (\n \n {props.matchedCode.coupon.percent_off\n ? `${props.matchedCode.coupon.percent_off}% `\n : `${props.matchedCode.coupon.amount_off / 100}$ `}\n discount is applied!\n {props.matchedCode.coupon.percent_off == 100 && (\n
\n )}\n \n )}\n \n )}\n \n );\n};\n\nexport default DiscountCode;\n","import React, { useEffect } from 'react';\nimport jwtDecode from 'jwt-decode';\nimport { connect } from 'react-redux';\n\nimport { retrieveUser } from '../../state/login/thunks';\nimport { ShowLock } from '../../utils/auth0';\nimport { logout } from '../../state/login/action';\nimport { navigate } from '@reach/router';\n\nconst CheckJwt = (props) => {\n if (props.token) {\n const jwt = jwtDecode(props.token);\n const checkExpiry1 = jwt.exp < new Date() / 1000;\n // const checkExpiry2 = jwt.exp * 1000 < Date.now();\n\n if (checkExpiry1) {\n props.logout();\n ShowLock();\n }\n }\n\n useEffect(() => {\n if (window === void 0) {\n return;\n }\n // if (props.profile && props.profile.sub) {\n // props.getUser(props.profile.sub).catch((e) => {\n // if (!props.onCreate && e.status === 404) {\n // navigate(`/create`);\n // }\n // });\n // }\n }, []);\n\n return <>{props.children};\n};\n\nconst mapStateToProps = (state) => ({\n isAuthenticated: state.login.isAuthenticated,\n token: state.login.auth && state.login.auth.auth.accessToken,\n lastChecked: state.login.lastChecked,\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n logout: () => dispatch(logout()),\n getUser: (userID) => dispatch(retrieveUser(userID)),\n});\n\nexport default connect(mapStateToProps, mapDispatchToProps)(CheckJwt);\n","module.exports = __webpack_public_path__ + \"static/noimage-0383a250e987fe737edbf2518f208bc7.jpg\";","import React from 'react';\n\nexport default ({ msg, format }) => (\n A minimum amount of $0.50 will be applied to your card.
\n )}\n \n \n
\n);\n","module.exports = \"data:image/png;base64,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\"","import {\n FETCHING_PRICE,\n SET_PRICE,\n RESET_PRICE,\n SET_PRICE_ASSEMBLY,\n} from '../../actionTypes';\n\nexport const fetchingPrice = () => ({\n type: FETCHING_PRICE,\n});\n\nexport const getPrice = (price) => ({\n type: SET_PRICE,\n price,\n});\n\nexport const getPriceAssembly = (price) => ({\n type: SET_PRICE_ASSEMBLY,\n price,\n});\n\nexport const resetPrice = () => ({\n type: RESET_PRICE,\n});\n","module.exports = __webpack_public_path__ + \"static/creditkey-logo-2ac01a6dffba63f9437c40ec6d4e87a4.png\";","import React from 'react';\nimport { Overlay, Tooltip } from 'react-bootstrap';\n\nconst CustomTooltip = (props) => {\n const usualTxt = `You have no permission to perform this action.\n Please talk to your admin for more details!`;\n return (\n {msg}
\n{child}
;\n });\n\n const sliderDirection = direction || 'left';\n const className = `slider ${sliderDirection}`;\n\n return {child}
;\n};\n\nexport default Slider;\n","import React, { useEffect, useRef, useState } from 'react';\nimport { Form } from 'react-bootstrap';\n\nimport CreditCardInfo from './creditcard/CreditCardModal';\nimport { getMembershipPlans } from '../utils/api';\nimport Modal from './Modal';\nimport Slider from './Slider';\nimport DiscountCode from './DiscountCode';\nimport CustomTooltip from './Tooltip';\n\nconst ChoiceCard = ({\n isSelected,\n onSelect,\n title,\n content,\n price,\n billed,\n item,\n setPlans,\n plans,\n showToggle,\n _setSelectedPlan,\n}) => {\n const def = () => false;\n const [tooltipOpen, setTooltipOpen] = useState(false);\n const membershipTarget = useRef(null);\n\n const className = `card option col-md-4 col-12 px-0 mx-1 ${\n isSelected\n ? 'selected bg-primary border-primary'\n : item.interval === 'year'\n ? 'year'\n : ''\n }`;\n\n const bodyClass = `card-body ${isSelected ? 'bg-white' : ''} `;\n\n const onChange = (selectedItem) => {\n const found = plans.find(\n (member) =>\n member.id !== selectedItem.id && member.product === selectedItem.product\n );\n const tt = plans.map((mmb) => {\n if (mmb.id === selectedItem.id) {\n return {\n ...mmb,\n showWhenToggled: false,\n toggled: mmb.interval === 'year' ? true : false,\n };\n } else if (mmb.id === found.id) {\n return {\n ...mmb,\n showWhenToggled: true,\n toggled: mmb.interval === 'year' ? true : false,\n };\n } else {\n return { ...mmb, toggled: mmb.toggled ? true : false };\n }\n });\n setPlans(tt);\n setTimeout(() => {\n _setSelectedPlan({});\n }, 300);\n };\n\n return (\n \n
\n );\n};\n\nconst getPrice = (plan) => {\n return plan.amount > 0 ? `$ ${(plan.amount / 100).toFixed(2)}` : 'Free';\n};\n\nexport default (props) => {\n const showCard = props.showCard !== void 0 ? props.showCard : true;\n const editProfile = props.editProfile !== void 0 ? props.editProfile : true;\n\n const [slide, slideNumber] = useState(0);\n const [loading, setLoading] = useState(false);\n const [loadingSubmission, isLoadingSubmission] = useState(false);\n const [isMemValid, setMemIsValid] = useState(false);\n const [plans, setPlans] = useState([]);\n const [stripe, setStripe] = useState(null);\n const [cardError, setCardError] = useState(undefined);\n const [selectedMb, setSelMb] = useState(null);\n\n const fetchMemberships = async () => {\n setLoading(true);\n const memberships = await getMembershipPlans();\n const ttt = memberships.data\n .filter((it) => Object.keys(it.metadata).length !== 0)\n .map((it) => {\n if (it.interval === 'year') {\n return {\n ...it,\n showWhenToggled: false,\n toggled: false,\n showToggle: true,\n sort: it.metadata.nickname.includes('Silver') ? 1 : 2,\n };\n } else {\n return {\n ...it,\n showWhenToggled: true,\n toggled: false,\n showToggle: it.metadata.nickname.includes('Standa') ? false : true,\n sort: it.metadata.nickname.includes('Silver')\n ? 1\n : it.metadata.nickname.includes('Gold')\n ? 2\n : 0,\n };\n }\n });\n setPlans(ttt ? ttt : []);\n setLoading(false);\n };\n\n useEffect(() => {\n if (props.show) {\n fetchMemberships();\n }\n }, [props.show, props.erpMembershipContent]);\n\n const erpContent =\n props.erpMembershipContent &&\n props.erpMembershipContent.reduce((acc, tier) => {\n acc[tier.sku] = tier;\n return acc;\n }, {});\n\n console.log('erpContent', erpContent);\n\n const setSelectedPlan = (plan) => {\n if (plan.id) {\n setMemIsValid(true);\n }\n props.set_SelectedPlan(plan);\n props.setChosen(plan);\n setSelMb(plan.metadata.nickname);\n };\n\n let back = [{ title: 'Back', handle: () => slideNumber(slide - 1) }];\n\n if (slide === 0) {\n back = [];\n }\n\n const handleNext = () => {\n if (showCard) {\n if (slide !== 1) {\n return [\n {\n title: 'Next',\n disabled: !isMemValid,\n handle: () => {\n if (isMemValid) {\n slideNumber(slide + 1);\n }\n },\n },\n ];\n }\n if (stripe) {\n return [\n {\n title: `Choose ${props.selectedPlan.metadata.nickname}`,\n disabled: !isMemValid,\n handle: async () => {\n if (!stripe) {\n return;\n }\n setCardError();\n const stripeResponse = await stripe.stripe.createToken(\n stripe.card\n );\n\n if (stripeResponse.error) {\n setCardError(stripeResponse.error.message);\n return;\n }\n isLoadingSubmission(true);\n props.submitMembership(\n stripeResponse.token.id,\n props.selectedPlan\n );\n isLoadingSubmission(false);\n slideNumber(0);\n },\n },\n ];\n }\n }\n\n return [\n editProfile\n ? {\n title:\n props.selectedPlan &&\n Object.entries(props.selectedPlan).length !== 0 ? (\n !props.loading ? (\n `Choose ${\n props.selectedPlan && props.selectedPlan.metadata\n ? props.selectedPlan.metadata.nickname\n : props.selectedPlan.nickname\n }`\n ) : (\n \n )\n ) : (\n 'Choose one'\n ),\n handle: () => {\n isLoadingSubmission(true);\n props.submitMembership('', props.selectedPlan);\n isLoadingSubmission(false);\n slideNumber(0);\n },\n disabled:\n (props.selectedPlan &&\n Object.entries(props.selectedPlan).length === 0) ||\n (props.review ? false : !props.cardInfo),\n }\n : {\n title: `Choose ${props.selectedPlan.metadata.nickname}`,\n handle: () => {\n isLoadingSubmission(true);\n props.submitMembership('', props.selectedPlan);\n isLoadingSubmission(false);\n slideNumber(0);\n },\n disabled: Object.entries(props.selectedPlan).length === 0,\n },\n ];\n };\n\n const handleClose = () => {\n props.handleClose();\n slideNumber(0);\n };\n console.log('plans', plans);\n return (\n \n {showToggle && (\n
\n \n onChange(item)}\n ref={membershipTarget}\n onMouseEnter={() => setTooltipOpen(true)}\n onMouseLeave={() => setTooltipOpen(false)}\n >\n \n \n
\n )}\n {title}
\n\n
\n \n {price === 'Free' ? `${price}` : `${price} billed every ${billed}`}\n
\n \n {!loading ? (\n <>\n {plans\n .sort((a, b) => a.sort - b.sort)\n .map((plan, index) => {\n const wpContent = erpContent && erpContent[plan.id];\n if (wpContent && plan.showWhenToggled) {\n return (\n setSelectedPlan(plan)}\n billed={plan.interval}\n key={index}\n item={plan}\n setPlans={setPlans}\n plans={plans}\n showToggle={plan.showToggle}\n _setSelectedPlan={props.set_SelectedPlan}\n />\n );\n }\n })}\n \n ) : (\n \n )}\n
\n {showCard ? (\n \n \n {cardError}\n \n )}\n
\n ) : null}\n Enter Credit Card information
\n\n You will be charged $\n {props.matchedCode\n ? props.selectedPlan\n ? Number(\n (props.selectedPlan.amount || 0) / 100 -\n (props.matchedCode.coupon.percent_off\n ? (Number(props.matchedCode.coupon.percent_off) /\n 100) *\n ((props.selectedPlan.amount || 0) / 100)\n : props.matchedCode.coupon.amount_off / 100)\n ).toFixed(2)\n : 0\n : (\n (props.selectedPlan ? props.selectedPlan.amount : 0 || 0) /\n 100\n ).toFixed(2)}\n
\n {cardError !== void 0 && (\n\n setShow(true)}\n // onMouseLeave={() => setShow(false)}\n >\n {children}\n
\n \n );\n}\n","import React, { useState, useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { Form } from 'react-bootstrap';\n\nimport Loader from '../Loader';\nimport { getShippingOptions, getShippmentRates } from '../../utils/api';\nimport { debounceCustom } from '../../utils/helpers';\n\nconst ShippingOptions = ({\n authToken,\n name,\n value,\n onChange,\n isValid,\n isInvalid,\n handleBlur,\n values,\n items,\n phone,\n addressChange,\n countryChange,\n setAddressChange,\n setCountryChange,\n shippingAddresses,\n shippingRates,\n rateFetched,\n setFetchRates,\n setRates,\n}) => {\n const [shippingOptions, setShippingOptions] = useState(null);\n\n const getAllShippingOptions = async () => {\n const data = await getShippingOptions(authToken);\n setShippingOptions(data);\n };\n\n const fetchShippmentRates = debounceCustom(async (data) => {\n setFetchRates(0);\n const res = await getShippmentRates(data, authToken);\n if (res.status === 'SUCCESS') {\n if (res.rates.length !== 0) {\n setFetchRates(1);\n }\n setRates(res.rates);\n setAddressChange(false);\n setCountryChange(false);\n } else {\n setFetchRates(2);\n setAddressChange(false);\n setCountryChange(false);\n }\n }, 100);\n\n useEffect(() => {\n setTimeout(() => {\n getAllShippingOptions();\n }, 100);\n }, []);\n\n useEffect(() => {\n if (countryChange || addressChange) {\n let debouncer = setTimeout(() => {\n let data = {\n city: shippingAddresses.city,\n address1: shippingAddresses.address,\n state: shippingAddresses.state && Number(shippingAddresses.state),\n country: shippingAddresses.country && Number(shippingAddresses.country),\n zipcode: shippingAddresses.zipcode,\n name: values.firstName + ' ' + values.lastName,\n items,\n phone: phone,\n }\n fetchShippmentRates({\n city: shippingAddresses.city,\n address1: shippingAddresses.address,\n state: shippingAddresses.state && Number(shippingAddresses.state),\n country: shippingAddresses.country && Number(shippingAddresses.country),\n zipcode: shippingAddresses.zipcode,\n name: values.firstName + ' ' + values.lastName,\n items,\n phone: phone,\n });\n }, 3500);\n\n return () => {\n clearTimeout(debouncer);\n };\n }\n }, [countryChange, addressChange]);\n\n\n if (rateFetched === 2) {\n return shippingOptions ? (\n \n {text}\n \n {\n if (priceTooltip) {\n setShowQtyNotification(false);\n } else {\n setHide(true);\n }\n }}\n />\n
\n \n \n Checking your shipping options\n \n
\n );\n }\n};\n\nconst mapStateToProps = (state) => ({\n authToken: state.login.auth && state.login.auth.auth.accessToken,\n checkout: state.checkout.shipping,\n});\n\nexport default connect(mapStateToProps)(ShippingOptions);\n","import React, { useEffect, useState } from 'react';\nimport { Form } from 'react-bootstrap';\nimport { connect } from 'react-redux';\nimport SalesTax from 'sales-tax';\nimport CountryDropdown from '../CountryDropdown';\nimport StateDropdown from '../StateDropdown';\nimport ShippingMethods from './ShippingMethods';\nimport { useSearchDebounce } from './ShippingInfo';\n\nconst ShippingInfoForm = ({\n values,\n onChange,\n handleChange,\n setShippingValues,\n setValues,\n handleBlur,\n errors,\n touched,\n shipping,\n updateSalesTax,\n cart,\n setFieldValue,\n shippoId,\n setShippoId,\n setShippingRate,\n setShippoMethod,\n setShippoToken,\n setShippoCarrier,\n setShippoEstimatedDelivery,\n cartItems,\n phone,\n shippingRates,\n rateFetched,\n setFetchRates,\n setRates,\n profile,\n type,\n shipTo,\n}) => {\n const [addressChange, setAddressChange] = useState(false);\n const [countryChange, setCountryChange] = useState(false);\n const [shippingAddresses, setShippingAddress] = useState({\n address: null,\n city: null,\n zipcode: null,\n state: null,\n country: null,\n });\n\n const isValid = (fieldName) => {\n return !errors[fieldName] && touched[fieldName];\n };\n const isInvalid = (fieldName) => {\n return errors[fieldName] && touched[fieldName];\n };\n\n const addressInput = useSearchDebounce(shippingAddresses.address, 500);\n const cityInput = useSearchDebounce(shippingAddresses.city, 500);\n\n useEffect(() => {\n setShippingAddress({\n ...shippingAddresses,\n address: addressInput,\n });\n setShippingValues({ ...values, address: addressInput });\n }, [addressInput]);\n useEffect(() => {\n setShippingAddress({\n ...shippingAddresses,\n city: cityInput,\n });\n setShippingValues({ ...values, city: cityInput });\n setTimeout(() => {\n setAddressChange(true);\n }, [2800]);\n }, [cityInput]);\n \n\n useEffect(() => {\n if (Object.keys(shipping).length === 0) {\n setValues({\n firstName: profile.firstName,\n lastName: profile.lastName,\n email: profile.email,\n country: profile.address.country,\n state: profile.address.state,\n address: `${profile.address.address1} ${profile.address.address2 ? `,${profile.address.address2}` : ''\n }`,\n city: profile.address.city,\n zipcode: profile.address.zipcode,\n phone: profile.phone,\n });\n } else {\n setValues({ ...values, ...shipping });\n }\n }, [shipping]);\n\n useEffect(() => {\n setShippingValues(values);\n setShippingAddress({\n address: values.address,\n city: values.city,\n zipcode: values.zipcode,\n state: values.state,\n country: values.country,\n });\n }, [values]);\n\n const shippingAddress =\n profile.address.address1 + ', ' + profile.address.address2;\n\n useEffect(() => {\n if (shipTo === 'shipToMe') {\n onChange('firstName', profile.firstName);\n onChange('lastName', profile.lastName);\n onChange('email', profile.email);\n onChange('country', profile.address.country);\n onChange('address', shippingAddress);\n onChange('city', profile.address.city);\n onChange('state', profile.address.state);\n onChange('zipcode', profile.address.zipcode);\n onChange('phone', profile.phone);\n } else {\n onChange('billing_firstName', profile.firstName);\n onChange('billing_lastName', profile.lastName);\n onChange('billing_email', profile.email);\n onChange('billing_country', profile.address.country);\n onChange('billing_address', shippingAddress);\n onChange('billing_city', profile.address.city);\n onChange('billing_state', profile.address.state);\n onChange('billing_zipcode', profile.address.zipcode);\n onChange('billing_phone', profile.phone);\n onChange('firstName', '');\n onChange('lastName', '');\n onChange('email', '');\n onChange('country', undefined);\n onChange('address', '');\n onChange('city', '');\n onChange('state', undefined);\n onChange('zipcode', '');\n onChange('phone', '');\n }\n }, [shipTo]);\n const st = {\n height: '2.3rem',\n };\n\n return (\n \n );\n};\n\nconst mapStateToProps = (state) => ({\n shipping: state.checkout.shipping,\n profile: state.login.auth.profile,\n});\n\nexport default connect(mapStateToProps)(ShippingInfoForm);\n","import React, { useEffect, useState } from 'react';\nimport { connect } from 'react-redux';\n\nimport ShippingInfoForm from './ShippingInfoForm';\n\nexport const ConvertProfileToIntial = (profile) => {\n if (!profile) {\n return {\n state: 'AL',\n };\n }\n if (!profile.address) {\n return {\n state: 'AL',\n };\n }\n return {\n name: profile.name,\n email: profile.email,\n street: `${profile.address.street1} #${profile.address.street2}`,\n city: profile.address.city,\n zipcode: profile.address.zipcode,\n state: profile.address.state,\n country: profile.address.country,\n phone: profile.phone,\n };\n};\n\nexport function useSearchDebounce(value, milliSeconds) {\n const [debouncedValue, setDebouncedValue] = useState(value);\n\n useEffect(() => {\n const handler = setTimeout(() => {\n setDebouncedValue(value);\n }, milliSeconds);\n\n return () => {\n clearTimeout(handler);\n };\n }, [value, milliSeconds]);\n\n return debouncedValue;\n}\n\nconst ShippingInfo = ({\n onChange,\n shippingInfo,\n setIsValid,\n shipping,\n setValues,\n profile,\n touched,\n errors,\n values,\n setFieldValue,\n handleChange,\n handleBlur,\n cart,\n updateSalesTax,\n setShippingValues,\n setShippingRate,\n setShippoMethod,\n shippingRatePrice,\n shippoId,\n setShippoId,\n phone,\n shippingRates,\n rateFetched,\n setFetchRates,\n setRates,\n setShippoToken,\n setShippoCarrier,\n setShippoEstimatedDelivery,\n shipTo,\n setShipTo,\n ...props\n}) => {\n return (\n <>\n \n setShipTo('shipToMe')}\n >\n Ship To Me\n \n setShipTo('shipToCustomer')}\n >\n Ship To Customer\n \n
\n {shipTo === 'shipToMe' ? (\n \n \n Billing Address\n \n
\n \n \n Shipping Address\n \n
\n \n )}\n \n );\n};\n\nconst mapStateToProps = (state) => ({\n shipping: state.checkout.shipping,\n profile: state.login.auth.profile,\n});\n\nexport default connect(mapStateToProps)(ShippingInfo);\n","import React, { useEffect, useRef, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport {\n brandForgeTextComplete,\n getCurrentMonthUserBrandForgeMessages,\n} from '../utils/api';\nimport {\n clickHandler,\n errMessageBrandforge,\n formatDate,\n} from '../utils/helpers';\nimport CustomTooltip from './CustomTooltip';\nimport Prompts from './Prompts';\n\nexport const useAutosizeTextArea = (textAreaRef, value) => {\n useEffect(() => {\n if (textAreaRef) {\n textAreaRef.style.height = '36px';\n const scrollHeight = textAreaRef.scrollHeight;\n textAreaRef.style.height = scrollHeight + 'px';\n }\n }, [textAreaRef, value]);\n};\n\nexport const PopUpChat = (props) => {\n const [chatopen, setChatopen] = useState(false);\n const [msg, setMsg] = useState(null);\n const [messages, setMessages] = useState([\n {\n id: 0,\n ai_text: `Hi there, I am BRANDFORGE™, Gildform's AI-powered assistant designed to help you build and grow your brand from concept to production and beyond.\\nHow can I help?`,\n user_text: null,\n },\n ]);\n const [msgLoader, setMsgLoader] = useState(false);\n const [errMsg, setErrMsg] = useState(false);\n const [msgsLength, setMsgsLength] = useState(0);\n const [openPrompts, setOpenPrompts] = useState(false);\n\n const chatBoxRef = useRef(null);\n const textAreaRef = useRef(null);\n\n useAutosizeTextArea(textAreaRef.current, msg);\n\n const profile = useSelector(\n (state) => state.login.auth && state.login.auth.profile\n );\n\n const isAuthenticated = useSelector(\n (state) => state.login && state.login.isAuthenticated\n );\n\n const toggle = () => {\n setChatopen(!chatopen);\n };\n\n const handleSend = async () => {\n setOpenPrompts(false);\n setMsg(null);\n let messageErr = {\n user_text: null,\n name: `${profile.firstName} ${profile.lastName}`,\n userId: profile.sub,\n error: true,\n };\n messages.push({\n ai_text: null,\n user_text: msg,\n name: `${profile.firstName} ${profile.lastName}`,\n userId: profile.sub,\n createdAt: formatDate(new Date(), true),\n });\n setMsgLoader(true);\n const data = {\n text: msg ? msg : '',\n userId: profile.sub,\n name: `${profile.firstName} ${profile.lastName}`,\n };\n const res = await brandForgeTextComplete(data);\n if (res.status === 200) {\n const dd = await res.json();\n setMsgsLength(msgsLength + 1);\n messages.pop();\n if (dd.brandForge) {\n setMessages([...messages, dd.brandForge]);\n }\n if (profile.membership.name === 'Standard') {\n if (messages.length + 1 >= 10) {\n setErrMsg(true);\n setMessages((prevState) => [\n ...prevState,\n {\n ...messageErr,\n ai_text: `\n \n \n
\n ) : null;\n};\n\nexport default PopUpChat;\n","import React, { useEffect, useState } from 'react';\nimport { getGildformStatuses } from '../utils/api';\n\nfunction Prompts(props) {\n const [selectedPrompt, setSelectedPompt] = useState(null);\n const [prompts, setPrompts] = useState([]);\n\n const getPrompts = async () => {\n const res = await getGildformStatuses(13);\n setPrompts(res.settings ? res.settings : []);\n };\n\n useEffect(() => {\n if (props.openPrompts && prompts.length === 0) {\n getPrompts();\n }\n }, [props.openPrompts]);\n\n return (\n \n
\n \n BrandForge Chat\n \n \n \n
\n \n {messages.map((msg, i) => (\n
\n \n {msg.user_text && (\n
\n ))}\n {msgLoader && (\n \n
\n )}\n {msg.ai_text && (\n {msg.user_text}
\n {msg.createdAt && (\n\n {formatDate(new Date(msg.createdAt), true)}\n
\n )}\n \n {msg.error ? (\n clickHandler(e, props.openMemberModal)}\n />\n ) : (\n
\n )}\n {msg.ai_text}
\n )}\n\n \n \n \n
\n )}\n \n
\n \n setMsg(e.target.value)}\n placeholder='Ask BrandForge...'\n ref={textAreaRef}\n rows={1}\n value={msg ? msg : ''}\n disabled={msgLoader || errMsg || disableSend}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n if (msg && !errMsg && !disableSend) {\n handleSend();\n }\n }\n }}\n />\n \n \n \n
\n \n By using BrandForge™, you agree to our full disclaimer regarding the\n accuracy, applicability, and limitations of the AI assistant's\n advice, which can be found{' '}\n \n here\n \n .\n
\n \n
\n \n BrandForge\n 
\n
\n {\n props.setOpenPrompts(!props.openPrompts);\n if (!props.openPrompts) {\n setSelectedPompt(null);\n }\n }}\n >\n {props.openPrompts ? 'Hide prompts' : 'Show prompts'}\n
\n \n {props.openPrompts ? (\n \n ) : (\n \n )}\n
\n \n
\n \n \n );\n}\n\nexport default Prompts;\n","import React, { useState } from 'react';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport { Container, Row } from 'react-bootstrap';\nimport { Link } from '@reach/router';\nimport gildformLogoBlack from '../images/gildformlogo-black.png';\nimport gildformLogo from '../images/logo.png';\nimport { isToggleOpen, setOpenToggle } from '../utils/helpers';\nimport WindoWidth from './WindowWidth';\n\nconst ActualLink = ({\n internal_link,\n link_text,\n external_link,\n link_column,\n idz,\n}) => {\n if (internal_link) {\n const linkParts = internal_link.split('/');\n const pageSlug = linkParts[linkParts.length - 1];\n const pageCategory = linkParts[linkParts.length - 2];\n if (pageCategory === 'designer') {\n return (\n \n {link_text}\n \n );\n }\n\n return (\n \n {link_text}\n \n );\n }\n\n return (\n \n {link_column.title === 'Social Media' && (\n \n {prompts\n .filter((it) => it.code === '1')\n .map((prompt, index) => (\n {\n setSelectedPompt(prompt);\n props.setMsg(prompt.value);\n }}\n >\n {prompt.value}\n
\n ))}\n \n
\n \n 
\n 
\n
\n \n
\n \n {rebrandFooterData.acf.link_columns_rebrand.map((item, index) => {\n return (\n
\n );\n })}\n \n \n 992 ? '' : `#${item.title.split(' ')[0]}`\n }\n role='button'\n aria-expanded='false'\n aria-controls='link1'\n onClick={() => {\n setOpenToggle(\n { id: index, toggle: !toggle.toggle },\n testToggle,\n setTestToggle\n );\n }}\n >\n {item.title}\n {isToggleOpen(index, testToggle) ? (\n \n ) : (\n \n )}\n
\n \n
\n \n {item.links.map((link) => (\n
\n \n
\n Copyright © {new Date().getFullYear()} Gildform\n
\n \n
\n ) : (\n \n )}\n \n {selectedProduct\n ? `${selectedProduct.name} ${item.material.name}`\n : item.itemType.name}\n
\n \n{item.description}
\n- \n {cart.items.map((item, ndx) => (\n
\n \n
\n );\n }}\n />\n );\n};\n\nconst mapStateToProps = (state) => ({\n creditOrder: state.checkout.creditOrder ? state.checkout.creditOrder : null,\n token: state.login.auth && state.login.auth.auth.accessToken,\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n setPaymentMethod: (data) => dispatch(setPaymentMethod(data)),\n setCreditOrder: (data) => dispatch(setCreditOrder(data)),\n});\n\nexport default connect(mapStateToProps, mapDispatchToProps)(ShoppingCartStep);\n","import React, { useEffect, useState } from 'react';\nimport { Link, navigate } from 'gatsby';\nimport { Row, Col, Button } from 'react-bootstrap';\nimport { connect } from 'react-redux';\nimport { toast } from 'react-toastify';\n// import ck from 'creditkey-js';\n\nimport Cart from './CartContainer';\nimport CheckoutInfo from '../../utils/schemas/shippingSchema';\nimport ShoppingCartStep from './ShoppingCartStep';\nimport Payment from '../creditcard/CreditCardModal';\nimport Modal from '../../components/Modal';\nimport ShippingInfo, { ConvertProfileToIntial } from './ShippingInfo';\nimport {\n updateShippingInfo,\n shouldHideCart,\n shouldShowCart,\n setPaymentMethod,\n setCreditOrder,\n charging,\n charged,\n} from '../../state/checkout/actions';\nimport {\n clearCart,\n setTax,\n setShippingOption,\n showOfferCart as showOfferCartAction,\n hideOfferCart as hideOfferCartAction,\n setOrderCheckoutSuccessful as setOrderCheckoutSuccessfulAction,\n setOffersPurchased as setOffersPurchasedAction,\n setInitialOffers as setInitialOffersAction,\n} from '../../state/shoppingCart/actions';\nimport // addProductToCart as addProductToCartAction,\n '../../state/shoppingCart/thunks';\nimport { checkout } from '../../state/checkout/thunks';\n\nimport 'react-toastify/dist/ReactToastify.css';\nimport { addNewCard, updateBilling } from '../../state/login/thunks';\nimport CreditKey from '../creditcard/creditKey';\nimport {\n isProductChosen,\n openCreditCardCheckout,\n} from '../../state/create/jewelry/actions';\nimport {\n checkoutCart,\n checkoutOfferCart,\n getPromotionCodes,\n getShippmentRates,\n getUserOffers,\n uploadLaserEngravingImages,\n} from '../../utils/api';\nimport { isEmptyObj, assemblySubPrice } from '../../utils/helpers';\nimport noImage from '../../images/noimage.jpg';\n\nconst CREDIT_KEY = process.env.GATSBY_CREDIT_KEY;\nconst CREDIT_TOKEN = process.env.GATSBY_CREDIT_SECRET;\nconst CREDIT_KEY_URL = process.env.GATSBY_CREDIT_KEY_API_URL;\n\nconst FullCheckout = (props) => {\n const [stripe, setStripe] = useState(null);\n const [step, setStepState] = useState(0);\n const [payment, setPaymentOption] = useState('Default');\n const [shippingValues, setShippingValues] = useState(null);\n const [shipTo, setShipTo] = useState('shipToMe');\n\n const [isCardModalOpen, openCardModal] = useState(false);\n const [cardInfoLoad, setCardInfoLoad] = useState(false);\n const [cardErrors, setCardErrors] = useState(undefined);\n const [defaultCard, setDefaultCard] = useState(false);\n const [shippingRatePrice, setShippingRate] = useState(null);\n const [rateFetched, setFetchRates] = useState(1);\n\n const [shippoMethod, setShippoMethod] = useState(null);\n const [shippoId, setShippoId] = useState(null);\n const [shippoServiceToken, setShippoToken] = useState(null);\n const [shippoCarrier, setShippoCarrier] = useState(null);\n const [shippoEstimatedDelivery, setShippoEstimatedDelivery] = useState(null);\n\n const [shippingRates, setRates] = useState(null);\n\n const [promoCodes, setPromoCodes] = useState([]);\n const [promoCode, setPromoCode] = useState(null);\n\n const [offers, setOffers] = useState([]);\n const [timers, setTimers] = useState({});\n const [isTimeLimitReached, setTimeLimitReached] = useState({});\n const [isSubmittingOfferPayment, setIsSubmittingOfferPayment] = useState({\n id: null,\n isSubmitting: false,\n });\n\n const paymentOptions = ['Default', 'Credit-Key'];\n\n const [shouldShowCart, setState] = [\n props.shouldShowCart,\n (newState) => {\n if (newState === false) {\n return props.hideCart();\n }\n return props.showCart();\n },\n ];\n\n function matchPromoCode(givenCode, codes) {\n console.log('givenCode.trim() :>> ', givenCode.trim());\n console.log('codes :>> ', codes);\n return codes.find((cd) => cd.code.trim() == givenCode.trim());\n }\n\n const fetchPromoCodes = async () => {\n const res = await getPromotionCodes();\n setPromoCodes(res.data);\n };\n\n const fetchCustomerOffers = async () => {\n const res = await getUserOffers(15);\n if (res) {\n const filteredOffers = res.settings.filter((offer) => {\n const customers = offer.customers ? JSON.parse(offer.customers) : [];\n const memberships = offer.membership\n ? JSON.parse(offer.membership)\n : [];\n\n if (offer.customers || offer.membership) {\n const isApplicableToCustomer =\n customers.length > 0\n ? customers.find(\n (customer) =>\n customer.id === (props.profile && props.profile.erp_id)\n )\n : false;\n\n const isApplicableToMembership =\n memberships.length > 0\n ? memberships.find(\n (membership) =>\n membership.name ===\n (props.profile && props.profile.membership.name)\n )\n : false;\n\n return isApplicableToCustomer || isApplicableToMembership;\n } else {\n return true;\n }\n });\n\n const newArr = filteredOffers.map((item) => {\n return {\n id: item.id,\n name: item.name,\n description: item.description,\n membership: item.membership,\n image: item.type,\n price: item.value,\n stripe_payment_id: item.extra_info,\n time_limit: Number(item.code) * 60,\n customers: item.customers,\n createdAt: item.createdAt,\n updatedAt: item.updatedAt,\n };\n });\n\n const newTimers = {};\n newArr.forEach((offer) => {\n newTimers[offer.id] = Number(offer.time_limit);\n });\n setTimers(newTimers);\n props.setInitialOffers(newArr);\n setOffers(newArr);\n }\n };\n\n useEffect(() => {\n if (Number(step) === 2) {\n fetchCustomerOffers();\n }\n return () => {\n Object.values(timers).forEach((timer) => clearInterval(timer));\n };\n }, [props.orderCheckoutSuccessful, step]);\n\n useEffect(() => {\n if (Number(step) === 3) {\n Object.keys(timers).forEach((offerId) => {\n if (Number(timers[offerId]) === 0 && !isTimeLimitReached[offerId]) {\n setTimeLimitReached((prevIsTimeLimitReached) => ({\n ...prevIsTimeLimitReached,\n [offerId]: true,\n }));\n }\n });\n }\n }, [timers, step]);\n\n useEffect(() => {\n if (!isEmptyObj(timers) && props.shouldShowOfferCart) {\n const timer = setInterval(() => {\n setTimers((prevTimers) => {\n const updatedTimers = { ...prevTimers };\n Object.keys(updatedTimers).forEach((offerId) => {\n updatedTimers[offerId] = Math.max(updatedTimers[offerId] - 1, 0);\n });\n return updatedTimers;\n });\n }, 1000);\n\n if (Object.values(timers).every((val) => Number(val) === 0)) {\n clearInterval(timer);\n return;\n }\n\n return () => {\n clearInterval(timer);\n };\n }\n });\n\n useEffect(() => {\n if (promoCodes.length === 0 && Number(step) === 1) {\n fetchPromoCodes();\n }\n }, [step]);\n\n useEffect(() => {\n if (props.checkout && Number(step) === 1) {\n if (props.checkout.isCharging) {\n props.setCharged();\n }\n }\n }, [props.checkout, step]);\n\n const matchedCode =\n promoCode &&\n matchPromoCode(\n promoCode,\n promoCodes.filter((cd) => cd.coupon.name.includes('Production'))\n );\n\n const collectCardInfo = async () => {\n setCardInfoLoad(true);\n setCardErrors(undefined);\n const stripeResponse = await stripe.stripe.createToken(stripe.card);\n if (stripeResponse.error) {\n setCardErrors(stripeResponse.error);\n return;\n }\n const tok = stripeResponse.token.id;\n await props.updateBilling(\n props.profile.subUser ? props.profile.admin_id : props.profile.id,\n tok\n );\n setCardInfoLoad(false);\n openCardModal(false);\n props.setOpenCreditCard(false);\n };\n\n const PaymentDetailsCard = (payment) => {\n switch (payment) {\n case 'Default':\n return props.profile && props.profile.cardInfo ? (\n {cardErrors.message}
}\n \n\n Please enter your credit card information!\n
\n \n {\n openCardModal(true);\n props.setOpenCreditCard(true);\n }}\n >\n Enter Credit Card info\n \n
\n \n );\n // case 'Credit-Key':\n // return (\n // \n
\n );\n }\n return Steps[step];\n };\n\n const showOrHideOfferCart = (showCart) => {\n if (showCart) {\n props.showOfferCart();\n } else {\n props.hideOfferCart();\n props.clearCart();\n props.setOrderCheckoutSuccessful(false);\n setDefaultCard(false);\n // setOfferCartStep(1);\n }\n };\n\n const showOfferCart = () => {\n const buttonDisableTitleAndClassName = (item) => {\n const itemPurchased =\n props.purchasedOffers &&\n props.purchasedOffers.length > 0 &&\n props.purchasedOffers.find((prod) => prod.id === item.id);\n if (\n isSubmittingOfferPayment.id === item.id &&\n isSubmittingOfferPayment.isSubmitting\n ) {\n return {\n className: 'checkout',\n disabled: true,\n title: ,\n };\n } else {\n if (itemPurchased) {\n return { className: 'checkout', disabled: true, title: 'Added' };\n } else {\n return {\n className: 'checkout add-prod',\n disabled: false,\n title: '+ Add',\n };\n }\n }\n };\n\n return (\n step === 3 && (\n \n \n
\n |
\n \n
\n \n {\n if (props.checkout) {\n if (props.checkout.isCharging) {\n props.setCharged();\n }\n }\n props.hideCart();\n }}\n >\n Get Started\n \n \n
\n
\n Looks like there is nothing in your cart
\n \nUpload an STL file below to start creating your piece
\n \n\n {/* {offerCartStep === 1 ? ( */}\n <>\n
\n \n \n
\n |
\n \n {props.initialOffers.map((prod, index) => (\n \n
\n Check out some of our offers
\n \n\n {isTimeLimitReached[prod.id] ? (\n \n Offer Expired\n \n ) : (\n \n Expires in: {Math.floor(timers[prod.id] / 60)}:\n {(timers[prod.id] % 60).toString().padStart(2, '0')}\n \n )}\n
\n \n \n {prod.description}\n
\n \n {prod.image ? (\n \n 
\n )}\n
\n \n \n {prod.name}\n
\n \n \n {`$${prod.price}`}\n
\n \n {\n submitOfferProductPayment(prod);\n }}\n >\n {buttonDisableTitleAndClassName(prod).title}\n \n
\n \n ))}\n \n \n\n \n {\n props.hideOfferCart();\n props.setOrderCheckoutSuccessful(false);\n props.setInitialOffers([]);\n navigate('/order-confirmation/thankyou');\n }}\n >\n No, I don't want these offers\n \n
\n \n \n )\n );\n };\n\n const showCartCondition = shouldShowCart || props.shouldShowOfferCart;\n\n return (\n \n
\n {wpData && wpData.length > 0 && (\n \n Content loading \n
\n ) : (\n <>\n {wpData && wpData.length > 0 ? (\n <>\n {wpData.map((wp, idx) => {\n return (\n \n ‣ There are{' '}\n {wpData && wpData.length} new updates you should check out!\n
\n )}\n {wpLoading ? (\n \n <>\n
\n );\n })}\n \n ) : (\n \n \n 🎉\n \n {wp.acf && wp.acf.feature_title}\n
\n \n 
\n
\n \n {wp.acf && wp.acf.feature_description\n ? removeTags(wp.acf.feature_description)\n : ''}\n
\n \n No updates!
\n )}\n \n )}\n \n \n );\n};\n\nexport default WhatsNew;\n","import React, { useEffect, useState } from 'react';\nimport { Link } from 'gatsby';\nimport PropTypes from 'prop-types';\nimport { connect } from 'react-redux';\nimport { useStaticQuery, graphql } from 'gatsby';\n\nimport CartDisplay from './cart';\nimport Login from './header/Login';\nimport Profile from './header/Profile';\nimport Signup from './header/Signup';\nimport WhatsNew from './WhatsNew';\nimport newFeature from '../images/new_feat.png';\n\nconst getNavInfo = (data) => {\n if (data.allWordpressWpApiMenusMenusItems.edges.length <= 0) {\n return [];\n }\n return data.allWordpressWpApiMenusMenusItems.edges[0].node.items;\n};\n\nconst renderNavLink = (component) => {\n if (component.type === 'custom') {\n return (\n \n {component.title}\n \n );\n }\n return (\n \n {component.title}\n \n );\n};\n\nconst Header = ({\n light_header,\n backgroundImage,\n sit_on_top,\n onboarding,\n noAnswers,\n siteTitle,\n}) => {\n const data = useStaticQuery(graphql`\n query {\n allWordpressWpApiMenusMenusItems(filter: { slug: { eq: \"nav-bar\" } }) {\n edges {\n node {\n slug\n name\n items {\n title\n url\n object_slug\n type\n }\n }\n }\n }\n }\n `);\n\n // const headerData = [\n // {\n // object_slug: 'learn',\n // title: 'Learn',\n // type: 'custom',\n // url: 'https://academy.gildform.com',\n // },\n // {\n // object_slug: 'our-story',\n // title: 'Our Story',\n // type: 'post_type',\n // url: 'https://content.gildform.com/archives/marketing_page/our-story',\n // },\n // {\n // object_slug: 'why-gildform',\n // title: 'Why Gildform',\n // type: 'custom',\n // url: '#',\n // },\n // {\n // object_slug: 'blog',\n // title: 'Blog',\n // type: 'custom',\n // url: 'http://blog.gildform.com',\n // },\n // {\n // object_slug: 'help-center',\n // title: 'Help Center',\n // type: 'custom',\n // url: 'https://support.gildform.com/',\n // },\n // ];\n\n const [width, setWidth] = useState();\n useEffect(() => {\n if (window) {\n setWidth(window.innerWidth);\n }\n }, []);\n\n const isPhoneScreen = width < 768;\n const isTabletScreen = width > 768 && width < 992;\n const navbarType = light_header ? 'navbar-dark' : 'navbar-light';\n const hasBackgroundImg = backgroundImage ? 'bg-nav' : '';\n const sitOnTop = sit_on_top ? 'sit-on-top' : '';\n const navbarclass = `navbar navbar-expand-lg ${navbarType} ${hasBackgroundImg} ${sitOnTop}`;\n const logo = light_header ? '/images/logo_white.png' : '/images/logo.svg';\n const logoClass = light_header ? 'navbar-brand light' : 'navbar-brand';\n const backgroundImageUrl = `url(${backgroundImage})`;\n const styleHeader = () => {\n if (onboarding) {\n return { backgroundColor: 'rgba(124, 98, 98, .97)', zIndex: 4 };\n } else if (noAnswers) {\n if (isPhoneScreen) {\n return { zIndex: 4, top: '60px' };\n } else if (isTabletScreen) {\n return { zIndex: 4, top: '38px' };\n } else {\n return { zIndex: 4, top: '30px' };\n }\n } else {\n return { zIndex: 4 };\n }\n };\n\n const [openNewFeat, setOpenNewFeature] = useState(false);\n const [newFeats, setNewFeats] = useState(null);\n\n return (\n \n {\n setTimeout(() => {\n setOpenNewFeature(true);\n }, 400);\n }}\n className='new-feat-icon'\n >\n {newFeats && (\n \n {newFeats}\n \n )}\n \n 
\n \n
\n \n
\n );\n};\n\nexport default Banner;\n","module.exports = \"data:image/png;base64,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\"","import React from 'react';\nvar TabContext = React.createContext(null);\nexport default TabContext;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport React from 'react';\nimport uncontrollable from 'uncontrollable';\nimport TabContext from './TabContext';\nimport SelectableContext from './SelectableContext';\n\nvar TabContainer =\n/*#__PURE__*/\nfunction (_React$Component) {\n _inheritsLoose(TabContainer, _React$Component);\n\n function TabContainer() {\n var _this;\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;\n\n _this.getControlledId = function (key) {\n return _this.getKey(key, 'tabpane');\n };\n\n _this.getControllerId = function (key) {\n return _this.getKey(key, 'tab');\n };\n\n _this.state = {\n tabContext: {\n onSelect: _this.props.onSelect,\n activeKey: _this.props.activeKey,\n transition: _this.props.transition,\n mountOnEnter: _this.props.mountOnEnter,\n unmountOnExit: _this.props.unmountOnExit,\n getControlledId: _this.getControlledId,\n getControllerId: _this.getControllerId\n }\n };\n return _this;\n }\n\n TabContainer.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var activeKey = _ref.activeKey,\n mountOnEnter = _ref.mountOnEnter,\n unmountOnExit = _ref.unmountOnExit,\n transition = _ref.transition;\n return {\n tabContext: _extends({}, prevState.tabContext, {\n activeKey: activeKey,\n mountOnEnter: mountOnEnter,\n unmountOnExit: unmountOnExit,\n transition: transition\n })\n };\n };\n\n var _proto = TabContainer.prototype;\n\n _proto.getKey = function getKey(key, type) {\n var _this$props = this.props,\n generateChildId = _this$props.generateChildId,\n id = _this$props.id;\n if (generateChildId) return generateChildId(key, type);\n return id ? id + \"-\" + type + \"-\" + key : null;\n };\n\n _proto.render = function render() {\n var _this$props2 = this.props,\n children = _this$props2.children,\n onSelect = _this$props2.onSelect;\n return React.createElement(TabContext.Provider, {\n value: this.state.tabContext\n }, React.createElement(SelectableContext.Provider, {\n value: onSelect\n }, children));\n };\n\n return TabContainer;\n}(React.Component);\n\nexport default uncontrollable(TabContainer, {\n activeKey: 'onSelect'\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport classNames from 'classnames';\nimport React from 'react';\nimport { createBootstrapComponent } from './ThemeProvider';\n\nvar TabContent =\n/*#__PURE__*/\nfunction (_React$Component) {\n _inheritsLoose(TabContent, _React$Component);\n\n function TabContent() {\n return _React$Component.apply(this, arguments) || this;\n }\n\n var _proto = TabContent.prototype;\n\n _proto.render = function render() {\n var _this$props = this.props,\n bsPrefix = _this$props.bsPrefix,\n Component = _this$props.as,\n className = _this$props.className,\n props = _objectWithoutPropertiesLoose(_this$props, [\"bsPrefix\", \"as\", \"className\"]);\n\n return React.createElement(Component, _extends({}, props, {\n className: classNames(className, bsPrefix)\n }));\n };\n\n return TabContent;\n}(React.Component);\n\nTabContent.defaultProps = {\n as: 'div'\n};\nexport default createBootstrapComponent(TabContent, 'tab-content');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport classNames from 'classnames';\nimport React, { useContext } from 'react';\nimport { useBootstrapPrefix } from './ThemeProvider';\nimport TabContext from './TabContext';\nimport SelectableContext, { makeEventKey } from './SelectableContext';\nimport Fade from './Fade';\n\nfunction useTabContext(props) {\n var context = useContext(TabContext);\n if (!context) return props;\n\n var activeKey = context.activeKey,\n getControlledId = context.getControlledId,\n getControllerId = context.getControllerId,\n rest = _objectWithoutPropertiesLoose(context, [\"activeKey\", \"getControlledId\", \"getControllerId\"]);\n\n var shouldTransition = props.transition !== false && rest.transition !== false;\n var key = makeEventKey(props.eventKey);\n return _extends({}, props, {\n active: props.active == null && key != null ? makeEventKey(activeKey) === key : props.active,\n id: getControlledId(props.eventKey),\n 'aria-labelledby': getControllerId(props.eventKey),\n transition: shouldTransition && (props.transition || rest.transition || Fade),\n mountOnEnter: props.mountOnEnter != null ? props.mountOnEnter : rest.mountOnEnter,\n unmountOnExit: props.unmountOnExit != null ? props.unmountOnExit : rest.unmountOnExit\n });\n}\n\nvar TabPane = React.forwardRef(function (props, ref) {\n var _useTabContext = useTabContext(props),\n bsPrefix = _useTabContext.bsPrefix,\n className = _useTabContext.className,\n active = _useTabContext.active,\n onEnter = _useTabContext.onEnter,\n onEntering = _useTabContext.onEntering,\n onEntered = _useTabContext.onEntered,\n onExit = _useTabContext.onExit,\n onExiting = _useTabContext.onExiting,\n onExited = _useTabContext.onExited,\n mountOnEnter = _useTabContext.mountOnEnter,\n unmountOnExit = _useTabContext.unmountOnExit,\n Transition = _useTabContext.transition,\n _useTabContext$as = _useTabContext.as,\n Component = _useTabContext$as === void 0 ? 'div' : _useTabContext$as,\n _ = _useTabContext.eventKey,\n rest = _objectWithoutPropertiesLoose(_useTabContext, [\"bsPrefix\", \"className\", \"active\", \"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"onExited\", \"mountOnEnter\", \"unmountOnExit\", \"transition\", \"as\", \"eventKey\"]);\n\n var prefix = useBootstrapPrefix(bsPrefix, 'tab-pane');\n if (!active && unmountOnExit) return null;\n var pane = React.createElement(Component, _extends({}, rest, {\n ref: ref,\n role: \"tabpanel\",\n \"aria-hidden\": !active,\n className: classNames(className, prefix, {\n active: active\n })\n }));\n if (Transition) pane = React.createElement(Transition, {\n in: active,\n onEnter: onEnter,\n onEntering: onEntering,\n onEntered: onEntered,\n onExit: onExit,\n onExiting: onExiting,\n onExited: onExited,\n mountOnEnter: mountOnEnter,\n unmountOnExit: mountOnEnter\n }, pane); // We provide an empty the TabContext so `\n
\n \n
\n Looks like you haven't completed your profile.
\n \n {' '}\n Click here to finish!\n \n