@shopgate/engage/locations/components/StoreFinder/StoreFinderLocationHeader.js

Shopgate's ENGAGE library.

import React,{useContext,useCallback}from'react';import{Grid,ResponsiveContainer}from'@shopgate/engage/components';import{StoreContext}from"./Store.context";import{StoreFinderContext}from"../../locations.context";import{StoreDistance}from"../StoreList/StoreDistance";import{StoreHoursToday}from"../StoreList/StoreHoursToday";import{StoreAddress}from"../StoreList/StoreAddress";import StoreFinderLocationHeaderPhoneNumber from"./StoreFinderLocationHeaderPhoneNumber";import{container,storeName,storeDistance,storeHoursToday,clickable}from"./StoreFinderLocationHeader.style";/**
 * @returns {JSX}
 */var StoreFinderLocationHeader=function StoreFinderLocationHeader(){var store=useContext(StoreContext);var name=store.name,distance=store.distance,unitSystem=store.unitSystem,operationHours=store.operationHours,address=store.address;var _useContext=useContext(StoreFinderContext),changeLocation=_useContext.changeLocation;var handleClick=useCallback(function(){changeLocation(store);},[changeLocation,store]);return React.createElement("div",{className:container},React.createElement("div",{className:clickable,role:"button",tabIndex:"0",onClick:handleClick,onKeyDown:handleClick},React.createElement(Grid,null,React.createElement(Grid.Item,{grow:1,className:storeName},name),React.createElement(Grid.Item,{className:storeDistance},React.createElement(StoreDistance,{distance:distance,unitSystem:unitSystem}))),React.createElement(ResponsiveContainer,{breakpoint:">sm",webOnly:true},React.createElement("div",{className:storeHoursToday},React.createElement(StoreHoursToday,{hours:operationHours,longLabel:true})),React.createElement(StoreAddress,{address:address,pure:true})),React.createElement(ResponsiveContainer,{breakpoint:"<=sm",appAlways:true},React.createElement("div",{className:storeHoursToday},React.createElement(StoreHoursToday,{hours:operationHours})),React.createElement(StoreAddress,{address:address}))),React.createElement(ResponsiveContainer,{breakpoint:"<=sm",appAlways:true},React.createElement(StoreFinderLocationHeaderPhoneNumber,{phone:address.phoneNumber})));};export default StoreFinderLocationHeader;