[Refactor] Remove <Tabs> and <Toggle> and move to Palette

package.json

@@ -7,7 +7,7 @@
   "author": "Art.sy Inc <it@artsymail.com>",
   "license": "MIT",
   "peerDependencies": {
-    "@artsy/palette": "^2.25.10",
+    "@artsy/palette": "^2.26.2",
     "dd-trace": "^0.6.0",
     "react": "^16.5.0",
     "react-dom": "^16.5.0",
@@ -51,7 +51,7 @@
     "react-relay": "https://github.com/alloy/relay/releases/download/v1.5.0-artsy.3/react-relay-1.5.0-artsy.3.tgz"
   },
   "devDependencies": {
-    "@artsy/palette": "2.25.12",
+    "@artsy/palette": "2.26.2",
     "@babel/cli": "^7.0.0",
     "@babel/core": "^7.0.0",
     "@babel/plugin-proposal-class-properties": "^7.0.0",

src/Apps/Artist/Routes/Overview/Components/ArtworkFilter/index.tsx

@@ -1,9 +1,8 @@
-import { FilterIcon } from "@artsy/palette"
+import { FilterIcon, Toggle } from "@artsy/palette"
 import { ArtworkFilter_artist } from "__generated__/ArtworkFilter_artist.graphql"
 import { FilterState } from "Apps/Artist/Routes/Overview/state"
 import { ContextConsumer } from "Artsy/SystemContext"
 import { FollowArtistButtonFragmentContainer as FollowArtistButton } from "Components/FollowButton/FollowArtistButton"
-import { Toggle } from "Components/v2"
 import React, { Component } from "react"
 import { createFragmentContainer, graphql } from "react-relay"
 import { data as sd } from "sharify"

src/Apps/Artwork/Components/ArtworkDetails/index.tsx

@@ -1,7 +1,6 @@
-import { Box } from "@artsy/palette"
+import { Box, Tab, Tabs } from "@artsy/palette"
 import { renderWithLoadProgress } from "Artsy/Relay/renderWithLoadProgress"
 import { ContextConsumer } from "Artsy/Router"
-import { Tab, Tabs } from "Components/v2"
 import React, { Component } from "react"
 import { createFragmentContainer, graphql, QueryRenderer } from "react-relay"
 import styled from "styled-components"

src/Apps/Artwork/Components/OtherWorks/ArtworkContexts/ArtworkGrids/RelatedWorksArtworkGrid.tsx

@@ -1,4 +1,4 @@
-import { Spinner } from "@artsy/palette"
+import { Spinner, Tab, Tabs } from "@artsy/palette"
 import { RelatedWorksArtworkGrid_artwork } from "__generated__/RelatedWorksArtworkGrid_artwork.graphql"
 import { RelatedWorksArtworkGridQuery } from "__generated__/RelatedWorksArtworkGridQuery.graphql"
 import { hideGrid } from "Apps/Artwork/Components/OtherWorks/ArtworkContexts/ArtworkGrids"
@@ -9,7 +9,6 @@ import * as Schema from "Artsy/Analytics/Schema"
 import { renderWithLoadProgress } from "Artsy/Relay/renderWithLoadProgress"
 import { Mediator, withContext } from "Artsy/SystemContext"
 import ArtworkGrid from "Components/ArtworkGrid"
-import { Tab, Tabs } from "Components/v2"
 import { take } from "lodash"
 import React from "react"
 import styled from "styled-components"

src/Apps/Collect/Components/Filters/FilterContainer.tsx

@@ -10,8 +10,7 @@ import { SortFilter } from "./SortFilter"
 import { TimePeriodFilter } from "./TimePeriodFilter"
 import { WaysToBuyFilter } from "./WaysToBuyFilter"
 
-import { Box, Flex, Separator, Spacer } from "@artsy/palette"
-import { Toggle } from "Components/v2"
+import { Box, Flex, Separator, Spacer, Toggle } from "@artsy/palette"
 import { Media } from "Utils/Responsive"
 
 export interface FilterContainerProps {

src/Apps/Comparables/Filter.tsx

@@ -1,4 +1,4 @@
-import { Box, Flex, Spacer } from "@artsy/palette"
+import { Box, Flex, Spacer, Toggle } from "@artsy/palette"
 import { Filter_viewer } from "__generated__/Filter_viewer.graphql"
 import { CollectRefetchContainer } from "Apps/Collect/Components/Base/CollectRefetch"
 import { PriceRangeFilter as PriceRange } from "Apps/Collect/Components/Filters/PriceRangeFilter"
@@ -7,7 +7,6 @@ import { AttributionClassFilter } from "Apps/Comparables/Filter/AttributionClass
 import { MediumFilter } from "Apps/Comparables/Filter/MediumFilter"
 import { ContextProps } from "Artsy"
 import { SystemProps } from "Artsy/SystemContext"
-import { Toggle } from "Components/v2/Toggle"
 import React, { Component } from "react"
 import { createFragmentContainer, graphql } from "react-relay"
 import { Subscribe } from "unstated"

src/Apps/Order/Routes/__tests__/Payment.test.tsx

@@ -1,4 +1,9 @@
-import { Button, Checkbox, CheckboxProps } from "@artsy/palette"
+import {
+  ActiveTabContainer,
+  Button,
+  Checkbox,
+  CheckboxProps,
+} from "@artsy/palette"
 import { mount } from "enzyme"
 import React from "react"
 
@@ -13,7 +18,7 @@ import {
   fillIn,
   validAddress,
 } from "Apps/Order/Routes/__tests__/Utils/addressForm"
-import { ActiveTabContainer, CheckMarkWrapper, Stepper } from "Components/v2"
+import { CheckMarkWrapper, Stepper } from "Components/v2"
 import { Input } from "../../../../Components/Input"
 import {
   creatingCreditCardFailed,

src/Apps/Order/Routes/__tests__/Review.test.tsx

@@ -1,7 +1,7 @@
 import { mount } from "enzyme"
 import React from "react"
 
-import { Button } from "@artsy/palette"
+import { ActiveTabContainer, Button } from "@artsy/palette"
 import {
   BuyOrderWithShippingDetails,
   OfferOrderWithShippingDetails,
@@ -11,7 +11,7 @@ import { ShippingSummaryItemFragmentContainer } from "Apps/Order/Components/Ship
 import { ConnectedModalDialog } from "Apps/Order/Dialogs"
 import { trackPageView } from "Apps/Order/Utils/trackPageView"
 import { ModalButton, ModalDialog } from "Components/Modal/ModalDialog"
-import { ActiveTabContainer, CheckMarkWrapper, Stepper } from "Components/v2"
+import { CheckMarkWrapper, Stepper } from "Components/v2"
 import { StepSummaryItem } from "Components/v2/StepSummaryItem"
 import { MockBoot } from "DevTools"
 import { commitMutation } from "react-relay"

src/Apps/Order/Routes/__tests__/Shipping.test.tsx

@@ -2,7 +2,7 @@ import { mount } from "enzyme"
 import { cloneDeep } from "lodash"
 import React from "react"
 
-import { Button, RadioGroup } from "@artsy/palette"
+import { ActiveTabContainer, Button, RadioGroup } from "@artsy/palette"
 import {
   UntouchedBuyOrder,
   UntouchedOfferOrder,
@@ -17,12 +17,7 @@ import {
 import { trackPageView } from "Apps/Order/Utils/trackPageView"
 import Input, { InputProps } from "Components/Input"
 import { ModalButton, ModalDialog } from "Components/Modal/ModalDialog"
-import {
-  ActiveTabContainer,
-  CheckMarkWrapper,
-  CountrySelect,
-  Stepper,
-} from "Components/v2"
+import { CheckMarkWrapper, CountrySelect, Stepper } from "Components/v2"
 import { MockBoot } from "DevTools"
 import { commitMutation as _commitMutation, RelayProp } from "react-relay"
 import { flushPromiseQueue } from "Utils/flushPromiseQueue"

src/Components/v2/RouteTabs.tsx

@@ -1,12 +1,18 @@
-import { color, Sans, space } from "@artsy/palette"
+import {
+  color,
+  Sans,
+  sharedTabStyles,
+  space,
+  TabsContainer,
+} from "@artsy/palette"
 import { PreloadLink, PreloadLinkProps } from "Artsy/Router"
 import React from "react"
 import styled from "styled-components"
-import { styles, TabsContainer } from "./Tabs"
 
 export const RouteTabs = styled(TabsContainer)`
   a {
-    ${styles.tabContainer};
+    ${sharedTabStyles.tabContainer};
+
     :not(:last-child) {
       margin-right: ${space(3)}px;
     }
@@ -15,7 +21,7 @@ export const RouteTabs = styled(TabsContainer)`
 
     &.active {
       color: ${color("black100")};
-      ${styles.activeTabContainer};
+      ${sharedTabStyles.activeTabContainer};
     }
   }
 `

src/Components/v2/Stepper.tsx

@@ -1,7 +1,6 @@
-import { Tab, Tabs, TabsProps } from "Components/v2"
+import { sharedTabStyles, Tab, Tabs, TabsProps } from "@artsy/palette"
 import React from "react"
 import styled from "styled-components"
-import { styles } from "./Tabs"
 
 import {
   CheckIcon,
@@ -101,7 +100,7 @@ export const CheckMarkWrapper = styled.span`
 `
 
 const DisabledStepContainer = styled.div`
-  ${styles.tabContainer};
+  ${sharedTabStyles.tabContainer};
   cursor: default;
 `