diff --git a/packages/react-microlink/package.json b/packages/react-microlink/package.json
index 7f0917184..006b5343a 100644
--- a/packages/react-microlink/package.json
+++ b/packages/react-microlink/package.json
@@ -33,7 +33,6 @@
"previsualization"
],
"dependencies": {
- "extract-domain": "~2.0.3",
"nanoclamp": "~1.2.6"
},
"devDependencies": {
diff --git a/packages/react-microlink/src/components/Card/CardContent.js b/packages/react-microlink/src/components/Card/CardContent.js
index 03dce754a..52dc0df21 100644
--- a/packages/react-microlink/src/components/Card/CardContent.js
+++ b/packages/react-microlink/src/components/Card/CardContent.js
@@ -1,10 +1,18 @@
+/* global URL */
+
import React from 'react'
import styled, { css } from 'styled-components'
-import extractDomain from 'extract-domain'
import CardText from './CardText'
import { media } from '../../utils'
+const REGEX_STRIP_WWW = /^www\./
+
+const getHostname = href => {
+ const { hostname } = new URL(href)
+ return hostname.replace(REGEX_STRIP_WWW, '')
+}
+
const isLarge = cardSize => cardSize === 'large'
const largeContentStyle = css`
@@ -68,7 +76,7 @@ export default ({ title, description, url, cardSize, className }) => (
{description}
- {extractDomain(url)}
+ {getHostname(url)}
)
diff --git a/packages/react-microlink/stories/data.js b/packages/react-microlink/stories/data.js
index 4ff866734..377561181 100644
--- a/packages/react-microlink/stories/data.js
+++ b/packages/react-microlink/stories/data.js
@@ -9,7 +9,9 @@ export const urls = [
'http://es.engadget.com/2017/10/23/meizu-m6-note-analisis-review-fotos',
'https://www.nytimes.com/2017/09/19/learning/whats-going-on-in-this-graph-sept-19-2017.html',
'https://gizmodo.com/drone-video-of-border-wall-prototypes-accidentally-show-1819710328',
- 'https://www.bbc.com/news/technology-40762328'
+ 'https://www.bbc.com/news/technology-40762328',
+ 'https://browserless.js.org',
+ 'https://xn--vi8hl0c.ws/'
]
export const urlsVideo = [