palantir · adidahiya · Dec 12, 2017 · Dec 11, 2017 · Dec 11, 2017 · Dec 11, 2017
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -47,7 +47,6 @@
   "devDependencies": {
     "@blueprintjs/karma-build-scripts": "^0.2.0",
     "@blueprintjs/node-build-scripts": "^0.2.0",
-    "bourbon": "^4.3.4",
     "enzyme": "~2.9.1",
     "karma": "^1.7.1",
     "mocha": "^4.0.1",

diff --git a/packages/core/src/_typography.scss b/packages/core/src/_typography.scss
@@ -190,10 +190,11 @@ Markup:
 <pre>
 %pt-select {
   @include pt-button();
-  @include prefixer(appearance, none, webkit moz);
   border-radius: $pt-border-radius;
   height: $pt-button-height;
   padding: 0 ($input-padding-horizontal * 3) 0 $input-padding-horizontal;
+  -moz-appearance: none;
+  -webkit-appearance: none;
 }
 </pre>
 <pre><code>export function hasModifier(modifiers: ts.ModifiersArray, ...modifierKinds: ts.SyntaxKind[]) {

diff --git a/packages/core/src/common/_font-imports.scss b/packages/core/src/common/_font-imports.scss
@@ -1,7 +1,7 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
+@import "utils/font-face";
 @import "variables";
 
 $icon-font-path: "../resources/icons" !default;

diff --git a/packages/core/src/common/_icons.scss b/packages/core/src/common/_icons.scss
@@ -18,7 +18,7 @@ $icon-classes: (
 
 @mixin pt-icon-sized(
   $font-size: $pt-icon-size-standard,
-  $font-family-size: strip-units($font-size)
+  $font-family-size: strip-unit($font-size)
 ) {
   line-height: 1;
   font-family: "Icons#{$font-family-size}", sans-serif;
@@ -45,7 +45,7 @@ $icon-classes: (
 
 @mixin pt-icon(
   $font-size: $pt-icon-size-standard,
-  $font-family-size: strip-units($font-size)
+  $font-family-size: strip-unit($font-size)
 ) {
   @include pt-icon-sized($font-size, $font-family-size);
   @include pt-icon-font-smoothing();

diff --git a/packages/core/src/common/_mixins.scss b/packages/core/src/common/_mixins.scss
@@ -24,6 +24,14 @@ $pt-dark-intent-text-colors: (
   "danger" : $red5,
 ) !default;
 
+@mixin position-all($position, $value) {
+  position: $position;
+  top: $value;
+  right: $value;
+  bottom: $value;
+  left: $value;
+}
+
 @mixin base-typography() {
   text-transform: none;
   line-height: $pt-line-height;
@@ -55,7 +63,6 @@ $pt-dark-intent-text-colors: (
 }
 
 @mixin overflow-ellipsis() {
-  // NOTE: not to be confused with Bourbon ellipsis() which sets `display: inline-block` :(
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -105,3 +112,13 @@ $pt-dark-intent-text-colors: (
 @function centered-text($height, $line-height: floor($pt-font-size * $pt-line-height)) {
   @return floor(($height - $line-height) / 2);
 }
+
+// Removes the unit from a Sass numeric value (if present): `strip-unit(12px) => 12`
+// @see https://css-tricks.com/snippets/sass/strip-unit-function/
+@function strip-unit($number) {
+  @if type-of($number) == "number" and not unitless($number) {
+    @return $number / ($number * 0 + 1);
+  }
+
+  @return $number;
+}
diff --git a/packages/core/src/common/_variables.scss b/packages/core/src/common/_variables.scss
@@ -4,9 +4,6 @@
 @import "colors";
 @import "mixins";
 
-// This line can be removed when we upgrade to Bourbon 5.0
-$output-bourbon-deprecation-warnings: false;
-
 // easily the most important variable, so it comes first
 // (so other variables can use it to define themselves)
 $pt-grid-size: 10px !default;

diff --git a/packages/core/src/common/utils/_font-face.scss b/packages/core/src/common/utils/_font-face.scss
@@ -0,0 +1,82 @@
+// Copyright 2017 Palantir Technologies, Inc. All rights reserved.
+// Licensed under the terms of the LICENSE file distributed with this project.
+
+// these implementations borrowed from Bourbon v5, and modified to fit our use cases.
+// changes: removed $asset-pipeline argument, added weight/style params like Bourbon v4.
+// https://github.com/thoughtbot/bourbon/blob/master/core/bourbon/library/_font-face.scss
+// https://github.com/thoughtbot/bourbon/blob/master/core/bourbon/utilities/_font-source-declaration.scss
+
+// Generates an `@font-face` declaration. You can choose the specific file
+// formats you need to output; the mixin supports `eot`, `ttf`, `svg`, `woff2`
+// and `woff`.
+//
+// @argument {string} $font-family
+//
+// @argument {string} $file-path
+//
+// @argument {string | list} $file-formats
+//   List of the font file formats to include.
+//
+// @argument {string} $weight
+//
+// @argument {string} $style
+//
+// @content
+//   Any additional CSS properties that are included in the `@include`
+//   directive will be output within the `@font-face` declaration, e.g. you can
+//   pass in `font-weight`, `font-style` and/or `unicode-range`.
+@mixin font-face(
+  $font-family,
+  $file-path,
+  $file-formats,
+  $font-weight: normal,
+  $font-style: normal
+) {
+  @font-face {
+    font-family: $font-family;
+    font-weight: $font-weight;
+    font-style: $font-style;
+
+    src: font-source-declaration(
+      $font-family,
+      $file-path,
+      $file-formats
+    );
+
+    @content;
+  }
+}
+
+@function font-source-declaration($font-family, $file-path, $file-formats) {
+  $src: ();
+
+  $formats-map: (
+    eot:   "#{$file-path}.eot?#iefix" format("embedded-opentype"),
+    woff2: "#{$file-path}.woff2" format("woff2"),
+    woff:  "#{$file-path}.woff" format("woff"),
+    ttf:   "#{$file-path}.ttf" format("truetype"),
+    svg:   "#{$file-path}.svg##{$font-family}" format("svg"),
+  );
+
+  @each $key, $values in $formats-map {
+    @if list-contains($file-formats, $key) {
+      $file-path: nth($values, 1);
+      $font-format: nth($values, 2);
+
+      $src: append($src, url($file-path) $font-format, comma);
+    }
+  }
+
+  @return $src;
+}
+
+// Returns true if `$list` contains any of `$values`.
+@function list-contains($list, $values...) {
+  @each $value in $values {
+    @if type-of(index($list, $value)) != "number" {
+      @return false;
+    }
+  }
+
+  @return true;
+}
diff --git a/packages/core/src/components/breadcrumbs/_breadcrumbs.scss b/packages/core/src/components/breadcrumbs/_breadcrumbs.scss
@@ -1,7 +1,6 @@
 // Copyright 2016 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/icons";
 @import "../../common/variables";
 

diff --git a/packages/core/src/components/button/_button-group.scss b/packages/core/src/components/button/_button-group.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../forms/common";
 @import "./common";

diff --git a/packages/core/src/components/button/_button.scss b/packages/core/src/components/button/_button.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "./common";
 

diff --git a/packages/core/src/components/callout/_callout.scss b/packages/core/src/components/callout/_callout.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 
 /*
@@ -34,7 +33,9 @@ Styleguide pt-callout
 
     &::before {
       @include pt-icon($pt-icon-size-large);
-      @include position(absolute, $pt-grid-size null null $pt-grid-size);
+      position: absolute;
+      top: $pt-grid-size;
+      left: $pt-grid-size;
       color: $pt-icon-color;
     }
   }

diff --git a/packages/core/src/components/dialog/_dialog.scss b/packages/core/src/components/dialog/_dialog.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/icons";
 @import "../../common/mixins";
 @import "../../common/react-transition";

diff --git a/packages/core/src/components/editable-text/_editable-text.scss b/packages/core/src/components/editable-text/_editable-text.scss
@@ -1,7 +1,6 @@
 // Copyright 2016 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../forms/common";
 
@@ -15,7 +14,7 @@
 
   // input styles on the ::before
   &::before {
-    @include position(absolute, (-$pt-border-radius) (-$pt-border-radius));
+    @include position-all(absolute, -$pt-border-radius);
     border-radius: $pt-border-radius;
     content: "";
     transition: background-color $pt-transition-duration $pt-transition-ease,

diff --git a/packages/core/src/components/forms/_common.scss b/packages/core/src/components/forms/_common.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/icons";
 @import "../../common/variables";
 @import "../button/common";
@@ -225,10 +224,14 @@ $control-group-stack: (
 %pt-select {
   @include pt-button-base();
   @include pt-button();
-  @include prefixer(appearance, none, webkit moz);
   border-radius: $pt-border-radius;
   height: $pt-button-height;
   padding: 0 ($input-padding-horizontal * 2.5) 0 $input-padding-horizontal;
+
+  // stylelint-disable property-no-vendor-prefix
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  // stylelint-enable property-no-vendor-prefix
 }
 
 %pt-select-minimal {

diff --git a/packages/core/src/components/navbar/_navbar.scss b/packages/core/src/components/navbar/_navbar.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 
 /*
@@ -57,7 +56,10 @@ $dark-navbar-background-color: $dark-gray5 !default;
   }
 
   &.pt-fixed-top {
-    @include position(fixed, 0 0 null);
+    position: fixed;
+    top: 0;
+    right: 0;
+    left: 0;
   }
 
   .pt-logo {

diff --git a/packages/core/src/components/overlay/_overlay.scss b/packages/core/src/components/overlay/_overlay.scss
@@ -12,7 +12,7 @@ body.pt-overlay-open {
 
 .pt-overlay {
   // 0-out all positions so page won't jump when position changes (0s already there)
-  @include position(static, 0);
+  @include position-all(static, 0);
   z-index: $pt-z-index-overlay;
 
   &:not(.pt-overlay-open) {
@@ -57,7 +57,7 @@ body.pt-overlay-open {
 
 // fixed position so the backdrop forecefully covers the whole screen
 .pt-overlay-backdrop {
-  @include position(fixed, 0);
+  @include position-all(fixed, 0);
   @include react-transition(
     "pt-overlay",
     (opacity: 0 1),

diff --git a/packages/core/src/components/popover/_common.scss b/packages/core/src/components/popover/_common.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../../common/react-transition";
 

diff --git a/packages/core/src/components/progress/_progress-bar.scss b/packages/core/src/components/progress/_progress-bar.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../progress/common";
 

diff --git a/packages/core/src/components/spinner/_spinner.scss b/packages/core/src/components/spinner/_spinner.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../progress/common";
 @import "./common";

diff --git a/packages/core/src/components/tabs/_tabs.scss b/packages/core/src/components/tabs/_tabs.scss
@@ -143,7 +143,10 @@ $tab-indicator-width: 3px !default;
   pointer-events: none;
 
   .pt-tab-indicator {
-    @include position(absolute, null 0 0);
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    left: 0;
     background-color: $tab-color-selected;
     height: $tab-indicator-width;
   }

diff --git a/packages/core/src/components/toast/_toast.scss b/packages/core/src/components/toast/_toast.scss
@@ -1,7 +1,6 @@
 // Copyright 2016 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../../common/react-transition";
 
@@ -147,7 +146,10 @@ $toast-margin: $pt-grid-size * 2 !default;
 }
 
 .pt-toast-container {
-  @include position(fixed, null 0 null);
+  position: fixed;
+  right: 0;
+  left: 0;
+
   // #975 ensure toasts are on top of everything (esp dialogs)
   z-index: $pt-z-index-overlay * 2;
   // toasts have margin-top so omit it on container

diff --git a/packages/core/src/components/tooltip/_tooltip.scss b/packages/core/src/components/tooltip/_tooltip.scss
@@ -1,7 +1,6 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the terms of the LICENSE file distributed with this project.
 
-@import "~bourbon/app/assets/stylesheets/bourbon";
 @import "../../common/variables";
 @import "../popover/common";
 @import "./common";

diff --git a/packages/datetime/package.json b/packages/datetime/package.json
@@ -37,7 +37,6 @@
   "devDependencies": {
     "@blueprintjs/karma-build-scripts": "^0.2.0",
     "@blueprintjs/node-build-scripts": "^0.2.0",
-    "bourbon": "^4.3.4",
     "enzyme": "~2.9.1",
     "karma": "^1.7.1",
     "mocha": "^4.0.1",